Hi!
I want to remove the sold out badge from the brooklyn theme and add it as a text block alongside the price after a dash " 160€ - Sold out"
is it possible?
https://uf2787b7u3ynwmax-41528656033.shopifypreview.com
Thanks in advance!!
1 Like
{% comment %}
This snippet is used to showcase each product during the loop,
'for product in collection.products' in collection.liquid.
A liquid variable (grid_item_width) is set just before the this
snippet is included to change the size of the container.
Once the variable is set on a page, all future instances of this
snippet will use that width. Overwrite the variable to adjust this.
Example
- assign grid_item_width = 'large--one-quarter medium--one-half'
{% endcomment %}
{% unless grid_item_width %}
{% assign grid_item_width = 'large--one-third medium--one-half' %}
{% endunless %}
{% unless width %}
{%- assign width = 310 -%}
{% endunless %}
{% unless height %}
{%- assign height = 415 -%}
{% endunless %}
{% 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 variant = product.selected_or_first_available_variant -%}
{% capture img_id_class %}ProductImage-{{ product.featured_media.id }}{% endcapture %}
{% capture img_wrapper_id %}ProductImageWrapper-{{ product.featured_media.id }}{% endcapture %}
{%- assign featured_image = product.featured_media.preview_image %}
{%- assign img_url = featured_image | img_url: '1x1' | replace: '_1x1.', '_{width}x.' -%}
{% if featured_image.src== blank %}
{% else %}
{% include 'image-style' with image: featured_image, small_style: true, width: width, height: height, wrapper_id: img_wrapper_id, img_id_class: img_id_class %}
{% endif %}
{% if sold_out %}
{{ 'products.product.sold_out_html' | t }}
{% elsif on_sale %}
{% capture saved_amount %}{{ product.compare_at_price | minus: product.price | money_without_trailing_zeros }}{% endcapture %}
{{ 'products.general.save_html' | t: saved_amount: saved_amount }}
{% endif %}
{{ product.title }}
—
{% if on_sale %}
{{ 'products.general.sale_price' | t }}
{% else %}
{{ 'products.general.regular_price' | t }}
{% endif %}
{% if product.price_varies %}
{{ product.price_min | money_without_trailing_zeros }}
+
{% else %}
{{ product.price | money_without_trailing_zeros }}
{% endif %}
{%- if product.price_varies == false and variant.unit_price_measurement -%}
{%- capture unit_price_separator -%}
/ {{ 'general.accessibility.unit_price_separator' | t }}
{%- endcapture -%}
{%- capture unit_price_base_unit -%}
{%- if variant.unit_price_measurement.reference_value != 1 -%}
{{- variant.unit_price_measurement.reference_value -}}
{%- endif -%}
{{ variant.unit_price_measurement.reference_unit }}
{%- endcapture -%}
{{ 'products.general.unit_price' | t }}
{{ variant.unit_price | money }}{{- unit_price_separator -}}{{- unit_price_base_unit -}}
{%- endif -%}
{% if section.settings.product_vendor_enable %}
{{ product.vendor }}
{% endif %}
1 Like
yes please try this code
{% comment %}
This snippet is used to showcase each product during the loop,
'for product in collection.products' in collection.liquid.
A liquid variable (grid_item_width) is set just before the this
snippet is included to change the size of the container.
Once the variable is set on a page, all future instances of this
snippet will use that width. Overwrite the variable to adjust this.
Example
- assign grid_item_width = 'large--one-quarter medium--one-half'
{% endcomment %}
{% unless grid_item_width %}
{% assign grid_item_width = 'large--one-third medium--one-half' %}
{% endunless %}
{% unless width %}
{%- assign width = 310 -%}
{% endunless %}
{% unless height %}
{%- assign height = 415 -%}
{% endunless %}
{% 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 variant = product.selected_or_first_available_variant -%}
{% capture img_id_class %}ProductImage-{{ product.featured_media.id }}{% endcapture %}
{% capture img_wrapper_id %}ProductImageWrapper-{{ product.featured_media.id }}{% endcapture %}
{%- assign featured_image = product.featured_media.preview_image %}
{%- assign img_url = featured_image | img_url: '1x1' | replace: '_1x1.', '_{width}x.' -%}
{% if featured_image.src== blank %}
{% else %}
{% include 'image-style' with image: featured_image, small_style: true, width: width, height: height, wrapper_id: img_wrapper_id, img_id_class: img_id_class %}
{% endif %}
{{ product.title }}
—
{% if on_sale %}
{{ 'products.general.sale_price' | t }}
{% else %}
{{ 'products.general.regular_price' | t }}
{% endif %}
{% if product.price_varies %}
{{ product.price_min | money_without_trailing_zeros }}
+
{% else %}
{{ product.price | money_without_trailing_zeros }}
{% endif %}
{%- if product.price_varies == false and variant.unit_price_measurement -%}
{%- capture unit_price_separator -%}
/ {{ 'general.accessibility.unit_price_separator' | t }}
{%- endcapture -%}
{%- capture unit_price_base_unit -%}
{%- if variant.unit_price_measurement.reference_value != 1 -%}
{{- variant.unit_price_measurement.reference_value -}}
{%- endif -%}
{{ variant.unit_price_measurement.reference_unit }}
{%- endcapture -%}
{{ 'products.general.unit_price' | t }}
{{ variant.unit_price | money }}{{- unit_price_separator -}}{{- unit_price_base_unit -}}
{%- endif -%}
{% if sold_out %}
{{ 'products.product.sold_out_html' | t }}
{% elsif on_sale %}
{% capture saved_amount %}{{ product.compare_at_price | minus: product.price | money_without_trailing_zeros }}{% endcapture %}
{{ 'products.general.save_html' | t: saved_amount: saved_amount }}
{% endif %}
{% if section.settings.product_vendor_enable %}
{{ product.vendor }}
{% endif %}
Hi @KetanKumar !
With the code you provided it looks like this .
I just want a text block right by the price tag without the circle. I’ve set an example by editing a picture.
