Shopify themes, liquid, logos, and UX
How do I add the Collection name above the Title on the Product page? Is this accomplished as metafields?
Solved! Go to the solution
This is an accepted solution.
Like one product may be assign on more than 1 collection so you show first assigned collection by below mentioned code on DAWN theme on sections -> main-product.liquid at line number 200
{% assign pro_collection = product.collections.first %}
{% if pro_collection %}
This product is part of my {{ pro_collection.title | link_to: pro_collection.url }} Collection
{% endif %}
@PLCollection you can add this code
<h1 class="hero__title">{{ collection.title }}</h1>
above
<h1 class="product__title">{{ product.title }}</h1>
in snippets/product.liquid file
I use the Dawn theme and there is no snippets/product.liquid file - would it be the templates/product.json file?
no not the json file just show me the screen shots of file names or look for product.liquid
for Product I only see these files:
share store url
plcollection.myshopify.com
Reminder: I'm using Dawn theme
your store is password protected
This is an accepted solution.
Like one product may be assign on more than 1 collection so you show first assigned collection by below mentioned code on DAWN theme on sections -> main-product.liquid at line number 200
{% assign pro_collection = product.collections.first %}
{% if pro_collection %}
This product is part of my {{ pro_collection.title | link_to: pro_collection.url }} Collection
{% endif %}
Thank you and this code works. However, I just realized that my products can indeed be associated to more than one collection -- and I only want to display the "key" collection name above the title, but I don't know how I would specify the key collection in Shopify.
It is posible by add a metafield on product and value of metafield is equal to collection handle which you want to show on product page.
and on product page you can show that metafield by liquid code as we did above.
Hello PLCollection, were you able to get the solution to displaying the key collection? By key collection do you mean the name of the collection you have currently navigated from? That is the solution is am looking for.
What if you wanted to show ALL the collections the product belongs in, not just 1? I thought it may be as easy as removing the "first" from the code, but no luck.
Here you are
{% assign pro_collection = product.collections %}
{% if pro_collection %}
All Collection:
{% for col in pro_collection %}
<a href="{{ col.url }}" title="{{ col.title }}">{{ col.title }}</a>{% unless forloop.last %},{% endunless %}
{% endfor %}
{% endif %}
In the following code (as copied above), is there a way to exclude a collection? For instance, exclude the collection "All Products".
{% assign pro_collection = product.collections %}
{% if pro_collection %}
All Collection:
{% for col in pro_collection %}
<a href="{{ col.url }}" title="{{ col.title }}">{{ col.title }}</a>{% unless forloop.last %},{% endunless %}
{% endfor %}
{% endif %}
Thank you, I will give that a whirl.
Hey Community 👋 Did you know that March 15th is National Everything You Think Is W...
By JasonH Apr 1, 2025Discover how to increase the efficiency of commerce operations with Shopify Academy's l...
By Jacqui Mar 26, 2025Shopify and our financial partners regularly review and update verification requiremen...
By Jacqui Mar 14, 2025