How To Show Only Selected Variant Images – Shopify Debut Theme

Do you want to show only selected variant images on your Shopify store? In this tutorial, we’ll show you how to do just that using the Debut theme. This is a great way to highlight your most popular items or featured products. Let’s get started!

Show Only Selected Variant Images

Add Code in Theme.liquid File – First Step

Add following code below <head> in “Theme.liquid” file

Add Code in Product-template.liquid – Second Step:

Add thumbnail-color=”{{ media.alt }}” as shown in the screenshot below:

show only selected variant images

 

Add Alt Text on All Product Media Gallery – Third Step:

Now the second step is to Alt Text as per the color variation of your product.

Dashboard -> Products -> Edit Product
On the Edit Product screen you will see the Media section just like the screenshot below:

media section shopify dashbaord

Click on all the media images and add Alt Text as per the screenshot below:

adding alt tags - shopify products

Add JS Code – Fourth Step:

Now edit “theme.js” file and add this._filterThumbnails(variant); on line number 766. After adding this code add following JS function in “theme.js” file on line number 786:

Make sure to include jQuery on your Shopify theme. Once done you should be able to see only selected variant images.

5/5 - (7 votes)

About

2 thoughts on “How To Show Only Selected Variant Images – Shopify Debut Theme”

  1. Hello! Thank you so much for the tutorial. Do you have any tips on how to do this with the Pipeline theme? Everything worked perfectly until the fourth step.

Leave a Comment

Your email address will not be published.