Hide Price of Certain (Tagged) Products in Stiletto Theme

Technical Q&A
, , , ,

Topic summary

Goal: Hide prices for products tagged “hide-price” across the Stiletto theme, especially in quick search and main search. The asker tried Liquid conditionals and CSS selectors targeting data-tags but prices still render.

Key insights:

  • Prices may be injected by JavaScript or separate partials. Check search-related snippets (e.g., search product cards/price components) and other Liquid files that output prices.
  • Quick diagnostic: disable JavaScript; if prices disappear or change, the theme likely populates prices dynamically. Then either customize the JS, use Shopify’s section-rendering (async section updates) considerations, or alter product data exposed in on-page JSON so price is blank/replaced when tag is present.

Workaround shared:

  • Create dedicated product and collection templates for “no-price” items. Add CSS to those templates to hide .product-item__price and .product__price, remove buy/quantity controls, and insert a “call for price” message. Assign affected products to these templates.

Status: No confirmed fix for search results via tag logic; discussion remains open. Next steps: audit theme files used by search, test with JS disabled, and adjust JS/data or implement the template-based workaround. Code snippets are central to understanding the approaches.

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

Hello Shopify Community,

I’m facing an issue with the Stiletto Theme by Fluorescent, and I’m hoping to get some assistance in resolving it. I have products tagged with ‘hide-price’ in my Shopify store, and I want to hide the prices for these specific products across the entire site — particularly in both the quick search results and the main search results.

I have found it easy to remove the prices from the collection & product pages — but need this tagging logic to remove it when these products are mixed in with others.

Here’s the liquid code I’ve tried:

{%- comment -%}
  Add a check for the "hide-price" tag here
  {%- endcomment -%}
  {%- assign hide_price_tag = false -%}
  {%- if product.tags contains 'hide-price' -%}
    {%- assign hide_price_tag = true -%}
  {%- endif -%}

  {%- comment -%}
  Modify the price display based on the "hide-price" tag
  {%- endcomment -%}
  {%- if hide_price_tag -%}
    <p class="product-price">Inquire for Price</p>
  {%- else -%}
    assign money_price = price | money
    <p class="product-price">{{ money_price }}</p>
  {%- endif -%}

And even some CSS code:

/* Hide prices for products with the 'hide-price' tag in quick search results */
.quick-search__result--product[data-tags*='hide-price'] .quick-search__result-price {
    display: none;
}

/* Hide prices for products with the 'hide-price' tag in the main search results */
.product-item--product[data-tags*='hide-price'] .product-item__price {
    display: none;
}

However, nothing works. The prices for the tagged products are still visible.

I’ve double-checked that the ‘hide-price’ tag is correctly applied to these products in Shopify. I’ve also ensured that the custom CSS is placed in the theme’s CSS file. But despite these efforts, I’m unable to hide the prices for the tagged products.

I’m wondering if there might be something specific to the Stiletto Theme or if I’m missing something. Could anyone with experience in the Stiletto Theme offer some guidance on how to properly hide prices for products with the ‘hide-price’ tag in this theme?

Any insights, suggestions, or alternative methods to achieve this would be greatly appreciated. Thank you for your help!

Question:

  • Has anyone successfully hidden prices for products with a specific tag in the Stiletto Theme by Fluorescent?
  • Are there any theme-specific nuances I should be aware of when customizing this theme?

Thank you for your time and expertise!

2

Hello @journeylab You need to double check for other liquid files that may display the prices, ie. search-product-card, search-product-price, etc.

This may also require customizing the themes javascript if it is dynamically filing in information.

Quick way to check is disable javascript for the site and reload pages.

If so then it’s either customize the javascript or try to change the underlying data it’s using.

In some themes this is either the newer section-rendering api, or there’s often some element on the page that holds the products data as JSON in a script tag, it is possible to use advanced liquid to replace the price data.

If you just need this customization done for you then contact me by mail for services.
ALWAYS please provide context, examples: store url, theme name, post url(s) , or any further detail in ALL correspondence.
Contact info in signature.

Good Hunting.

3

hi Journeylab,

I am not expert, but i found a solution to the very similar issue you have.

Instead of using specific tag, i created specific collection and product line, assigned the products-with-no-price-shown, to these new templates.

1st, i created a “new collection template”, and pasted this code in Custom CSS , in the “featured collection slider”

.product-item__price {display: none;}

then, I created a “new product template”, and pasted this below code in Custom CSS, in the “product overview”

.product__price {display: none;}

on this new product template, i removed the buy buttons, quanitity selector, and inserted a new “text list with icons” block “saying call us for the price and purchase”

this solution solved what i needed to accomplish.

Hope this works out for you.

for your referance, you can check and navigate these collections at my website : mosquecarpetusa.com