Subcollections

Let's start from the point that some collections can be complex, and better to divide them into subcategories for a better customer experience in finding specific products. In the Shopify theme, we have such an opportunity. We can help you manage these settings. Please follow this detailed instruction and the screenshots I've attached.

This is an example of how subcollections can look on a specific collection.

Before editing this block on collection page with products, we need to create menu in navigation section on Shopify Dashboard.

Creating Subcollections menu:

1) Click on Content tab;

2) Click on Menus tab;

3) Find a button “Add a menu” and click on it for creating a new menu

4) Type a name of menu and start to add a new menu items

We have created a menu where the "Headphones" collection includes three other collections as its categories. After the "Headphones" collection and its menu items, we display separate collections that are not included in any other collection. These three collections, not added to the main collection and "Headphones" collection, will be shown on the collection page with all products. Each collection has a link to its page that you can add by clicking the "Edit" button and searching a link in a field for typing.Please check the screenshots below for reference.

Firstly, we created an "Headphones" collection by selecting "Add menu item", entering a link, assigning a name, and then proceeding to add subcollections.

To include other collections within the main collection, click on the dots icon next to the subcategory and move it into the main collection. Afterward, you will see your main collection displayed as a tab that includes subcollections.

Settings in theme editor

1) Open default collection page

2) Click on Product Grid template

3) Add subcollections block or check if it is added

4) In settings of block add created before Subcollections menu in navigation section on Dashboard.

Appearance on demo store

Headphones collection

Collection with all products

All settings of block in theme editor

Setting	Description
Color scheme	Choose color scheme with appropriate colors for subcollection block.
Collection color shceme	Choose a color scheme from the list of available options for the displayed collection.
Current collection color shceme	These settings allow you to choose a color scheme for the current collection, helping users easily identify the current collection and navigate between them more efficiently.
Select menu	Select menu from the menu list and add your created subcollections menu.
Show product count	On each subcollection can be visible number of product that this collection include. Check the box to have this option.
Heading color	This setting allows you to customize the color of collection headings within the selected color scheme. Available color options include: Text Text secondary Heading
Subcollections per row	Use the slider to select the number of collections to display in a single row. If there are more collections, they will automatically be arranged in additional rows based on the total number.

Section padding

Setting	Description
Top padding	The "Top padding" setting allows you to adjust the amount of space at the top of the section using a slider.
Bottom padding	The "Bottom padding" setting functions similarly to the “Section top padding” setting, but controls the space at the bottom of the section.
Top padding mobile	The "Top padding mobile" setting allows you to adjust the amount of space at the top of the section specifically for mobile devices, using a slider.
Bottom padding mobile	The "Bottom padding mobile" setting works similarly to the "Top padding mobile" setting but controls the space at the bottom of the section for mobile devices.