Hide collection page price

Store Design
, , , , , , , , , , , ,

Topic summary

Issue: User needs to hide product prices on collection pages specifically for gate products (double, single, side panel, bifold, trifold gates), while keeping prices visible for other products like ironmongery, metal posts, and wood posts.

Initial Solution Offered: CSS code to hide all prices across all collection pages by targeting .card-information with display: none in base.css.

Problem: This solution was too broad—it would hide prices for all products, not just gates.

Final Solution: Custom code added to theme.liquid file (below the <head> tag) that selectively hides prices only for specific gate collections. The solution involved using <style> tags with collection-specific targeting rather than a global CSS rule.

Outcome: ✓ Resolved. The targeted approach successfully hides prices only on gate collection pages while preserving price display for other product categories.

Summarized with AI on November 11. AI used: claude-sonnet-4-5-20250929.
1

Hi, Id like to hide the price for gates on my site on the collection pages. I have already hidden the price from their product page as ill be using a price calculator, but can someone help to please remove the price from the collection page on all Gate collection pages on my site, but not “Ironmongery, Metal posts and Wooden posts” as their prices do need to be displayed on their collection pages.

So all “double, single, side panel, bifold and trifold gate” prices all need to be hidden on collection pages

https://512f21.myshopify.com/collections/double-gate

Thanks in advance

Charlie

2

This code will remove all the prices in all collections. Add it to your base.css:

.card-information {
  display: none;
}

2.PNG
2.PNG1055×512 144 KB

1 Like
3

Hi, I only need this for certain collections though. Only for gate collections, not for Ironmongery and wooden and metal posts which are on my site.

4

Hey @CraigReep ,

Go to your theme’s “Edit Code” Option, then in the search bar type “theme.liquid”
Below the tag “” tag paste the following. Screenshot attached for reference.

If you want to add it to base.css, just remove the tags.

Screenshot is for reference only, the correct code to paste is the one shown above.

ThePrimeWeb_0-1710935634680.jpeg
ThePrimeWeb_0-1710935634680.jpeg1253×933 87.9 KB

1 Like
5

Works great mate, thanks very much!