Remove a price from being displayed when product price is zero in the Express theme

[janiecolbaugh]

Hello, I need to remove the price from being displayed when the product price is set to zero. I have attempted to edit the html code by trying to find the correct snippet. I am using the Express theme. I would greatly appreciate your assistance. Many thanks!

My site is The Finery House (myshopify.com)

[neeravmakwana]

Hi, can you please check if this works for you:

In product-price.liquid file, please search for

(just after line 50) and paste {% if current_variant.price >0 %} in a new line above it.

The last line of this file is . Please paste {% endif %} in a new line above that line.

[janiecolbaugh]

Thank you. I did that but it still shows the 0.00. Any other suggestions?

[neeravmakwana]

OK, the change you made should make the price disappear from individual product cards. But you are looking at product prices in featured collections.

Can you please replace product-price-listing.liquid and product-card-list.liquid files with the attached. Please replace just 1 file first and check if that solves the problem. Replace the other only if you need to. Please let me know.

product-price-listing-liquid

{% comment %}
    Renders a list of product's price (regular, sale, unit)
    Accompanies product listings (collection page, search result) and not updated dynamically
    Accepts:
    - variant: {Object} Variant Liquid object (optional)
    - product: {Object} Product Liquid object (optional)
    - show_vendor: {Boolean} Show the product's vendor depending on the section setting (optional)

    Usage:
    {% include 'product-price-listing', product: product %}
{% endcomment %}
{%- liquid
  if product != empty
    assign compare_at_price = product.compare_at_price
    assign price = product.price
    assign available = product.available
    assign variant = product.variants.first
  else
    assign compare_at_price = 1999
    assign price = 1999
    assign available = true
  endif

  assign money_price = price | money
-%}

<dl>
  {%- comment -%}
    Explanation of description list:
      - div.price__regular: Displayed when there are no variants on sale
      - div.price__sale: Displayed when a variant is a sale
      - div.price__unit: Displayed when the first variant has a unit price
      - div.price__availability: Displayed when the product is sold out
  {%- endcomment -%}
   {% if current_variant.price >0 %}
  

    <dt>
      {{ 'products.product.regular_price' | t }}
    </dt>
    <dd>
      
        {%- if product.price_varies -%}
          {{ 'products.product.from_text_html' | t: price: money_price }}
        {%- else -%}
          {{ money_price }}
        {%- endif -%}
      
    </dd>
  

  
    

      <dt>
        {{ 'products.product.regular_price' | t }}
      </dt>
      <dd>
        <s>
          {{ compare_at_price | money }}
        </s>
      </dd>
    

    <dt>
      {{ 'products.product.sale_price' | t }}
    </dt>
    <dd>
      
        {%- if product.price_varies -%}
          {{ 'products.product.from_text_html' | t: price: money_price }}
        {%- else -%}
          {{ money_price }}
        {%- endif -%}
      
    </dd>
  

  
  
    
      {{ 'products.product.on_sale' | t }}
    
    
      {{ 'products.product.sold_out' | t }}
    
  

  
    <dt>
      {{ 'products.product.unit_price_label' | t }}
    </dt>
    <dd>
      {%- capture unit_price_separator -%}
        /{{ 'general.accessibility.unit_price_separator' | t }} 
      {%- endcapture -%}
      {%- capture unit_price_base_unit -%}
        
          {%- if variant.unit_price_measurement -%}
            {%- if variant.unit_price_measurement.reference_value != 1 -%}
              {{- variant.unit_price_measurement.reference_value -}}
            {%- endif -%}
            {{ variant.unit_price_measurement.reference_unit }}
          {%- endif -%}
        
      {%- endcapture -%}

      {{ variant.unit_price | money }}{{- unit_price_separator -}}{{- unit_price_base_unit -}}
    </dd>
  

  {% endif %}
</dl>

product-card-list.liquid

{% comment %}
    Renders a product card using "List" style

    Accepts:
    - product: {Object} Product Liquid object (optional)
    - show_vendor: {Boolean} Show the product's vendor depending on the section setting (optional)
    - show_form: {Boolean} Show the product form (optional)

    Usage:
    {% render 'product-card-list' %}
    {% render 'product-card-list', product: product, show_vendor: section.settings.show_vendor %}
{% endcomment %}

{%- liquid
  if product.title
    assign product_title = product.title
    assign product_desc = product.description
    assign product_vendor = product.vendor
  else
    assign product_title = 'homepage.onboarding.product_title' | t
    assign product_desc = 'homepage.onboarding.product_description' | t
    assign product_vendor = 'products.product.vendor' | t
    assign onboarding = true
  endif
-%}

