Adding video as a product "image" [Debut]

New Member
3 0 0

Hi guys, we have been struggling to implement a vimeo embedded video as one of the product photos in the gallery (as shown on the attached screenshot). So far, we have managed to set it above image gallery but we want it to be displayed as one of the images. We would really appreciate any tips on how to set it properly.
Here is a code snippet:
<ul class="grid grid--uniform product-single__thumbnails product-single__thumbnails-{{ }}">
{% for image in product.images %}
<li class="grid__item {{ product_thumbnail_width }} product-single__thumbnails-item js">
<a href="{{ image.src | img_url: product_image_zoom_size, scale: product_image_scale }}"
class="text-link product-single__thumbnail product-single__thumbnail--{{ }}"
data-thumbnail-id="{{ }}"
{% if enable_zoom %}data-zoom="{{ image.src | img_url: product_image_zoom_size, scale: product_image_scale }}"{% endif %}>
<img class="product-single__thumbnail-image" src="{{ image.src | img_url: '110x110', scale: 2 }}" alt="{{ 'sections.featured_product.gallery_thumbnail_alt' | t: imageAlt: image.alt | escape }}">
{% endfor %}

Best wishes


Hello ,
Please share your site url.
So that i can check and provide you exact solution here.

Want to modify or incorporate custom changes on store, Hire us.
If helpful then please Like and Accept Solution .
Skype : oscprofessionals-87
Free Review and advice for sale on store | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | SEO & Digital Marketing | Site Speed Optimization | Performance Site Audit