How to Display Product Tags on Your Shopify Store

To display product tags on your Shopify store, you usually need to edit your theme code and add a small Liquid loop to your product template. Shopify tags are not shown to customers by default, but they can be made visible as clickable links, badges, or filter shortcuts with a straightforward customisation.

I have worked on Shopify themes and apps for years, and this is one of those small tweaks that looks simple on the surface but can create real confusion if you use the wrong collection URL, place the code in the wrong file, or expose internal admin-only tags to shoppers. This guide covers the modern way to do it on Dawn and Online Store 2.0 themes, how to handle older themes, and when you should not display tags at all.

What are Shopify product tags and should you display them?

Shopify product tags are internal labels used to organise products, automate workflows, and support filtering or search. They are useful in admin by default, but they are not automatically visible on your storefront.

According to Shopify's documentation on tags, tags help you group, search, filter, and bulk-manage products. In practice, merchants also use them with Shopify Flow to automate cataloguing and merchandising. I often see stores using tags like summer, giftable, organic, sale, or new-arrival.

Should you display them? Sometimes yes, sometimes no. If your tags are customer-friendly and map neatly to browsing intent, showing them can improve navigation. If your tags are operational, messy, or automation-focused, exposing them can make the product page look amateurish.

When displaying product tags makes sense

Displaying tags works best when the tags are meaningful to customers. Good examples include style, material, occasion, theme, or product type shortcuts.

• Fashion stores showing tags like Linen, Summer, Minimalist
• Beauty stores showing Vegan, Fragrance-Free, Sensitive Skin
• Homeware stores showing Ceramic, Handmade, Gift Idea
• Food stores showing Gluten-Free, Spicy, Vegan

If you are also working on better product merchandising, my guides on maximising revenue from Shopify product pages and optimising your Shopify store for AI shopping agents are worth reading alongside this one.

When you should not show product tags

You should not display tags if they are only for internal operations. That includes supplier tags, warehouse notes, ad campaign labels, workflow triggers, or anything that looks cryptic.

In my experience building Shopify apps, merchants often use tags like sync-pending, meta:summer24, warehouse-b, or fb-feed. Those are useful in the back end, but they look odd on the storefront and can even create weak SEO pages if linked carelessly.

How do I add tags to products in Shopify first?

Before you can display tags, your products need to have tags assigned in Shopify admin. This is the first step many tutorials skip too quickly.

To add tags, go to Products in your Shopify admin, open a product, and find the Tags section. Type the tags you want, press enter after each one, and save the product. Shopify also lets you bulk-edit tags across multiple products, which is much faster for larger catalogues.

1. Open Shopify admin
2. Go to Products
3. Select a product
4. Find the Tags field on the product page
5. Enter one or more tags such as blue, shirts, giftable
6. Click Save

Tags are case sensitive in some Shopify contexts, especially in automation and admin workflows, so I recommend using a consistent naming convention. Keep them short, readable, and standardised. If you run a larger store, define a tag taxonomy before your team starts adding them randomly.

How do I display product tags on a Shopify product page?

The simplest method is to edit your theme code and output product.tags in the product template. For most modern themes, that means editing main-product.liquid.

This is the method that currently matches what is ranking in Google and what merchants are discussing in the Shopify Community. It works well because it is lightweight, does not require an app, and gives you complete control over styling and placement.

1. In Shopify admin, go to Online Store then Themes
2. Click the three dots on your live theme and choose Duplicate
3. Open the duplicate theme and click Edit code
4. Under Sections, open main-product.liquid for Dawn or most OS 2.0 themes
5. If you use an older theme, look for product-template.liquid
6. Choose where you want the tags to appear, such as below the title, above the price, or beneath the add to cart button
7. Paste the code snippet below
8. Save and preview the theme

What code should I use to show Shopify product tags?

The best starter snippet is a conditional loop that only outputs tags when they exist. This keeps the page clean and avoids empty wrappers.

{% if product.tags.size > 0 %}
  <div class="product-tags">
    <p>Tags:
      {% for tag in product.tags %}
        <a href="/collections/all/{{ tag | handleize }}">{{ tag }}</a>{% unless forloop.last %}, {% endunless %}
      {% endfor %}
    </p>
  </div>
{% endif %}

