Dawn Theme - custom tag for certain products on Collection all pages - metaobjects?

Store Design
, , ,
8

One way you can do this is by going to your Theme → Edit Code and locate inside the Sections folder a file named something like ‘card-product.liquid’, then find the element card__information at around line 148 ,and add this code inside the card__information element.

{% if card_product.handle == 'product-handle' %}
Customize

{% endif %}

Then you can style the text according to your preferences

Another way you can do it is by using pseudo elements.

Firstly you would need to find the element with classname card__information which looks like this inside the ‘card-product.liquid’

And update the class name to this

Then inside the Assets Folder locate the ‘component-card.css’ and at the bottom at this code

.card__information{
  position: relative;
}
.card__information .customizable::before{
  content: 'Customize';
  position: absolute;
  top: 0;
  left: 0;
  color: orange;
  font-size: 13px;
}

A third way you can do this is to create a product metafield with a name for example ‘customizable product’, and then go to the products you want to add the ‘Customize’ text and add it to the metafield.
Then go to the element with class name ‘card__information’ and add this element at the start of the element.

{% assign customizable_product = card_product.metafields.custom.customizable-product.value %}
{% if customizable_product != blank %}
  {{ customizable_product }}

{% endif %}
1 Like