{%- capture product_img -%}
  {%- if product.featured_media or onboarding -%}
    
      {% if product.featured_media %}
        {%- if show_form -%}
          
        {%- endif -%}
        
        {%- if show_form -%}
          
        {%- endif -%}
      {%- endif -%}
      {%- if onboarding -%}
        {%- capture current -%}{% cycle 1, 2, 3, 4 %}{%- endcapture -%}
        {{ 'product-' | append: current | placeholder_svg_tag: 'placeholder-svg placeholder-svg--small product-card__image' }}
      {%- endif -%}
    

  {%- endif -%}
{%- endcapture -%}

  {%- unless show_form -%}
    
      {{ product_title }}
    
  {%- else -%}
    

      {{ product_title }}
    

  {%- endunless -%}

  
    
    
  

  
    {{ product_img }}
    

      

        {%- unless show_form -%}
          {{ product_title }}
        {%- else -%}
          {{ product_title }}
        {%- endunless -%}
        {{ product_img }}
      

      {%- if show_vendor -%}
        {{ product_vendor }}

      {% endif %}
      {% if current_variant.price >0 %}
      
        {% render 'product-price-listing', product: product %}
        {% render 'product-price', variant: product.selected_or_first_available_variant, product: product, wrapper_class: 'price--listing price--variants' %}
        
          {{ 'products.product.view_details' | t }}
        
      

      {% endif %}
      
        

{{ product_desc | strip_html | truncate: 120 }}

      

      {%- if show_form -%}
        
          {%- unless product.has_only_default_variant -%}
            

              
            

          {%- endunless -%}

          {% render 'product-form',
            section_id: section.id,
            product: product,
            current_variant: product.selected_or_first_available_variant,
            show_instant_quantity: true
          %}
        

      {%- endif -%}
    

  

[janiecolbaugh]

Ok, thank you. I will do that now. What about the cart? I assumed it would leave once the 0.00 price was removed. How do I remove the cart?

[janiecolbaugh]

Eeek! So that did remove the zero price but it also removed the price that wasn’t zero. Now all prices are gone.

The Finery House (myshopify.com)

To clarify, I would like for the products with a zero price to not have a price shown nor a cart. I would like this to be the case on the individual product cards as well as the featured collections. on the products with a price, I would like for the price to be viewable on both the individual product cards and featured collections.

I apologize for the confusion and appreciate your help.

[neeravmakwana]

Do you mean you want to remove the 0.0 label from the cart as well?
Irrespective of whether it is 0 with no items in the cart or 0 with one or
more items in the cart.

The code I shared with you relates to 0 price on products only, not the
cart.

[neeravmakwana]

That’s weird, I’ll have a look and let you know shortly. Please undo the
change in the meantime.

[janiecolbaugh]

If an item as a zero price, I do not want a price to be reflected nor a cart viewable on that particular item detail. Viewable below you will see, we have removed he 0.00 price from being shown however, the cart is still there. I would like to remove the cart.

[janiecolbaugh]

I did.

[neeravmakwana]

When you say you would like to remove the cart, do you mean you would like to remove the “Add to cart” button for items with 0 price?

[neeravmakwana]

I think I know the requirement reasonably well:

1. Hide price from collections as well as individual products when the price is 0

2. Hide “Add to cart”, “buy now” etc. buttons when the price is 0

For doing 1, please make modify product-price.liquid and product-card-list.liquid files as below (I’m assuming that you have not made any changes whatsoever to these files from the ones in the default express theme):

product-price.liquid

{% comment %}
    Renders a list of product's price (regular, sale, unit)
    Accompanies product forms and meant to be updated dynamically
    Accepts:
    - variant: {Object} Variant Liquid object (optional)
    - product: {Object} Product Liquid object (optional)
    - show_vendor: {Boolean} Show the product's vendor depending on the section setting (optional)
    - wrapper_class: {String} Adds a class for the wrapper (optional)

    Usage:
    {% include 'product-price', variant: current_variant, product: product %}
{% endcomment %}
{%- liquid
  if variant.title
    assign compare_at_price = variant.compare_at_price
    assign price = variant.price
    assign available = variant.available
  else
    assign compare_at_price = 1999
    assign price = 1999
    assign available = true
  endif

  assign money_price = price | money
-%}

<dl>

  {% if show_vendor and product %}
    

      <dt>
        {{ 'products.product.vendor' | t }}
      </dt>
      <dd>
        {{ product.vendor }}
      </dd>
    

  {% endif %}

  {%- comment -%}
    Explanation of description list:
      - div.price__regular: Displayed when there are no variants on sale
      - div.price__sale: Displayed when a variant is a sale
      - div.price__unit: Displayed when the first variant has a unit price
      - div.price__availability: Displayed when the product is sold out
  {%- endcomment -%}
{% if variant.price >0 %}
  
    

      <dt>
        {{ 'products.product.regular_price' | t }}
      </dt>
      <dd>
        
          {{ money_price }}
        
      </dd>
    

    
      <dt>
        {{ 'products.product.regular_price' | t }}
      </dt>
      <dd>
        <s>
          {{ compare_at_price | money }}
        </s>
      </dd>
      <dt>
        {{ 'products.product.sale_price' | t }}
      </dt>
      <dd>
        
          {{ money_price }}
        
      </dd>
    

    
      
        {{ 'products.product.on_sale' | t }}
      
      
        {{ 'products.product.sold_out' | t }}
      
    

  

  
    <dt>
      {{ 'products.product.unit_price_label' | t }}
    </dt>
    <dd>
      {%- capture unit_price_separator -%}
        /{{ 'general.accessibility.unit_price_separator' | t }} 
      {%- endcapture -%}
      {%- capture unit_price_base_unit -%}
        
          {%- if variant.unit_price_measurement -%}
            {%- if variant.unit_price_measurement.reference_value != 1 -%}
              {{- variant.unit_price_measurement.reference_value -}}
            {%- endif -%}
            {{ variant.unit_price_measurement.reference_unit }}
          {%- endif -%}
        
      {%- endcapture -%}

      {{ variant.unit_price | money }}{{- unit_price_separator -}}{{- unit_price_base_unit -}}
    </dd>
  

