How can I display tag on product page (impulse theme)

motherhousehk
Visitor
3 0 0

HI there!
I am looking for the solution of displaying tag on the product page like below:

display tag.jpg

i would like to let customer convert to the similar products more easily.
do anyone can teach me display the tag on the product page? 

Thank you!

Replies 4 (4)

dmwwebartisan
Shopify Partner
12280 2546 3694

Hey @motherhousehk 

Add the below code in your sections/product-template.liquid file where you display tags :

<div class="product-single_tags">
<ul class="product-tags">
{% for tag in product.tags %}
<li>{{ tag }}</li>
{% endfor %}
</ul>
</div>

Now add below CSS in assets/theme.scss file :

.product-single_tags .product-tags li {
    display: inline-block;
    border: 1px solid #CCC;
    padding: 0px 10px;
}

Let me know if it doesn't work for you.

Thank you

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com |  Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | #1 Product Filter & Search app on Shopify | The most powerful Shopify page builder app
motherhousehk
Visitor
3 0 0

Thank you but it doesn't work
motherhousehk_0-1601373228485.png

motherhousehk_1-1601373235745.png

motherhousehk_2-1601373290575.png

 

 

dmwwebartisan
Shopify Partner
12280 2546 3694

Hey @motherhousehk 

Please PM me.

Thanks!

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com |  Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | #1 Product Filter & Search app on Shopify | The most powerful Shopify page builder app
violetas
Tourist
7 0 0

Hi, this worked for me but the links are not added.  How do I get the links attached to the words?