Hide Price of Certain (Tagged) Products in Stiletto Theme

Hide Price of Certain (Tagged) Products in Stiletto Theme

journeylab
Shopify Partner
14 0 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!

Replies 2 (2)

PaulNewton
Shopify Partner
6419 585 1362

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.

Save time & money ,Ask Questions The Smart Way


Confused? Busy? Get the solution you need paull.newton+shopifyforum@gmail.com


Problem Solved? ✔Accept and Like solutions to help future merchants

Answers powered by coffee Buy Paul a Coffee for more answers or donate to eff.org


mosquecarpets
Visitor
1 0 0

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