Craft CMS Asked on December 19, 2021
I’m struggling to loop through level 1 categories
and display as a category title
and then show nested level 2 categories (via a category title) under which I want to nest related categories
to achieve:
PARENT CATEGORY
although the content and order is correct, I have divs closing in the wrong place so can’t control which content is positioned by flexbox using this code:
{% for category in craft.categories.group('team') %}
{% if category.level == 1 %}
<div class="container mx-auto bg-red-300 flex">
<p class="flex-none w-full text-6xl my-20"><a href="{{ category.url }}">{{ category.title }} LEVEL 1</a></p>
{% endif %}
<div class="container mx-auto bg-green-300 flex">
<div class="w-1/4">
{% if category.level == 2 %}
<div class="bg-green-700 text-3xl">
{{ category.title }} LEVEL 2
</div>
{% for entry in craft.entries.section('team').relatedTo(category).all() %}
<div class="bg-green-500">
<dl>
<dt style="color:#EB8B2D;">{{entry.title}}</dt>
<dd>{{entry.positionTitle}}
</dd>
<dd><a href="mailto:{{entry.emailAddress}}">{{entry.emailAddress}}</a></dd>
<dd><strong>Tel: </strong>{{entry.telephoneNumber}}</dd>
<dd><strong>Mob:</strong> {{entry.mobileNumber}}</dd>
</dl>
</div>
{% endfor %}
{% endif %}
</div>
</div>
</div>
{% endfor %}
This won't be super efficient if you have a loads of teams/people as it will run an entry
query per subteam (and it won't check for empty teams either) but it should get you started.
{% set categories = craft
.categories()
.group('team')
.level(1)
.with('children')
.all() %}
{% for category in categories %}
<div class="container mx-auto bg-red-300 flex">
<p class="flex-none w-full text-6xl my-20"><a href="{{ category.url }}">{{ category.title }}</a></p>
{% for child in category.children %}
<div class="bg-green-700 text-3xl">
{{ child.title }}
</div>
{% for entry in craft.entries.section('team').relatedTo(child).all() %}
<div class="bg-green-500">
<dl>
<dt style="color:#EB8B2D;">{{entry.title}}</dt>
<dd>{{entry.positionTitle}}
</dd>
<dd><a href="mailto:{{entry.emailAddress}}">{{entry.emailAddress}}</a></dd>
<dd><strong>Tel: </strong>{{entry.telephoneNumber}}</dd>
<dd><strong>Mob:</strong> {{entry.mobileNumber}}</dd>
</dl>
</div>
{% endfor %}
{% endfor %}
</div>
{% endfor %}
Answered by Oli on December 19, 2021
Get help from others!
Recent Questions
Recent Answers
© 2024 TransWikia.com. All rights reserved. Sites we Love: PCI Database, UKBizDB, Menu Kuliner, Sharing RPP