ELEVATE YOUR STYLE WITH EXQUISITE BESPOKE JEWELRY
Boutique
Hide Product Prices by Tag
This block provides the CSS and Liquid code needed to hide product prices based on product tags. Products tagged with the specified tag will have their prices hidden across your entire site.
CSS Code
Copy this CSS code:
.price.price--hide-price,
.price-item.price-item--hide-price,
[data-price-hide="true"] .price,
[data-price-hide="true"] .price-item {
display: none !important;
}
Liquid Code (Product Cards)
Wrap price elements in product cards with:
{% if card_product.tags contains 'hide-price' %}
Liquid Code (Product Pages)
Wrap price elements on product pages with:
{% if product.tags contains 'hide-price' %}
Implementation Steps:
- Copy the CSS code above and add it to your theme's custom CSS file or in the theme customizer under Custom CSS
- Find your product card snippet (usually card-product.liquid or similar)
- Locate the price display elements and wrap them with the Liquid code for product cards
- Find your product page template (usually main-product.liquid or product-template.liquid)
- Locate the price display elements and wrap them with the Liquid code for product pages
- Save all changes and test by adding the "hide-price" tag to a product
How to Use:
To hide prices for any product, simply add this tag to the product in your Shopify admin:
hide-price
Products without this tag will display prices normally. This works across collection pages, product pages, search results, and anywhere else products are displayed.
- Choosing a selection results in a full page refresh.
- Opens in a new window.