Hi everyone,
I’m using the Tinker theme. On the product page, the variant image is currently shown first.
How can I change this so the main product image is shown first instead?
Thanks!
You’re probably not missing a setting. Shopify still uses the first media item as the featured image, but Tinker currently opens the product page on the selected variant’s assigned image; the same limitation is showing up in current Tinker feedback.
Do you want the main image only on the initial page load, while clicking a variant should still switch to its image? If so, this is likely a small Tinker media-gallery initialization change, but the exact edit depends on the theme version. I’d duplicate the theme before touching code rather than paste a snippet written for Dawn.
Which Tinker version are you on?
Hey! This isn’t a missing setting - it’s how Tinker’s gallery behaves.
Shopify always treats the first image in your product’s media as the “main” image. But if a customer lands on the page with a specific variant pre-selected (e.g. via a ?variant=123 link from an ad or email), the gallery jumps to that variant’s image instead.
Quick things to check:
- Drag your intended main image to the first position in the product’s media gallery.
- Check each variant’s assigned image (Product > variant > Image) - make sure your main image isn’t tied to just one variant.
- See if your traffic links include a
?variant=parameter - that’s often the real cause.
If it still happens, it likely needs a small JS tweak to the theme’s gallery initialization so it always defaults to the first image. Worth duplicating your theme first if you go that route.
@spingar Before any code, worth trying the no code version, because it works on some themes and takes a minute.
The gallery opens on whichever variant Shopify auto selects when theres no variant in the URL, which is your first available one. If that variant has an image assigned to it, thats what you land on. So unassign the image from that first variant and the gallery usually falls back to the products first media, which is your main image. Test it on one product before doing it everywhere, since it does mean that one variant no longer has its own image.
The other native option, if your hero shot happens to be one of the variant images, is just to reorder the variants so that one sits first.
One thing worth checking either way. Your collection pages and link previews use the products first image. If the product page then opens on a different one, someone clicks a thumbnail and lands on a page showing something else, which reads as a glitch. Might be part of why this is bothering you.
And if you do end up editing theme code, note it down somewhere. Theme updates overwrite those files, and this is exactly the kind of small change that silently disappears six months later and nobody remembers making it.
In Tinker, this usually comes down to the theme picking the first available variant media, not a hidden setting. Make sure the product’s first media item is the image you want shown by default, and then look at the variant image assignments, since if the first available variant has its own image tied to it, the gallery will often jump there on load.
If you want the main image to stay first even when a variant is preselected, that usually needs a small theme edit in the product media logic. I’ve run into this kind of thing on a few Shopify builds, and the fix was usually in the theme file that decides which media gets marked active on page load.
If you want, drop the store link and we can take a closer look.
Hi @spingar
If Tinker is displaying the variant image first for some selected variant, it turns out this behavior is generally controlled by your theme’s product media settings and handling of variant selection. Check in the Theme Editor for Product or Product details to see if there’s a Variant Media/Media Order option.
If one does not exist you can alter the product media logic in your theme code so that the featured product image is still first but then the variant images follow. Make a copy of your theme before you make any changes.
There are two slightly different goals:
- Always open the product on the main/cover image, but still switch to the relevant image when the customer actively changes a variant.
- Keep the main image first even after a variant is selected.
I’d personally prefer the first for most stores because the cover image still controls the initial presentation, but the customer gets visual feedback when they make a selection.
It’s worth defining that before changing the theme because otherwise you can fix the opening image and accidentally make variant selection feel less responsive.