How do I show a different thumbnail on collection page?

Store Design
, ,

Topic summary

Goal: show a different product thumbnail on collection pages than the main product image in Shopify.

Key point: Shopify doesn’t support this natively. A separate image must be stored via a custom field (metafield).

Proposed approach:

  • Create a metafield to hold a “collection thumbnail” image for each product.
  • Manage this field using an app such as “Custom Fields” or “Metafields Guru.”
  • Update the theme code to reference and display this metafield image on collection pages.

Notes:

  • Metafields are custom data fields that let you store extra information per product.
  • This requires theme customization; no code snippet was provided.

Status: Feasible with apps and theme edits; no final resolution or implementation details yet.

Summarized with AI on December 22. AI used: gpt-5.
1

Howdy crew,

How would I go about showing a different thumbnail on a collection page versus the main image within the product page? Or even, a completely different thumbnail altogether? Is there an app for that?

2

you can use a custom field or metafield to upload a separate image for the collection thumbnail. Shopify doesn’t have this feature built-in, so you’d need to customize your theme or use an app like “Custom Fields” or “Metafields Guru” to handle it. Once set up, you can then adjust your theme code to display this custom image on the collection pages. It’s a bit of work but totally doable!

1 Like