Forum

Thread tagged as: Question, Runway

Nested categories

I'm building an existing shop out for someone and they have a lot of categories at various nested levels.These categories are output one level at a time and users can click through the hierarchy to get to the products at the end. The nesting is not consistent across categories - some may have 2 levels and some may have up to 4.

On each category page there is a list of top level categories. Whichever category is being viewed (whether you are at the top level of several levels down) that category is expanded to show the sub categories.

I have the following code on my page which will put out the top level and all 1st sub levels but I'm at a bit of a loss as to how to pick up the current category and expand only that one (whilst still show all top levels).

Secondly, In order to output several levels, I'm going to have to nest the "each" functions to a set depth. Is there a better way to do this?

perch_categories([
                'set' => 'products',
                'template' => 'sidebar',
                'filter' => 'catParentID',
                'match' => 'eq',
                'value' => '0',
                'each' => function($item) {
                    $item['subs'] = perch_categories([
                        'set' => 'products',
                        'template' => 'sidebar_subs',
                        'filter' => 'catParentID',
                        'match' => 'eq',
                        'value' => $item['catID']
                    ],true);
                    return $item;
                }
            ]);

Top level template

<perch:before><ul class="sidemenu"></perch:before>
    <li class="<perch:category id="cat-colour" />"><a href="/products/<perch:category id="catSlug" />" title="<perch:category id="catTitle" />"><perch:category id="catTitle" /></a>
        <perch:category id="subs" encode="false" />
    </li>
<perch:after></ul></perch:after>

Sub level template

<perch:before><ul></perch:before>
    <li class="<perch:category id="cat-colour" />"><a href="/products/<perch:category id="catSlug" />" title="<perch:category id="catTitle" />"><perch:category id="catTitle" /></a>
    </li>
<perch:after></ul></perch:after>

Thanks

Caleb Evans

Caleb Evans 1 points

  • 5 years ago
Drew McLellan

Drew McLellan 2638 points
Perch Support

I don't think there is a better way currently, but there needs to be. It's something I've been thinking about. I'm not sure what the best way to implement it is yet.

Thanks Drew.

The way the navigation nesting works is pretty good. I imagine the same principles apply to this.

Drew McLellan

Drew McLellan 2638 points
Perch Support

Yes, that is one way to look at it, certainly.