I am interested in creating sub collections through metafileds, under the main menu collections. Any advices?
Topic summary
The question asks how to create sub-collections under main menu collections using metafields.
Recommended Approach:
- Navigate to Settings > Custom data > Collections and create a new metafield (e.g., “Sub-collections”)
- Set the type to “Collection” and enable “List of collections”
- In the parent collection (e.g., “Apparel”), use this metafield to select child collections (e.g., “T-Shirts,” “Hoodies”)
Implementation Steps:
- Edit theme code by creating a custom collection template
- Add Liquid logic to check if the metafield contains values
- If values exist, loop through and display linked collections instead of the product grid
- Assign the custom template to parent collections in the admin
Code Examples Provided:
Two working code snippets demonstrate how to retrieve and display sub-collections using collection.metafields.custom.subcollections, with options for grid or list layouts.
Additional Resources:
A YouTube tutorial link was shared covering subcollection creation. Some responders offered to provide customized solutions if the store URL and theme name are shared.
Status: The question has multiple detailed solutions but remains open for implementation assistance.
YouTube has great tutorials like how to create subcollections or how to add a breadcrumb. https://youtu.be/O1aB6DFXQbw?si=v95FhLsPNPbbmfp0
Hi @amit.admin
First, go to Settings > Custom data > Collections and create a new metafield definition. Name it something like “Sub-collections” and, for the type, select “Collection” and then check the box for “List of collections.” After saving, go to your main “parent” collection (e.g., “Apparel”) and use this new metafield to select all the “child” collections you want to display (e.g., “T-Shirts,” “Hoodies”).
Next, you need to edit your theme code (it’s best to create a new collection template for this). In the template, add Liquid logic to check if the metafield has values. If it does, loop through the list to display the linked collections instead of the usual product grid.
{%- assign sub_collections = collection.metafields.custom.sub_collections.value -%}
{%- if sub_collections.size > 0 -%}
<div class="your-grid-class">
{%- for sub_collection in sub_collections -%}
<a href="{{ sub_collection.url }}">
<img src="{{ sub_collection.featured_image | image_url: width: 400 }}" />
<h2>{{ sub_collection.title }}</h2>
</a>
{%- endfor -%}
</div>
{%- else -%}
{% comment %} Fallback to your theme's normal product grid code here {% endcomment %}
{%- endif -%}
Finally, assign this new custom template to your parent collections in the admin. Now, those pages will show a grid of sub-collections instead of products.
-
Create a meta field for the main collections. For example,custom.subcollections.
-
Add sub-collections to the main collections. Go to the main collections (like Furniture). Then, add the sub-collections you want to add under the main collection. For example, Tables and Chairs.
-
Display sub-collections on the collection page
Next, edit the theme to display these sub-collections. In the collection template or section, add this Liquid code where you want the sub-collections to appear:
{% assign subcollections = collection.metafields.custom.subcollections %}
{% if subcollections.size > 0 %}
Sub Collections
-
{% for subcollection in subcollections %}
- {{ subcollection.title }} {% endfor %}
- Add main collections to menu, Go to Online Store > Navigation and add the main collections (like Furniture) to the menu. And you can setup the sub collections under the Menu.
Hey @amit.admin,
Could you please share your store URL and password (if applicable) so that I can take a look and provide you the solution code?
Looking forward to hearing back from you.
Best,
Hi @amit.admin,
Some current themes support this feature.
Can you send me the name of the theme you are using? I will check it.