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

Solved
janiecolbaugh
Excursionist
14 1 3

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)

0 Likes
neeravmakwana
Shopify Partner
164 29 32

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

In product-price.liquid file, please search for <div class="price__pricing-group"> (just after line 50) and paste {% if current_variant.price >0 %} in a new line above it.

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

0 Likes
janiecolbaugh
Excursionist
14 1 3

shopify image of zeros.pngshopify code I.pngshopify code II.png

 

 

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

0 Likes
neeravmakwana
Shopify Partner
164 29 32

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 class="price price--listing
  {%- if available == false %} price--sold-out {% endif -%}
  {%- if compare_at_price > price %} price--on-sale {% endif -%}
  {%- if product.price_varies == false and product.compare_at_price_varies %} price--compare-price-hidden {% endif -%}
  {%- if variant.unit_price_measurement %} price--unit-available {% 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 current_variant.price >0 %}
  <div class="price__regular">
    <dt>
      <span class="visually-hidden visually-hidden--inline">{{ 'products.product.regular_price' | t }}</span>
    </dt>
    <dd>
      <span class="price-item price-item--regular">
        {%- if product.price_varies -%}
          {{ 'products.product.from_text_html' | t: price: money_price }}
        {%- else -%}
          {{ money_price }}
        {%- endif -%}
      </span>
    </dd>
  </div>
  <div class="price__sale">
    <div class="price__compare">
      <dt>
        <span class="visually-hidden visually-hidden--inline">{{ 'products.product.regular_price' | t }}</span>
      </dt>
      <dd>
        <s class="price-item price-item--regular">
          {{ compare_at_price | money }}
        </s>
      </dd>
    </div>
    <dt>
      <span class="visually-hidden visually-hidden--inline">{{ 'products.product.sale_price' | t }}</span>
    </dt>
    <dd>
      <span class="price-item price-item--sale">
        {%- if product.price_varies -%}
          {{ 'products.product.from_text_html' | t: price: money_price }}
        {%- else -%}
          {{ money_price }}
        {%- endif -%}
      </span>
    </dd>
  </div>
  
  <div class="price__badges">
    <span class="price__badge price__badge--sale" aria-hidden="true">
      <span>{{ 'products.product.on_sale' | t }}</span>
    </span>
    <span class="price__badge price__badge--sold-out">
      <span>{{ 'products.product.sold_out' | t }}</span>
    </span>
  </div>
  <div class="price__unit">
    <dt>
      <span class="visually-hidden visually-hidden--inline">{{ 'products.product.unit_price_label' | t }}</span>
    </dt>
    <dd class="price-unit-price">
      {%- capture unit_price_separator -%}
        <span aria-hidden="true">/</span><span class="visually-hidden">{{ 'general.accessibility.unit_price_separator' | t }}&nbsp;</span>
      {%- endcapture -%}
      {%- capture unit_price_base_unit -%}
        <span>
          {%- 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 -%}
        </span>
      {%- endcapture -%}

      <span>{{ variant.unit_price | money }}</span>{{- unit_price_separator -}}{{- unit_price_base_unit -}}
    </dd>
  </div>
  {% 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 -%}
    <div class="product-card__image-wrapper">
      {% if product.featured_media %}
        {%- if show_form -%}
          <a href="{{ product.url | within: collection }}" tabindex="-1" data-product-card-link>
        {%- endif -%}
        <img srcset="{% if product.featured_media.width >= 90 %}{{ product.featured_media | img_url: '90x' }} 90w,{% endif %}
            {% if product.featured_media.width >= 180 %}{{ product.featured_media | img_url: '180x' }} 180w,{% endif %}
            {% if product.featured_media.width >= 110 %}{{ product.featured_media | img_url: '110x' }} 110w,{% endif %}
            {% if product.featured_media.width >= 220 %}{{ product.featured_media | img_url: '220x' }} 220w,{% endif %}"
          sizes="(min-width: 750px) 110px, 90px"
          src="{{ product.featured_media | img_url: '110x110' }}"
          width="{{ product.featured_media.width }}"
          height="{{ product.featured_media.height }}"
          loading="lazy"
          class="product-card__image"
          alt="{{ product.featured_media.alt | escape }}"
          data-product-card-image>
        {%- if show_form -%}
          </a>
        {%- 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 -%}
    </div>
  {%- endif -%}
{%- endcapture -%}

