Could you please assist me in structuring the content menu? I have over 40 pages in my recent project, most of which are static pages. I would like to create blocks so that my client can edit these pages by adding and removing predefined blocks. Additionally, I aim to organize them as submenus under the main “Content” menu. However, I prefer to establish a structured approach to this without relying on any plugins, including my own.
I’ve achieved organizing content using blocks as follows. I created block/mixins where there are individual blocks. Then I created a BlockBuilder also mixin as a repeater with groups of mixin blocks. And then I just add it to the content type as a mixin. The blocks can only be manipulated via blueprint because the block content in the repeater is stored as JSON.
In the content I list them in a loop as the client sorts them. For each block I have partial.html and CSS.
Can you explain me better than you thought: organize them as submenus under the main “Content” menu
I would like to add a structure like:
Content (main menu)
Aboout Us (sub menu)
Children stories
Story and mission
Projects
…
Camp and Activities (submenu)
Camp
Volunteering
…
Does not need to look like this, just add a bit of structure.
So it should probably be enough to create a type entry structure with depth. And structure the content underneath. Then on the page it is enough to write a recursive macro for the content structure to create a menu. Something like this:
{% macro render_toc(items, activeSlug) %}
{% for item in items %}
{% set hasChildren = item.children|length %}
{% set isActive = item.fullslug == activeSlug %}
{% set slugItem = item.fullslug %}
<li class="{{ hasChildren ? 'collapsible' }} {{ isActive ? 'active' }}">
<a href="{{ 'your_page'|page({ fullslug: slugItem }) }}" class="label">{{ item.title }}</a>
{% if hasChildren %}
<ul id="tocItem-{{ item.id }}" class="collapse {{ isActive ? 'show' }}">
{% if item.children %}
{{ _self.render_toc(item.children, activeSlug) }}
{% endif %}
</ul>
{% endif %}
</li>
{% endfor %}
{% endmacro %}
{% import _self as menu %}
{% set activeSlug = activeSlug|default(this.param.fullslug|default('')) %}
{% set menuLinks = menu.render_toc(items, activeSlug)|trim %}
You have to customize it according to what you use in the URL, whether fullslug or just slug or something else.
menu.render_toc(items …) are the items of your content structure