How to hide a metafield badge on product cards (Theme: Prestige)

Store Design
, , , ,

Topic summary

Goal: Hide custom metafield badges on product cards (collection page) in the Prestige theme while keeping them visible on individual product pages.

Key steps proposed:

  • Supporter confirmed it’s feasible and requested the store URL.
  • Store URL was provided (fruitloots.com).
  • Guidance given to implement via theme code: open Edit Code → theme.liquid → paste code just below the tag. A screenshot was attached to illustrate placement.

Notes:

  • The actual code snippet to hide the badges is not visible in the shared content, so the precise CSS/JS is unclear.
  • The attached image (shopify.head.jpg) appears central to understanding where to add the code.

Status and outcomes:

  • No confirmation that the change worked; solution appears pending the correct code insertion.
  • Action item: Insert the provided (but not shown) code under in theme.liquid to hide collection-page badges.

Open questions:

  • What is the exact code to target metafield badges on product cards?
  • Has the change been tested and confirmed on the live site?
Summarized with AI on December 28. AI used: gpt-5.
1

Hi there! I was able to add custom badges to my site, and I’m happy with the way they show on the product page/description. But I would like them hidden on the actual product cards on the collection page. Can someone help me out?

Thanks in advance!

Allan @HeyFruitloots

2

Hi!

Your request can be done. Can you send me the link to your website?

Terence

3

Hi Terence! My site is www.fruitloots.com

4

Hi again,

The following code will do what you want. If you encounter any issues again, feel free to write, I’ll help.

  1. Navigate to the ‘Edit Code’ option in your theme settings, then search for ‘theme.liquid’ in the search bar.

  2. Paste the following code below the ‘’ tag. Please refer to the attached screenshot for guidance.

shopify.head.jpg
shopify.head.jpg1366×545 61.8 KB