2

I'm currently using Categories to organize an inventory of products. The hierarchy is straightforward: category, subcategory, and single product entry. The url structure I'm are hoping to use reflects the hierarchy: homepage.com/products/category/subcategory/product

So far, I've been able to display the proper slug for the products section and output a simple nav menu. What I'd like to do now is refine the nav so that it only display the subcategories (children) of the category (parent) of product I'm on. I think I'm looking for something like this but for Categories + Channel section rather than a Structure section.

I have an idea of how to achieve this, but I'm having trouble getting it to work. I think what I'd like to do is pull the url segment, match it to a category, then display its children. I know I'm missing something basic or haven't fully grasped the syntax of Twig. Any help would be appreciated, thank you!

-- edit --

Marion's suggestion was right on:

{% set categories = craft.categories.group('products').level('1') %}

<ul id="sideNav">
  {% for category in categories %}
    {% set activeCat = (category.slug == craft.request.segment(2)) %}
    <li{% if activeCat %} class="active"{% endif %}>
      <a href="{{category.url}}">{{ category.title }}</a>
      {% if activeCat %}
        {% set subCategories = craft.categories.descendantOf(category) %}
        <ul>
          {% for subCat in subCategories %}
            <li><a href="{{subCat.url}}">{{subCat.title}}</a></li>
          {% endfor %}
        </ul>
       {% endif %}
   </li>
  {% endfor %}
</ul>

2 Answers 2

4

I think you don't need or want the {% nav %} tag. This should work with your current nav:

{% set categories = craft.categories.group('products') %}

<ul id="sideNav">
  {% for category in categories %}
    {% set thisIsActiveCategory = (category.slug == craft.request.segment(2)) %}
    <li{% if thisIsActiveCategory %} class="active"{% endif %}>
      {{ category.title }}
      {% if thisIsActiveCategory %}
        {# loop over the subcategories #}
        {% set subCategories = craft.categories.descendantOf(category) %}
        <ul>
          {% for subCat in subCategories %}
            <li>{{subCat.title}}</li>
          {% endfor %}
        </ul>
      {% endif %}
    </li>
  {% endfor %}
</ul>
1
  • Marion, I'm going to try this on Monday. Looks a lot closer than what I have been working on. Thanks!
    – Steph
    Jul 3, 2014 at 23:44
2

The outline of what you want to do looks reasonable. Here are some details:

{# get the category from the segment #}
{% set parentCategory = craft.categories.slug(craft.request.segment(2)) %}

{# get the children of this category #}
{% set subCategories = craft.categories.descendantOf(parentCategory) %}

{# loop over the subcategories #}
{% for subCat in subCategories %}
  <a href="{{subCat.url}}">{{subCat.title}}</a>
{% endfor %}
1
  • Thanks for your answer Marion. I'm trying to apply this to my current nav setup, which I'll edit into my original question. So far no success, but will keep trying.
    – Steph
    Jul 3, 2014 at 19:05

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.