Hi Hey_Jak, I’m trying to implement this on a paid theme called Lorenza which seems to not have this option either. Where do I find your code to copy-past the .js to make this happen? Thank you very much, this video is really clear and easy to follow!
Topic summary
A merchant seeks to display only variant-specific images when a color option is selected, rather than showing all variant images in the product gallery simultaneously. The issue causes cluttered product pages with numerous thumbnails.
Proposed Solutions:
- CSS hiding: Simple approach to hide thumbnail gallery, but removes all thumbnails including non-variant images
- Liquid code filtering: Use
image.attached_to_variantobject or alt-tag identification to conditionally display images. Requires editing product-template.liquid file with code like{% if image.attached_to_variant == false %} - Third-party apps: Rubik Variant Images and Multiple Variant Images apps offer no-code solutions
- Custom JavaScript: Community member Hey_Jak provides a tutorial and code solution, though zoom functionality requires additional custom development
Key Challenges:
- Shopify lacks native bulk deletion for variant images; CSV export/import workaround required
- Implementation requires Liquid/HTML knowledge or Shopify’s 60-minute complimentary Theme Support (available with paid plans)
- Custom themes may have different file structures than standard Shopify themes
Status: Multiple participants report varying success with code-based solutions. The discussion remains active with ongoing requests for implementation guidance and feature additions like image zoom.