How to Create Sub Collections on Shopify?
Shopify is one of the most popular platforms for creating online stores as well as websites. Most people love Shopify, but sometimes we need to tailor the platform to our needs and needs.
A significant need is to create Shopify sub-collections, They are used to organize the site structure in such a way that child collections are nested into parent collections. These child collections are called sub-collections.
In this article, we focus on achieving the above and look at several ways to create Shopify sub-collections.
Let's explore with us now!
What is Shopify sub-collections?
Subcategories of parent categories or collections are called sub-collections. They aid online users in selecting their preferred products through filtering. Most Shopify themes allow for the addition of sub-collections because doing so enables customers to quickly find the relevant item.
Shopify's sub-collections are often referred to as categories. It plays an important role in online purchases. While you can divide things into various categories, customers may want to be more specific if you have a large inventory.
For example, they might be looking for a man's shirt for a child under five.
In a nutshell, Shopify Sub collections are the features that differentiate your Shopify store from others. They allow you to further develop your products, giving your customers a more guided shopping journey. They are used to organize the structure of the site, so that child collections are nested into parent collections. These are Sub-collections.
Shopify sub-collections advantages
Greater Navigational Experience
Shopify sub-collections are a great method to highlight what your store has to offer and make it simpler for visitors to browse your site.
One of the most crucial factors in determining whether someone would buy your product or service is the user experience, which is an essential part of any purchase.
Higher cross-sell rates for Shopify sub-collections
They might also help you position your goods effectively to boost sales.
Additionally, you can create gift bundles for any occasion or season using Shopify sub-collections, giving your customers helpful suggestions and enabling you to evaluate which product combinations are most successful.
In addition, a business owner may use Shopify sub-collections to create gift bundles for each occasion or season, giving your customers helpful recommendations while also enabling you to test which product combinations are most successful.
A collection list page is what this is known as.
With these cutting-edge methods for integrating Shopify sub-collections into your shopping experience, you can increase cross-selling opportunities while assisting your customers in discovering things they might not have known they needed.
Enhanced SEO
Additionally, if your sub-collection is correctly organized, it might even aid improve your SEO.
Sub-collection Shopify in Shopify uses a URL structure known as a physical silo to create a natural hierarchy tree on your website.
Google can easily crawl your website and gain a better understanding of your company because of the physical silo.
This suggests that Google is more inclined to trust your website and app when trying to match it with relevant searches, and that your pages are more likely to rank higher in the search results and receive more clicks.
How to Create Sub Collections on Shopify?
Shopify sub-collections creation is more challenging than main collection creation. But it is feasible. Your Shopify products must have tags added in order to allow customers to filter products based on those tags.
Step 1: Create sub-collections
Start by entering your login information into your Shopify account.
I start by making a collection that serves my objective.
Create a collection from the “Shopify admin > Products > Collections” page.
Give it a mind-blowing description and enter the title of your collection (if you want to).
In this instance, I made the Dress: sub-collection.
Add more items to your new collection after that.
Do not neglect to click Save.
I'll add 2 additional sub-collection titles for shoes and shirts.
Step 2: Create a parent collection
This serves as a parent collection for the three sub-collections I mentioned above. The parent collection is titled Women's Clothing.
The Women Clothing collection has to be added to the main menu as the next step.
Go to Online Store > Navigation > Add menu to accomplish this.
You now give your new menu a name. I'll refer to it in this instance as Collection Women Clothing.
Keep in mind that the title of the new menu must adhere to this structure: A collection + [the name of the parent collection]
This format must be used because the code relies on the navigation's handle to function properly.
Return to your Navigation > Main menu > Add menu item.
Give it a name, then connect it to the women clothing sub-collection you already made.
Step 3: Update collection template
In Shopify, you must now edit the collection template in order to establish sub-collections.
Return to your online store, select Themes, then click Actions, then Edit Code.
After that, incorporate the following code into the group.
Liquid document located in the Templates' directory
{%- assign collection_handle = collection.handle -%}
{%- assign subs = linklists[collection_handle].links -%}
{% if subs != blank %}
<div class="collection-subs">
<div class="container">
<div class="row">
{% for sub in subs %}
{% assign subitem_handle = sub.title | handle %}
<div class="col-md-3 col-xs-12">
<div class="sub-collection_item">
<div class="sub-collection_title">
<a href="{{ collections[subitem_handle].url }}">{{ collections[subitem_handle].title }}</a>
</div>
{% if collections[subitem_handle].image %}
<div class="image-custom" style="padding-top: 128%;">
<img class="img-fluid image-responsive" src="{{ collections[subitem_handle].image | img_url: 'master' }}" alt="Sub image">
</div>
{% else %}
<div class="image-custom" style="padding-top: 128%;">
{{ 'collection-1' | placeholder_svg_tag }}
</div>
{% endif %}
</div>
</div>
{% endfor %}
</div>
</div>
</div>
{% endif %}
This is the precise spot where the code has to be added:
Step 4: Add style for sub-collections
Locate theme.scss.liquid in the Assets' directory using the search bar, and then add the following code at the end of the file:
Here is the code you need:
.container {
max-width: 1200px;
padding-right: 15px;
padding-left: 15px;
margin-right: auto;
margin-left: auto;
}
.row {
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
margin-right: -15px;
margin-left: -15px;
}
.col-md-3 {
padding-right: 15px;
padding-left: 15px;
-ms-flex: 0 0 25%;
flex: 0 0 25%;
max-width: 25%;
}
.col-md-4 {
padding-right: 15px;
padding-left: 15px;
-ms-flex: 0 0 33.3333333333%;
flex: 0 0 33.3333333333%;
max-width: 33.3333333333%;
}
.sub-collection_item {
position: relative;
margin-bottom: 20px;
.sub-collection_title {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background: rgba(#fff, 0.8);
min-width: 209px;
max-width: 409px;
text-align: center;
padding: 25px;
cursor: pointer;
z-index: 1;
transition: all 0.35s ease;
a {
color: rgb(57, 78, 103);
font-size: 18px;
line-height: 19px;
font-weight: 400;
letter-spacing: 0.4px;
text-transform: uppercase;
}
&:hover {
background: rgba(#30AAEC, 0.8);
a {
color: #fff;
}
}
}
}
.image-custom {
position: relative;
img, svg {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
width: 100%;
height: 100%;
background: #fff;
transition-property: opacity;
object-fit: cover;
}
}
Check your store now to discover the outcome.
What I get is this:
Shopify Sub Collection: FAQs
Can you create subcollections in Shopify?
No, Shopify does not have a built-in feature for creating subcollections. Collections in Shopify are typically organized in a flat hierarchy, where each collection exists on the same level.
However, you can use workarounds to achieve a similar effect. One way is to use tags or metafields to add additional categorization to your products and then create collections based on those tags or metafields. Another option is to use a third-party app from the Shopify App Store that provides advanced collection management features.
How do I create a collection under a collection in Shopify?
As mentioned earlier, Shopify does not support creating subcollections by default. However, you can create a collection that appears to be nested under another collection by utilizing a naming convention or organizing your collections strategically.
For example, you can prefix or suffix the names of the collections to indicate a hierarchy. You could also group your collections together by using a common tag or metafield value, which would allow you to filter and display them together.
How do you feature a subset of collections on a page in Shopify?
To feature a subset of collections on a page in Shopify, you can use the built-in collection list feature, and follow the steps below:
- From your Shopify admin, go to Online Store > Pages.
- Select the page where you want to feature the collections or create a new page.
- In the page editor, click on the Insert collection button in the toolbar.
- Choose the collections you want to feature by checking the boxes next to their names.
- Customize the display options such as the layout, sorting, and number of products per collection.
- Save the changes to the page.
Conclusion
It can be trickier than you think to add Shopify sub collections to Shopify. But you may help yourself by following the procedures listed above.
But you may help yourself by following the procedures listed above. Get in touch with our Shopify development services right away if you don't know how to do it and don't want to perform any coding!
