Adding a product sash on collection grid

Hi,

I am looking to add a product sash to the collection grid of another collection and would like it to read ‘As seen on TV’ In white text with black box.

I am using a custom theme and currently have 3 pages with product.grid and they are

product-grid-item-new-variants

product-grid-item-variant

product-grid-item

Below is the theme for product-grid-item.liquid, please let me know if this is possible. If the theme for the other pages is required then let me know but on first glance they all looks similar. Thanks in advance

{%- liquid
unless grid_item_width
assign grid_item_width = ‘medium-up–one-quarter small–one-half’
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 product_tags = product.tags | join: ‘,’
assign has_custom_label = false
if product_tags contains ‘label
for tag in product.tags
if tag contains ‘label
assign tag_starts_with = tag | slice: 0
if tag_starts_with == ‘_’
assign has_custom_label = true
assign custom_label = tag | replace: ‘label’, ‘’
endif
endif
endfor
endif
-%}

{% comment %}
CHECK IF TAG IS SELECTED AND IF SO, CHANGE THE PRODUCT IMAGE TO THE VARIANT IMAGE
{% endcomment %}

{% if current_tags[1] %}

{% for tag in collection.all_tags %}
{% if current_tags[0] contains tag %}
{% assign colour_finder = tag | remove_first: ‘Colour’ | remove_first: ‘_’ %}
{% endif %}
{% endfor %}

{% for image in product.images %}
{% for variant in image.variants %}
{% if variant.title contains colour_finder %}
{%- assign img_url = variant.featured_image -%}
{% endif %}
{% endfor %}
{% endfor %}

{% else %}

{% for tag in collection.all_tags %}
{% if current_tags contains tag %}
{% assign colour_finder = tag | remove_first: ‘Colour’ | remove_first: ‘_’ %}
{% endif %}
{% endfor %}

{% for image in product.images %}
{% for variant in image.variants %}
{% if variant.title contains colour_finder %}
{%- assign img_url = variant.featured_image -%}
{% endif %}
{% endfor %}
{% endfor %}

{% endif %}

{% comment %}
END OF SECTION FOR CHECKING TAGS
{% endcomment %}

{%- if has_custom_label -%}
{{ custom_label }}
{%- else -%} {%- if sold_out -%}
Notify Me
{%- endif -%} {%- if on_sale and sold_out == false -%}
{{ 'products.general.sale' | t }}
{%- endif -%} {%- endif -%}

{% if product.tags contains ‘Sash_New’ %}

NEW IN!
{% endif %}

{% if product.tags contains ‘Sash_Sale’ %}

SALE!
{% endif %}

{% if product.tags contains ‘Sash_Live’ %}

SEEN LIVE
{% endif %}

{% if product.tags contains ‘Sash_Mel’ %}

MEL'S PICK
{% endif %} {% if product.tags contains 'UKmade' %}
MADE IN THE UK
{% endif %} {% if product.tags contains 'PREMbadge' %}
PREMIUM
{% endif %} {% if product.tags contains '2for35' %}
2 FOR £35
{% endif %}

{%- liquid
assign fixed_aspect_ratio = false
unless settings.product_grid_image_size == ‘natural’
assign fixed_aspect_ratio = true
endunless

assign preview_image = product.featured_media.preview_image
assign img_url = preview_image | img_url: ‘1x1’ | replace: ‘1x1.', '{width}x.’
-%}

{%- if settings.quick_shop_enable and sold_out == false -%}
{{ settings.quick_shop_text }}
{%- endif -%} {%- if fixed_aspect_ratio -%}
{%- else -%}
{{ preview_image.alt | escape }} {{ preview_image.alt | escape }}
{%- endif -%}

{%- unless sold_out -%}
{%- if settings.product_hover_image and product.media.size > 1 -%}
{%- for media in product.media offset: 1 limit: 1 -%}
{%- assign second_image = media.preview_image -%}
{%- endfor -%}

{%- endif -%} {%- endunless -%}

{%- if settings.collection_color_swatches -%}
{%- assign swatch_trigger = ‘products.general.color_swatch_trigger’ | t | downcase-%}
{%- for option in product.options_with_values -%}
{%- liquid
assign option_name = option.name | downcase
assign is_color = false
if option_name contains swatch_trigger
assign is_color = true
elsif swatch_trigger == ‘color’ and option_name contains ‘colour’
assign is_color = true
endif
-%}
{%- if is_color -%}
{%- assign option_index = forloop.index0 -%}
{%- assign values = ‘’ -%}
{%- for variant in product.variants -%}
{%- assign value = variant.options[option_index] %}
{%- unless values contains value -%}
{%- liquid
assign values = values | join: ‘,’
assign values = values | append: ‘,’ | append: value
assign values = values | split: ‘,’
-%}

