Shopify Dawn Theme — Variant Image Filter Snippet (Alt Text Method)

We need an experienced Shopify developer to build a lightweight JavaScript snippet that filters product gallery images based on the selected variant option. This is a focused, well-defined task with a complete technical spec already written. No new templates, no redesign work, no Shopify Plus required. --- THE TASK Build a single Liquid snippet called variant-image-filter.liquid that filters the product media gallery to show only the images and videos that match the currently selected variant option. The snippet must be injected into the existing Dawn theme (version 13.01) product template and gated by a metafield condition so it only activates on products where we have enabled it via a custom metafield called custom.variant_image_filter set to true. The sample snippet is below with curly braces represented by (insert curly brace): (insert curly brace)% if product.metafields.custom.variant_image_filter == 'true' %(insert curly brace) (insert curly brace)% render 'variant-image-filter' %(insert curly brace) (insert curly brace)% endif %(insert curly brace) --- HOW IT WORKS Our team pre-applys structured alt text to every product image via Matrixify bulk import. The alt text convention is: Product Title | Option Name: Option Value Examples: 10K Gold Butterfly Nugget Ring | Face Size: Small 10K Gold Ring | Color: Yellow Gold | Face Size: 10mm 10K Gold Ring | Color: White Gold | Stone: Pink Diamond | Face Size: 16mm The script listens for Shopify's native variant change event, reads the selected option values, and shows or hides gallery images and videos based on whether their alt text matches. --- DISPLAY RULES Show an image or video if ANY of these are true: - Its alt text contains no pipe symbol (universal product shot) - Its alt text contains "| always show" - Its alt text contains the currently selected variant option value(s) Hide an image or video if: - Its alt text contains a pipe symbol AND none of the pipe segments match any of the currently selected option values Videos follow the exact same rules as images. File type does not determine visibility -- alt text does. --- IMPORTANT DETAILS - The script must be fully dynamic. Do not hardcode any option names or values. The script reads whatever alt text is already on each image and matches it against the live variant selection. - Products may have 1, 2, or 3 visual differentiators in their alt text. The script must handle all combinations. - Options that do not change the visual appearance of the product (like Ring Size) are never included in alt text and should never affect image visibility. - The snippet activates via metafield only -- no changes to existing templates, no new templates created. - Must work on both desktop and mobile views of the Dawn 13.01 media gallery, and transfer over to the Dawn 15.0 media gallery since we will be updating the theme soon. - Must not break any existing Dawn theme functionality on products where the metafield is not set. --- WHAT WE ARE NOT ASKING FOR - No page redesign or layout changes - No new product templates - No Shopify Plus features - No app integrations - No admin tooling or dashboard - No alt text management -- our team applies the image alt text via Matrixify --- DELIVERABLES 1. variant-image-filter.liquid snippet file 2. Exact instruction for where to add the metafield render call in the existing Dawn product template 3. Brief notes on any edge cases handled and how to test that the snippet is working correctly on a product --- WHO WE ARE LOOKING FOR - Shopify theme developer with proven Dawn theme experience - Has built variant image filtering or conditional gallery display before - Comfortable with vanilla JavaScript and Liquid - Can work from a technical spec without hand-holding - Honest about timeline -- this is a focused task, not a large project Please include in your proposal: - Examples of similar Shopify variant or conditional display work you have done - Your honest time estimate for this specific task - Your hourly rate or fixed price quote (we prefer fixed price)