<div class="product-card product-card--list{% if show_form %} product-card--quick-add{% if product.has_only_default_variant %} product-card--has-variants{% endif %}{% endif %}"{% unless onboarding %} data-product-card data-product-id="{{ product.id }}"{% endunless %}{% if show_form %} data-show-quantity-selector="true"{% endif %} tabindex="-1">
  {%- unless show_form -%}
    <a class="full-width-link" href="{{ product.url | within: collection }}" data-product-card-link>
      <span class="visually-hidden">{{ product_title }}</span>
    </a>
  {%- else -%}
    <div class="full-width-link">
      <span class="visually-hidden">{{ product_title }}</span>
    </div>
  {%- endunless -%}

  <div class="product-card__quantity"
    data-label-single="{{ 'products.product.quantity_indicator.single' | t: title: product_title }}"
    data-label-multi="{{ 'products.product.quantity_indicator.multi' | t: quantity: '[quantity]', title: product_title }}"
    data-quantity-indicator="{{ product.id }}">
    <span aria-hidden="true" data-quantity-number></span>
    <span class="visually-hidden" data-quantity-label></span>
  </div>

  <div class="product-card__link">
    {{ product_img }}
    <div class="product-card__content">
      <div class="product-card__title-wrapper" aria-hidden="true">
        {%- unless show_form -%}
          <span class="product-card__title">{{ product_title }}</span>
        {%- else -%}
          <a class="product-card__title" href="{{ product.url | within: collection }}" data-product-card-link>{{ product_title }}</a>
        {%- endunless -%}
        {{ product_img }}
      </div>
      {%- if show_vendor -%}
        <div class="product-card__vendor">{{ product_vendor }}</div>
      {% endif %}
      {% if current_variant.price >0 %}
      <div class="product-card__price-wrapper">
        {% render 'product-price-listing', product: product %}
        {% render 'product-price', variant: product.selected_or_first_available_variant, product: product, wrapper_class: 'price--listing price--variants' %}
        <a href="{{ product.url | within: collection }}" class="rte product-card__view-details" data-product-card-link>
          {{ 'products.product.view_details' | t }}
        </a>
      </div>
      {% endif %}
      <div class="product-card__description-wrapper" aria-hidden="true">
        <p class="product-card__description">{{ product_desc | strip_html | truncate: 120 }}</p>
      </div>
      {%- if show_form -%}
        <div class="product-card__quick-add">
          {%- unless product.has_only_default_variant -%}
            <div class="product-form__buttons product-form__buttons--show-options">
              <button
                name="add"
                class="product-form__add-to-cart"
                data-show-options-button>
                  {{ 'products.product.show_options' | t }}
              </button>
            </div>
          {%- endunless -%}

          {% render 'product-form',
            section_id: section.id,
            product: product,
            current_variant: product.selected_or_first_available_variant,
            show_instant_quantity: true
          %}
        </div>
      {%- endif -%}
    </div>
  </div>
</div>
0 Likes
janiecolbaugh
Excursionist
14 1 3

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? 

0 Likes
janiecolbaugh
Excursionist
14 1 3

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. 

0 Likes
neeravmakwana
Shopify Partner
164 29 32
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.
0 Likes
neeravmakwana
Shopify Partner
164 29 32
That's weird, I'll have a look and let you know shortly. Please undo the
change in the meantime.
0 Likes
janiecolbaugh
Excursionist
14 1 3

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. 

shopify IV.png

 

0 Likes
janiecolbaugh
Excursionist
14 1 3

I did.

0 Likes