Add "Available Now" text to products in grid like "sold out". Pipeline theme

[Redroot_Blades]

Hello,

I had this figured out before the last big update…Now it doesn’t work.

I’m looking to have each product either say “Available Now” or “Sold out” under their price in the product grid. Currently the products that are available say nothing.

https://www.redrootblades.com/collections/outdoor-knives has one available item, so you can see what I mean.

Any help would be grand. Thanks!

[Ahsan_ANC]

Hi @Redroot_Blades please share the code of this section. It should look like a product grid item in your theme editor snippets folder.

[suyash1]

@Redroot_Blades - this will need code editing, it can be one.

[Redroot_Blades]

Thank you! Here is the code below. I see the elements to edit, I just don’t know the language.

{% comment %}
A grid item for products used in collection grid view

• product {object} - The current prodcut

{% render ‘product-grid-item’, product: product %}
{% endcomment %}

{%- liquid
assign current_variant = product.first_available_variant

assign on_sale = false
if product.compare_at_price > product.price
assign on_sale = true
endif

assign sold_out = true
if product.available
assign sold_out = false
endif

assign sold_out = true
if product.available
assign sold_out = false
endif

assign sellout_badge = false
if sold_out and settings.badge_sellout
assign sellout_badge = true
endif

assign sale_badge = false
if on_sale and settings.badge_sale
assign sale_badge = true
assign sale_badge_content = ‘products.product.sale’ | t
if settings.badge_sale_discount
if settings.badge_sale_type == ‘dollar’
assign sale_badge_content = product.compare_at_price | minus: product.price | money_without_trailing_zeros
else
assign difference = product.compare_at_price | minus: product.price
assign percent_off = difference | times: 1.0 | divided_by: product.compare_at_price | times: 100
assign sale_badge_content = percent_off | floor | append: ‘%’
endif
assign save_word = ‘products.product.save’ | t | append: ’ ’
assign sale_badge_content = sale_badge_content | prepend: save_word
endif
endif

assign custom_badge = false
if settings.badge_custom
for tag in product.tags
if tag contains “badge”
assign custom_badge = true
assign custom_badge_content = tag | remove: ‘badge’ | replace: ‘_’, ’ ’
break
endif
endfor
endif

assign setting_badge = false
if badge_string and badge_string != ‘’
assign setting_badge = true
endif

assign tagged = false
if sellout_badge or sale_badge or custom_badge or setting_badge
assign tagged = true
endif
-%}
{%- capture badge -%}
{%- if tagged %}
{%- if setting_badge -%}

{{ badge_string }}

{%- elsif custom_badge -%}

{{ custom_badge_content }}

{%- elsif sellout_badge -%}

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

{%- elsif sale_badge -%}

{{ sale_badge_content }}

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

{%- capture swatches -%}
{%- if settings.swatches_enable and settings.swatches_collection_enable -%}
{%- capture swatch_translation -%}{{ ‘general.swatches.color’ | t }}{%- endcapture -%}
{%- assign swatch_labels = swatch_translation | append: ‘,’ | split: ‘,’ -%}
{%- for label in swatch_labels -%}
{%- assign sanitized_label = label | lstrip | rstrip -%}
{%- if product.options_by_name[sanitized_label].values.size > 0 -%}

{{ 'collections.general.swatches_with_count' | t: count: product.options_by_name[sanitized_label].values.size }}

{% break %} {%- endif -%} {%- endfor -%} {%- endif -%} {%- endcapture -%}

{%- liquid
assign double_img = false
if product.media[1].preview_image and settings.image_hover_enable
assign double_img = true
endif

assign product_img_ratio = product.featured_media.preview_image.aspect_ratio | default: 1
assign image_ratio = 1 | divided_by: product_img_ratio | times: 100
if settings.product_grid_image == ‘crop’
assign image_ratio = settings.product_grid_aspect_ratio | times: 100
elsif settings.product_grid_image == ‘scale’
assign multiplier = settings.product_grid_aspect_ratio
assign inverse_ratio = 1 | divided_by: product_img_ratio
assign top_offset = 1 | divided_by: product_img_ratio | times: 100 | divided_by: 2
assign top_offset_subtractor = multiplier | times: 100 | divided_by: 2
endif
-%}

{%- if settings.product_grid_image == ‘scale’ -%}
{%- capture auto_height -%}
{%- if inverse_ratio > multiplier -%}
style=“width:{{ product_img_ratio | times: multiplier | times: 100 }}%; margin: 0 auto;”
{%- else -%}
style=“padding:{{ top_offset_subtractor | minus: top_offset }}% 0;”
{%- endif -%}
{%- endcapture -%}
{%- endif -%}

{% if double_img %}

{%- assign img_url = product.media[1].preview_image | img_url: '1x1' | replace: '_1x1.', '_{width}x.' -%}

{% endif %}

{{ badge }}

{{ badge }}

{{ product.title }}

{%- if settings.product_grid_show_rating and product.metafields.reviews.rating.value != blank -%}

{% render 'product-rating', product: product, show_rating_count: settings.product_grid_show_rating_count %}

{%- endif -%}

{% if product.price_varies %}{{ 'products.general.from' | t }} {% endif %} {{ product.price | money }} {% if on_sale %} {{ product.compare_at_price | money }} {% endif %} {% if current_variant.unit_price %} {% capture unit_price_separator %} /{{ 'general.accessibility.unit_price_separator' | t }}  {% endcapture %} {% capture unit_price_base_unit %} {% if current_variant.unit_price_measurement.reference_value != 1 %} {{ current_variant.unit_price_measurement.reference_value }} {% endif %} {{ current_variant.unit_price_measurement.reference_unit }} {% endcapture %}
{{ 'products.product.unit_price_label' | t }} {{ current_variant.unit_price | money }}{{ unit_price_separator }}{{ unit_price_base_unit }} {% endif %} {% if sold_out %}
{{ 'products.product.sold_out' | t }} {% endif %} {{ swatches }}

[Redroot_Blades]

I figured it out. I added the following to the correct spot in product-grid-item.liquid :

{% if product.available %} Available Now {% endif %}