Gufran Hasan
Gufran Hasan

Reputation: 9373

How to display related sub-categories of a category when click on a category in Shopify?

How to display related sub-categories of a category when clicking on a category in Shopify?

I want to display sub-categories with icons and names of a category when clicking on a category.

Upvotes: 0

Views: 2854

Answers (1)

Stan
Stan

Reputation: 294

In Shopify, sub-categories are generally handled with tags.

For example, you have a collection "Mens" and you would like to have sub-collections like "Shoes", "Shirts" and "Jeans". You can just tag these products with the related tags (shoes, shirts, jeans) and then filter the "Mens" collection like this:

/collection/mens -> all products in collection "Mens"

/collection/mens/shoes -> only products in colleciton "Mens" tagged with "shoes"

You can find more information here: https://help.shopify.com/themes/customization/collections/create-subcategories

If this doesn't work for you and you still need to be able to display sub-collections, which are actual collections in the Admin Panel, you can add this to your collections.liquid file:

{% assign collection_handle = "collection-" | append: collection.handle %}
{% assign linklist_exists = linklists[collection_handle].links %} 
{% if linklist_exists != empty %}
  <ul>
    {% for link in linklists[collection_handle].links %}
      <li><a href="{{ link.url }}">{{ link.title }}</a></li>
    {% endfor %}
  </ul>
{% else %}
  // no sub-collections
{% endif %}

It gets the handle of the current collection and looks for a link list (menu) with a handle "collection-current_collection_handle" and then displays the links of this link list (if such a link list exists).

For example:

You have collections "Mens", "Womens", "Kids" and you would like when a visitor clicks on "Mens" for example, another menu to appear with sub-collections like "Shoes", "Shirts" and "Jeans".

You have to create these sub-collections as normal collections and add products to them. Then go to Online Store -> Navigation and create a new Menu, but make sure its handle is "collection-mens". Then add the menu items and connect them with the sub-collections (Shoes, Shirts, Jeans).

Upvotes: 2

Related Questions