This code displays each tag as a clickable link and sends shoppers to a tag-filtered URL under /collections/all/. For many stores, that is enough to get the feature live in under 10 minutes.

That said, there is an important catch. This approach assumes your store supports tag filtering on the all collection URL. If your theme, navigation, or collection structure works differently, you may need to adjust the link destination.

What is an alternative tag display snippet?

An alternative snippet uses Shopify's link_to filter and outputs a comma-separated list. It is slightly more old-school, but still works in many themes.

{% if product.tags.size > 0 %}
  <div class="product-single__tags">
    <p>
      Tags:
      {% for tag in product.tags %}
        {% assign tag_coll = '/collections/all/' | append: tag %}
        {{ tag | capitalize | link_to: tag_coll }}{% unless forloop.last %},{% endunless %}
      {% endfor %}
    </p>
  </div>
{% endif %}

I prefer the first version because it is easier to read, easier to style, and more predictable when you need to troubleshoot. Still, both snippets can work if your store structure supports the destination URLs.

Which file should I edit in Dawn or older Shopify themes?

On Dawn and most Online Store 2.0 themes, edit main-product.liquid. On older themes, the file is often product-template.liquid.

This is one of the most common points of confusion because older blog posts mix theme generations together. If you are using a modern Shopify theme, you will usually find the product content in a section-based file rather than an older template structure.

If you are unsure which theme architecture you are on, check whether your theme uses JSON templates and section-based product layouts. If it does, you are almost certainly on Online Store 2.0.

How do I style Shopify product tags so they look good?

After adding the Liquid snippet, style the tags in your CSS file so they look like badges or chips rather than plain links. Good styling makes a big difference.

Add the following CSS to base.css, theme.css, or your theme's main stylesheet in Assets:

.product-tags {
  margin-top: 10px;
  font-size: 14px;
  color: #333;
}

.product-tags a {
  display: inline-block;
  background-color: #f0f0f0;
  border-radius: 5px;
  padding: 5px 10px;
  text-decoration: none;
  margin-right: 5px;
  margin-bottom: 5px;
}

.product-tags a:hover {
  background-color: #ddd;
}

This creates clean, pill-style tag links that work well on most storefronts. I usually add a little more spacing, improve contrast, and match the store's button radius so the tags feel native to the theme.

If you care about accessibility, make sure the contrast is strong enough and that hover is not the only visual state. We have covered related risks in our guide to Shopify accessibility lawsuits.

Should tags appear above or below the add to cart button?

For most stores, tags work best below the title or near the product meta area, not as the main call to action. They should support discovery, not distract from buying.

When I test product page layouts, placing tags too close to the buy button can dilute attention and reduce clarity. If the tags are important for browsing, keep them visible but secondary. If they are mainly informational, place them lower in the product details area.

Do product tag links help SEO and navigation?

Product tag links can help internal navigation, but they are not automatically an SEO win. Their value depends on how cleanly your collection and tag URLs are structured.

The upside is obvious. Tags can create useful internal links, help shoppers discover related products, and strengthen topical grouping across your catalogue. The downside is that careless tag linking can generate thin, low-value filtered URLs that are not especially useful for search engines.

In my experience, the best SEO results come when tags mirror real customer intent and connect to meaningful collections. If you are thinking more broadly about search visibility, read how to get your Shopify store indexed by ChatGPT and AI search engines and the hidden truth about Shopify speed optimisation scams.

What are the most common mistakes when displaying product tags on Shopify?

The biggest mistakes are exposing internal tags, linking to broken collection paths, and forgetting to test on a duplicate theme. These are easy to avoid if you know what to look for.

• Using raw admin tags on the storefront when they were never meant for customers
• Assuming /collections/all/ works perfectly in every theme setup
• Editing the live theme first instead of duplicating it
• Forgetting conditional logic, which can leave empty tag wrappers
• Adding tags everywhere, which can clutter mobile product pages
• Ignoring styling, leaving tags looking like broken plain-text links

Another common mistake is using tags where metafields, product type, collections, or filters would be a better fit. Tags are flexible, but that flexibility can become messy quickly if you use them for everything.

