How to display any string of text as a product label

Technical Q&A
1

Please help.

I want to be able to edit the liquid to display any product label, but where do I place the text in the liquid so that it overlaps the product?
I know it varies from theme to theme, but are there any common characteristics of where I should write?

The themes I plan to use are “Prestige” and “Dwan”.

参考画像.jpg
参考画像.jpg1536×704 122 KB

2

Hello

It depends a lot on what you need, it would be interesting if you share more data such as:

  • What is the purpose of putting a tag there?, some date, discounts, type of product, etc. There may be several reasons or data.

The next thing is, you define the conditions for it to appear or not appear.

For example, if it has a discount price, if it is a new product, if it belongs to some category or seller, you could even develop something together in the Shopify editor to define some rules.

You should also consider what labels would be taken into account or based on what prefix or suffix, they are often used a lot for these cases.

Finally, I would also like to tell you that it is not as simple as deciding to put a tag, this would take HTML (Liquid), CSS and could even take JavaScript. That is, you would need a developer.

Although its solution could be in the documentation of each theme:

(I didn’t find any documentation on Dawn), but as I recall it doesn’t have anything for this.

1 Like
3

Thank you for your answer.

Eventually, I would like to achieve the behavior that what I type in the tag will be displayed on the image. By default, “Sale” is added to price reductions and “NEW” to new products, so I thought it might be possible to place them where they are controlled.

It’s configurable to do a specific action when a specific tag is used, right? Isn’t it possible to apply that and display it?

I’ll take a look at the URL now!

4

I saw you posted very similar questions earlier.

So I guess everything is related in the end, and I will try to give you an answer to all of them.

The first thing is that for the “New” tags, if you can do it based on a tag of your products.

Assuming that you want a tag for new products, your tag could be the following: “TYPE_NEW”.

{% assign tag_name = "" %} 

{% for tag in product.tags %}
    {% if tag contains "TYPE_" %}
        {% assign tag_name | split "_" | last %}
    {% endif %}
{% endif %}
  1. First define a variable called “tag_name” which by default is empty.
  2. Go through the tags of your product.
  3. If any of the tags contain the keyword “TYPE_”, then the variable “tag_name” gets the rest of the name. That is “NEW”.
  4. This is achieved by splitting from the underscore “_” and taking the final word (“NEW”).

This will allow you to use the tag wherever you want (after the code you just saw).

{% if tag_name != blank %}
    {{ tag_name }}
{% endif %}

Here we simply evaluate, that if the tag is not empty, just insert it.

You could mix it with your HTML no problem.

This code might work for any word that comes after “TYPE”, I imagine something like “TYPE_SPECIAL”, “TYPE_UNIQUE”, etc.

Any tag that has the following syntax: “TYPE_TEXT”, will work. You can also modify it according to your preferences.

I also share the documentation of everything that has been used:

Greetings.

5

Thank you.

I tried to paste the code you gave me, but it didn’t work?

Thanks for the reference URL. I’ll take a look!