How do I only display list of categories at certain level of parent category that have entries

Question

I try to explain you semantically what I want to achieve here. I couldn't make it shorter. Sorry.

1. Navigation will be constructed from .level(1) categories.

2. At "site.com/firstLevelCat" I want to display list of populated .level(2) categories like this

   • site.com/firstLevelCat/secondLevelCat
   • site.com/firstLevelCat/secondLevelCat2
   • site.com/firstLevelCat/secondLevelCat3

3. At "site.com/firstLevelCat/secondLevelCat" I'd like to display list of .level(2) categories along with a list of .level(3) categories like this

   • site.com/firstLevelCat/secondLevelCat/thirdLevelCat
   • site.com/firstLevelCat/secondLevelCat2/thirdLevelCat
   • site.com/firstLevelCat/secondLevelCat3/thirdLevelCat

I intend to build it up to 4th level.

Answer 1

If I understand your issue correctly, try changing

{% set topLevelCats = craft.categories.relatedTo({ sourceElement: entryIds }).group('filter').level(1) %}
{% set secondLevelCats = topLevelCats.slug(secondSeg) %}

to

{% set topLevelCats = craft.categories.relatedTo({ sourceElement: entryIds }).group('filter').level(1) %}
{% set secondLevelCats = craft.categories.slug(secondSeg).level(2) %}

Answer 2

{# Here, we grab segment of a URI's to use in conditional statements for displaying category levels. Conditionals aren't here. Will have to do it by yourself. #}
{% set firstSeg = craft.request.getSegment(1) %}
{% set secondSeg = craft.request.getSegment(2) %}
{% set thirdSeg = craft.request.getSegment(3) %}
{% set fourthSeg = craft.request.getSegment(4) %}

{# Grab all of the entry ids from the section, which we want to display categories for. #}
{% set entryIds = craft.entries.section('products').ids() %}


{# Here we grab the category group and a certain level, which we want to display categories for, and relate them to 'entryIds' #}
{% set firstLvls = craft.categories.relatedTo({ sourceElement: entryIds }).group('categories').level(1) %}
{% set secondLvls = craft.categories.relatedTo({ sourceElement: entryIds }).group('categories').level(2) %}
{% set thirdLvls = craft.categories.relatedTo({ sourceElement: entryIds }).group('categories').level(3) %}
{% set fourthLvls = craft.categories.relatedTo({ sourceElement: entryIds }).group('categories').level(4) %}

{# We loop through first level of categories. Constructively, it's the navigation menu located at 'site.com/' #}
{% for firstLvl in firstLvls %}
    <li>
        <a href="{{ firstLvl.getUrl }}">{{ firstLvl.title|replace({'-':' '}) }}</a>
    </li>
{% endfor %}

{# We loop through second level of categories. Constructively, it's the first category's selection menu
located at 'site.com/catLevel1' #}
{% for secondLvl in secondLvls %}
    <li>
        <a href="{{ secondLvl.getUrl }}">{{ secondLvl.title|replace({'-':' '}) }}</a>
    </li>
{% endfor %}

{# We loop through third level of categories. Constructively, it's the second category's selection menu
located at 'site.com/catLevel1/catLevel2' #}
{% for thirdLvl in thirdLvls %}
    <li>
        <a href="{{ thirdLvl.getUrl }}">{{ thirdLvl.title|replace({'-':' '}) }}</a>
    </li>
{% endfor %}

{# We loop through fourth level of categories. Constructively, it's the third category's selection menu
located at 'site.com/catLevel1/catLevel2/catLevel3' #}
{% for fourthLvl in fourthLvls %}
    <li>
        <a href="{{ fourthLvl.getUrl }}">{{ fourthLvl.title|replace({'-':' '}) }}</a>
    </li>
{% endfor %}