Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

  1. In the CMS, go to Products & Categories → Product Maintenance

  2. Search for the required product code and click Edit.

  3. Scroll to the Media section and click Add Video.


  4. Select the Video Type (YouTube or Vimeo). 

  5. In Description, enter a name for the video. 

  6. Enter the Video ID code or the full/shortened URL.

    Example of URL:
    Image Added
    Example of Video ID:
    Image Added 

  7. Click Add. You should see your Your video thumbnail is added to the Media list for the product. 
    Image Added

  8. Click Save or Save and Exit

  9. In another browser (or incognito tab), load the product detail page for the product you edited. You'll see that your video has been added to the image gallery. 

...

In some cases, you may wish to spotlight a particular video on a product page. In this case, you can use the Product Video widget to place the video in both the image gallery and elsewhere on the page.   This is great if you've got lots of media in the product gallery, and want to be certain your users take notice of a particular video. Add the Product Video Widget in the zone to display the video. 


In the following example, we'll add a Video widget to the product detail page, and tag certain videos that we'd like this widget to display. 

  1. Follow the steps above to add a video to the product gallery. 

  2. After adding the video, click 'Add Tag...'. 

  3. Enter a tag into the field (which you will reference later) and click 'Save'.

    Tip

    Edit other products to add this tag to their applicable videos. If the widget detects a video in the gallery with the specified tag, it will render it on the product detail page. If there are no videos with matching tags, the widget will simply be hidden.


  4. Navigate Go to Content → Standard Pages Pages & Templates → Products

  5. Select the Product Detail template.

  6. Select the appropriate zone for your product video, according to your page layout and click 'Add Widget'.

  7. Search for the Product Video widget and click 'Add 'Widget.

  8. Edit the Product Video widget you just added.

  9. In the 'Video Tag' field, enter the tag from the video you added previously. 
    Image RemovedImage Added

  10. Set the hex text colour for Vimeo (if applicable), edit the heading options and click 'Save'. 

  11. In another browser (or incognito tab), load the product detail page for the product you edited. Your video will now appear on the page as well as in the gallery.

...