Support Center

HTML Snippets for Categories

Creating a 3 level Category menu:

    {% if categories != empty %}             
    <ul>
    {% for category in categories %}
      <li><a href="{{category.url}}">{{category.name}}</a>
      {% if subcategories != empty %}
      <ul>
      {% for subcategory in category.subcategories %}
        <li><a href="{{ subcategory.url }}">{{ subcategory.name }}</a></li>
      <ul>
      {% for subsubcategory in subcategory.subcategories %}
        <li><a href="{{ subsubcategory.url }}">{{ subsubcategory.name }}</a></li>
      {% endfor %}
      </ul>
      {% endfor %}
      </ul>
      {% endif %}         
      </li>
    {% endfor %}
    </ul>
    {% endif %}   <br><br> Showing the products inside a category:  

    <ul>
    {% for product in subcategory.products %}  
      <li><a href="{{ product.url }}">{{product.name}}</a></li>  
    {% endfor %}  
    </ul> <br><br> Assigning a specific category to a variable:

    {% assign cat = store.category['permalink'] %}   <br><br> and display subcategories of that specific category:  

    {% for subcategory in cat.subcategories %}
      <p>{{ subcategory.name }}</p>
      <ul>
      {% for subsubcategory in subcategory.subcategories %}
        <li>{{ subsubcategory.name }}</li>
      {% endfor %}
      </ul>
    {% endfor %}   <br><br> or display products of that specific category:  

    {% for product in cat.products %}
      {{ product.name }}
    {% endfor %}

Start your journey with us!

Free trial for 14 days. No credit card required.