What is the best way to link product tags to collections?

The best way is to link only customer-facing tags to collection pages or filtered collection URLs that actually make sense for shoppers. Do not assume every tag deserves its own linked destination.

For a simple setup, linking to /collections/all/{{ tag | handleize }} is often enough. For a more polished setup, I prefer mapping displayed tags to curated collections or filter URLs that you know contain relevant products and are worth indexing.

If your store relies heavily on collection merchandising, it can be smarter to display custom badges or metafield-based attributes instead of raw tags. That gives you better control over wording, URL structure, and design.

Should I use tags or metafields for storefront labels?

If the content is customer-facing and important to merchandising, metafields are often better than tags. Tags are quick, but metafields are cleaner for structured display.

I use tags mainly for admin logic, automation, and broad grouping. I use metafields when the label needs to be curated, styled, translated, or controlled per product in a more deliberate way. If you are building a premium storefront, that distinction matters.

Can I display only selected tags instead of all product tags?

Yes, and for many stores this is the smartest option. You can filter the output so only approved tags appear on the storefront.

This is especially useful if your products have a mix of internal and customer-facing tags. Here is a simple example that only shows a few specific tags:

{% assign visible_tags = 'vegan,organic,handmade,giftable' | split: ',' %}

{% if product.tags.size > 0 %}
  <div class="product-tags">
    {% for tag in product.tags %}
      {% if visible_tags contains tag %}
        <a href="/collections/all/{{ tag | handleize }}">{{ tag }}</a>
      {% endif %}
    {% endfor %}
  </div>
{% endif %}

This approach gives you much better control and avoids leaking operational tags. In client work, I almost always recommend filtered output rather than dumping every tag onto the page.

How do I test that product tags are working properly?

After adding the code, preview several tagged and untagged products on desktop and mobile. Make sure both the display and the destination URLs work.

1. Preview a product with multiple tags
2. Preview a product with no tags
3. Click each tag link and confirm it lands on a valid page
4. Check spacing and wrapping on mobile devices
5. Test a long tag name to see whether the layout breaks
6. Confirm the styling matches the rest of the theme

When I test this, I also check whether the linked pages are actually useful. A tag page with one unrelated product is not helping anyone. If the destination is weak, either improve the merchandising or do not link that tag.

Do I need an app to display product tags on Shopify?

No, you usually do not need an app just to display product tags. A small theme edit is enough for most stores.

That said, apps can still help if your real goal is not tags themselves but better product messaging, badges, trust callouts, or conversion-focused product highlights. In those cases, tags are often just a rough substitute for something more visual and persuasive.

How can I highlight product and store features more effectively than with tags?

If your goal is conversion rather than navigation, feature callouts and badges often work better than plain tags. Tags are functional, but they are not always persuasive.

That is where a callout-style app can make more sense than exposing raw Shopify tags. I have seen merchants get better results with clear visual prompts such as Free returns, Handmade in the UK, Ships in 24 hours, or Limited batch instead of generic tag chips.

What is my recommended setup for most Shopify stores?

My recommendation is to display only customer-friendly tags, style them as badges, and link them only when the destination page is genuinely useful. That gives you the upside without the clutter.

For most merchants in 2026, I would use a filtered tag output on the product page, keep the design subtle, and avoid exposing internal taxonomy. If you want richer product labels, use metafields or a dedicated badge app instead.

In my experience building Shopify apps and working with merchants, the stores that get this right treat tags as part of a broader merchandising system. They do not just ask, "Can I show tags?" They ask, "Will this help customers choose, browse, or buy faster?"

Final thoughts on how to display product tags on your Shopify store

Displaying product tags on Shopify is easy technically, but doing it well takes a bit more thought. The code itself is simple. The real decision is whether your tags are customer-friendly enough to deserve a place on the storefront.

If they are, add the Liquid snippet to main-product.liquid or product-template.liquid, style the output in your CSS, and test the links carefully. If they are not, keep them in admin and use curated labels, metafields, or callouts instead.

The best Shopify product pages are clear, intentional, and easy to browse. Tags can support that, but only when they are used with purpose.