{%- if variant.image -%}

{%- endif -%} {%- endunless -%} {%- endfor -%} {%- endif -%} {%- endfor -%} {%- endif -%}
{{ product.title }}
{%- if settings.vendor_enable -%}
{{ product.vendor }}
{%- endif -%}
{%- if on_sale -%} {{ 'products.general.regular_price' | t }} {{ product.compare_at_price | money }} {{ 'products.general.sale_price' | t }} {%- endif -%} {%- if product.price_varies -%} {%- assign price = product.price_min | money -%} {{ 'products.general.from_text_html' | t: price: price }} {%- else -%} {{ product.price | money }} {%- endif -%} {%- if on_sale -%} {%- if settings.product_save_amount -%} {%- if settings.product_save_type == 'dollar' -%} {%- capture saved_amount -%}{{ product.compare_at_price | minus: product.price | money }}{%- endcapture -%} {%- else -%} {%- capture saved_amount -%}{{ product.compare_at_price | minus: product.price | times: 100.0 | divided_by: product.compare_at_price | round }}%{%- endcapture -%} {%- endif -%} {{ 'products.general.save_html' | t: saved_amount: saved_amount }} {%- endif -%} {%- endif -%}

{%- assign product_variant = product.selected_or_first_available_variant -%}
{%- if product_variant.unit_price_measurement -%}

{%- capture unit_price_base_unit -%} {%- if product_variant.unit_price_measurement -%} {%- if product_variant.unit_price_measurement.reference_value != 1 -%} {{ product_variant.unit_price_measurement.reference_value }} {%- endif -%} {{ product_variant.unit_price_measurement.reference_unit }} {%- endif -%} {%- endcapture -%}

{{ product_variant.unit_price | money }}/{{ unit_price_base_unit }}

{%- endif -%}
{%- if settings.enable_product_reviews -%} {%- endif -%}
{%- if settings.collection_color_swatches -%} {%- liquid assign swatch_trigger = 'products.general.color_swatch_trigger' | t | downcase assign swatch_file_extension = 'png' assign color_count = 0 -%}

{%- for option in product.options_with_values -%}
{%- liquid
assign option_name = option.name | downcase
assign is_color = false
if option_name contains swatch_trigger
assign is_color = true
elsif swatch_trigger == ‘color’ and option_name contains ‘colour’
assign is_color = true
endif
-%}
{%- if is_color -%}
{%- assign option_index = forloop.index0 -%}
{%- assign values = ‘’ -%}

{%- for variant in product.variants -%} {%- assign value = variant.options[option_index] %} {%- unless values contains value -%} {%- liquid assign values = values | join: ',' assign values = values | append: ',' | append: value assign values = values | split: ','

assign color_image = value | handle | append: ‘.’ | append: swatch_file_extension | asset_img_url: ‘50x’ | prepend: ‘https:’ | split: ‘?’ | first
assign color_swatch_fallback = value | split: ’ ’ | last | handle
assign color_count = color_count | plus: 1
-%}

<a
href=“{{ variant.url | within: collection }}”
class=“color-swatch color-swatch–small color-swatch–{{ value | handle }}{% if variant.image %} color-swatch–with-image{% endif %}”
{% if variant.image %}
data-variant-id=“{{ variant.id }}”
data-variant-image=“{{ variant.image | img_url: ‘400x’ }}”
{% endif %}
style=“background-image: url({{ color_image }}); background-color: {{ color_swatch_fallback }};”>
{{ value }}

{%- endunless -%}
{%- endfor -%}

{%- if color_count < 2 -%} {%- style -%} .grid-product__colors--{{ product.id }} { display: none; } {%- endstyle -%} {%- endif -%} {%- endif -%} {%- endfor -%} {%- endif -%}
1 Like

@tilletts

Sorry you are facing this issue, it would be my pleasure to help you.

Welcome to the Shopify community! :blush:
Thanks for your good question.

Please share your site URL,
I will check out the issue and provide you a solution here.

Hi, this is the URL

https://www.tillettsclothing.co.uk/collections/as-seen-on-tv

Thanks

Hi, please find URL below

https://www.tillettsclothing.co.uk/collections/as-seen-on-tv

Thanks in advance

@KetanKumar Have you been able to look at the URL?

Thanks