Adding video to product slideshow

Highlighted
Tourist
9 0 1

Hi everyone,

Is there a way to add a video that automatically turns on to the products slide show in the Turbo theme from OUT OF THE SANDBOX? Or is this something I have to take up with them and not Shopify? Thanks!

 

0 Likes
Shopify Staff
Shopify Staff
454 22 54

Hey, @Roger17!

 

Ava here from Shopify :)

 

If you are using a third-party theme, you could definitely reach out to your theme developers are check if they can add in some additional coding for you. The only themes we at Shopify can help out with are ones we have designed in-house. These would be all of the free themes available in the theme store! 

 

However, you do have a few options here if your theme developers are not able to help out. There is a way to add a video to a product image, but it is not a guaranteed result. This is because this is a "theme dependant" hack, meaning if your theme does not support this method, it most likely will not work for you.

Your theme needs to use javascript to check for the existence of an embed code in the alt tag of the images, so if your theme does not have this function, this workaround will not work for you. This workaround is mentioned in this forum post, and it does seem to have a mixed success rate. I'll run through the steps just in case!

 

First, you will need to upload the video to YouTube or Vimeo first, as it requires an embed code. After you have done that, you will need to add another image to your product in the Shopify admin. This is the image you will attach the video to. I would recommend adding a thumbnail image of the video so that the 'play' button is in the center of the image, indicating to the customer this is a video and not a static image. I'd recommend using a photo editor tool like pixlr.com to achieve this! After you have uploaded the video and added the correct image to the product page, you can go ahead with the below steps.

 

Go to youtube.com and select the video you would like to add. If you scroll until you see the 'share' button, you can click here and select 'embed'. Here, you will see an embed code, it will begin with <iframe. Copy that whole piece of code to your clipboard.

Next, you can go back to your Shopify admin section and select the product you want to add the video to. If you can hover over the variant image, you can then click on the 'ALT' text option. Here, you can paste the iframe embed code. Save your changes! I have made a video of the process here if you wanted to check it out.

 

Again, this method can work, but only on some themes. Even in my test store, this method worked on the Parallax theme, but not the Narrative theme.

 

If the above does not work for you, you do have the option of using a page builder app. This way, you have more creative control over how your pages are displayed. There is a range of page building apps here to choose from!

 

Finally, if none of those options sound like they would work for you, you should be able to do this with the help of a developer! You can actually post a job on the Shopify Experts Page and see what feedback and quotes you get. You can find where and how to do this here.

 

Let me know what you think!

 

Ava

Ava | Social Care @ Shopify
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit the Shopify Help Center or the Shopify Blog

0 Likes