Clicking an image to change variant

Shopify Discussion
4
  1. In the left-hand sidebar, locate and click on the “product-template.liquid” file under the “Sections” folder.
  2. Look for the code that renders the product images. It might be within a <div> element with a class like product-single__media-wrapper or product-single__photo.
  3. Find the code that creates the clickable image, which is likely an <a> tag or a <div> container. Add the following code inside that element:
onclick="selectVariant(event)"
data-variant-id="{{ variant.id }}"
​
  1. Save the changes to the file.
  2. Still in the “Sections” folder, locate and click on the “product-form.liquid” file.
  3. Inside this file, find the JavaScript section (typically at the bottom) and add the following code:

​