It is possible to add a video to a product page in order to better present your product to your visitors.
Two methods are available:
Add a video to the images of your product page, so it appears directly among the product visuals.
Add a video to the product description, by embedding a video player within the page content.
Add a video to the product image gallery
You can associate a video with an image from the Image Manager so that it appears in your product page gallery.
To do this, you must use a background image. This image will serve as a preview and will be displayed in the gallery before the video is played.
Steps to add a video
Go to Content > Image Manager
Import the background image you want to use
Hover your mouse over the imported image
Click Add a video
Paste the video URL (From YouTube or Vimeo only)
Click Save
The image is now associated with a video.
Add the image with video to a product page
Go to the product page concerned
In the Images section, add the image associated with the video
Save or publish your product
The video will then be available in the product image gallery.
☝️ Good to know
In the WiziBlock Product list or on the category page, only the background image will be displayed.
The video can only be played from the product page.
From the Image Manager, you can easily find these visuals by using Filter by > Images with video.
Add a video to the product description
To display a video on your product page, it must be available as an "iframe".
The iframe is what allows you to have a small insert dedicated to the video on your page so that it's displayed in full (and not just the URL of the video, such as https://... which you'll have to click on).
To obtain this display, your video must be hosted, for example, on YouTube or Dailymotion, both services allowing automatic iframe display.
Here's how to add a video:
Get the iframe of the video you want
Go to Youtube and the page of the video you wish to insert on your product page
Click on the "Share" link, then on "Embed".
Then copy the Iframe code
Add the video to your product sheet
Go to the relevant product sheet
Highlight or select the text to access the text editor
Click on the Code Edit button marked </>
Add the iframe copied from your video
Click on the Save button
☝️ Good to know
If you're unable to retrieve the video iframe, enter this line of code, adding the link to your video: <iframe allowfullscreen="" frameborder="0" height="1000" width="800" src="LINK URL" ></iframe>
If you'd like to add a video to your home page or a free page, and you're operating on WiziBlocks, feel free to use WiziBlocks Background Video and Play video.
💬 Feel free to contact your Business Coaches if you have any questions!