Select product variants by clicking their images

Normally, variants are selected from a drop-down menu. You might want your customers to be able to select a product variant by clicking a variant image.

To select product variants by clicking a variant image:

  1. Find the theme you want to edit, and then click Actions > Edit code.

  2. In the Sections folder, open the product-template.liquid template. (If your theme is Solo or Venture, see the note above.)

  3. Copy all the code in this file hosted on GitHub.

  4. Paste the copied code at the bottom of the product-template.liquid template.

  5. Click Save.

  6. Open the theme.js or theme.js.liquid file in your Assets folder.

  7. Copy all the code in this file hosted on GitHub.

  8. Paste the copied code at the bottom of the theme.js or theme.js.liquid file.

  9. Click Save.

Ready to start selling with Shopify?

Try it free