How to add 'Tags' to featured products in the Feature Collection (Taste Theme)

Store Design
, , ,
1

In the Feature Collection (see image below), I want to replace the text ‘Add to cart’ instead with the tags from that product (i.e., which in this case represent the taste). For example, if I have the tags: “Chocolate, Raspberry, Lime”, I would like these texts to replace “add to cart”. Any recommendations on how I can best do this?

Screenshot 2023-10-23 at 8.51.23 PM.png
Screenshot 2023-10-23 at 8.51.23 PM.png1057×1194 176 KB

2

Hi @rayizam

You can do that by going to your Online store > Themes > Edit code > open card-product.liquid file, find this line of code

{%- if show_quick_add -%}

Then add this code above it


    {% for tag in card_product.tags%}
        - {{ tag }}
    {% endfor %}
3

I don’t seem to have: “card-product.liquid” file. I have cart-notification-product.liquid, featured-product.liquid, or main-product.liquid.

4

It should have card-product.liquid file in Snippets folder of your theme.

5

Anyway, if you want to make those tags appear in featured products on homepage only then please update code to this

{% if template == 'index' %}

    {% for tag in card_product.tags%}
        - {{ tag }}
    {% endfor %}

  
{% endif %}
6

I figured out how to do this. To replace the “Add to cart” text with product tags:

  1. Retrieve the product tags:
    {% assign product_tags = card_product.tags | join: ', ’ %}

2)Update the quick add button text:
{% if card_product.selected_or_first_available_variant.available %} {{ product_tags }} {% else %} {{ ‘products.product.sold_out’ | t }} {% endif %}

3)Similarly update the aria-label attribute:
aria-labelledby=“{{ product_form_id }}-submit title-{{ section_id }}-{{ card_product.id }}”

To:
aria-labelledby=“{{ product_form_id }}-submit title-{{ section_id }}-{{ card_product.id }} product-tags-{{ section_id }}-{{ card_product.id }}”