{% endif %}
</dl>

product-card-list.liquid

{% comment %}
    Renders a product card using "List" style

    Accepts:
    - product: {Object} Product Liquid object (optional)
    - show_vendor: {Boolean} Show the product's vendor depending on the section setting (optional)
    - show_form: {Boolean} Show the product form (optional)

    Usage:
    {% render 'product-card-list' %}
    {% render 'product-card-list', product: product, show_vendor: section.settings.show_vendor %}
{% endcomment %}

{%- liquid
  if product.title
    assign product_title = product.title
    assign product_desc = product.description
    assign product_vendor = product.vendor
  else
    assign product_title = 'homepage.onboarding.product_title' | t
    assign product_desc = 'homepage.onboarding.product_description' | t
    assign product_vendor = 'products.product.vendor' | t
    assign onboarding = true
  endif
-%}

{%- capture product_img -%}
  {%- if product.featured_media or onboarding -%}
    
      {% if product.featured_media %}
        {%- if show_form -%}
          
        {%- endif -%}
        
        {%- if show_form -%}
          
        {%- endif -%}
      {%- endif -%}
      {%- if onboarding -%}
        {%- capture current -%}{% cycle 1, 2, 3, 4 %}{%- endcapture -%}
        {{ 'product-' | append: current | placeholder_svg_tag: 'placeholder-svg placeholder-svg--small product-card__image' }}
      {%- endif -%}
    

  {%- endif -%}
{%- endcapture -%}

  {%- unless show_form -%}
    
      {{ product_title }}
    
  {%- else -%}
    

      {{ product_title }}
    

  {%- endunless -%}

  
    
    
  

  
    {{ product_img }}
    

      

        {%- unless show_form -%}
          {{ product_title }}
        {%- else -%}
          {{ product_title }}
        {%- endunless -%}
        {{ product_img }}
      

      {%- if show_vendor -%}
        {{ product_vendor }}

      {%- endif -%}
      
        {% if product.price >0 %}
        {% render 'product-price-listing', product: product %}
        {% endif %}
        
        {% render 'product-price', variant: product.selected_or_first_available_variant, product: product, wrapper_class: 'price--listing price--variants' %}
        
        
        
          {{ 'products.product.view_details' | t }}
        
      

      
        

{{ product_desc | strip_html | truncate: 120 }}

      

      {%- if show_form -%}
        
          {%- unless product.has_only_default_variant -%}
            

              
            

          {%- endunless -%}

          {% render 'product-form',
            section_id: section.id,
            product: product,
            current_variant: product.selected_or_first_available_variant,
            show_instant_quantity: true
          %}
        

      {%- endif -%}
    

  

For removing add to cart (and other buttons) when the price is 0, please search for

in product-form.liquid and add {% if product.price >0 %} in a new line just above it.

Then, search for Live region for announcing updated price and availability to screen readers and add {% endif %} 2 lines above it (i.e. just above the comment line).

Please let me know if this worked. Thanks.

[janiecolbaugh]

Hello, just following up

[neeravmakwana]

Hi, were you able to implement the changes I mentioned in my last post?

[janiecolbaugh]

Good morning. I did have some success but still not all the way correct.

Goals:

1. Hide price from collections as well as individual products when the price is 0- COMPLETE

2. Hide “Add to cart”, “buy now” etc. buttons when the price is 0- not complete

I tried to make the change your suggested but see the attached. I could not save.

[neeravmakwana]

That’s strange. Can you please share your email address in a private message.

[janiecolbaugh]

thanks. just sent.

[janiecolbaugh]

It worked, it worked, it worked! You are the BEST! Thank you so very much!! Wahooo!

[neeravmakwana]

Thanks, good luck with your store!

[smj_90]

@neeravmakwana Hi there, I’m doing the same in my DAWN 2.0 theme latest version.

I want to hide the quick add button from product cards in featured collection when the price is 0.

I have implemented a few codes but no success. Can you help?

Code I’m writing is in card-product.liquid