Skip to content
Grav 2.0 is officially stable. Read the announcement →
General

Show only Children in Nav

Started by Pascal Mahlberg 9 years ago · 7 replies · 1022 views
9 years ago

Hey,

i am new in grav & twig and i would like to build a "footer-nav" with only children links of a specific main navigation ul.
By the way the same "Children-nav", i would like to use on specific Subpages in a sidenavigation as a "overview" of the subpages.

Like:

HTML
<nav>
    <ul>
        <li></li>
        <li>
            <ul class="dropdown-menu"> // Only this List with all of their children links i would like to list
                <li></li> // Children
                <li></li> // Children
            </ul>
        </li>
    </ul>
</nav>

Any suggestings to this topic?

Thank you a lot and have a nice day!

last edited 10/18/17 by Pascal Mahlberg
9 years ago

If I'm understanding correctly, you want to output the children of a specific page, right?

If so this should work.

TWIG
{% set items = { items: {'@page.children': '/path/to/parent'},'order': {'by': 'folder', 'dir': 'asc'}} %}
<ul>
    {% for item in items %}
        <li><a href='{{item.url}}'>{{item.title}}</a></li>
    {% endfor %}
</ul>
👍 1
9 years ago

Thank you for your respond. I just tried to use this code snippet, but unfortunately, if i'm linking absolut to the site it doesn't work for me. I show you my page tree:

TXT
/startseite
/privilegien
/privilegien/children 1
/privilegien/children 2
/privilegien/children 3
/privilegien/...
/angebote
/ueber-uns
/partner
/kontakt

In this case i would like to show only the Children Links from "/privilegien".

Here i have to use the absolute link to the parent like "/privilegien" or a relative link from the page i use this snippet?

Here it only shows a ul with two empty li in the html.

9 years ago

Im using following technique:

TWIG
    {% set footermenu = page.collection( {'items':{'@taxonomy':{'navigation': 'footer'}}, 'order':{'by': 'header.order', 'dir': 'asc'} }) %}
    {% if footermenu | length > 0 %}
        <p>
            {% for page in footermenu %}
                <a href="{{ page.url }}">{{ page.title }}</a>
                {% if not footermenu.isLast(page.path) %}
                    &middot;
                {% endif %}
            {% endfor %}
        </p>
    {% endif %}

Using a taxonomy named "navigation" I can create multiple menus, usually it's only the "siteservice". The pages are routable but not visible (i.e.: no number prefix)

👍 1
9 years ago

Do you just want to know if one of the pages in the list is the page you're currently on? If so, this might work. I haven't tested it with a collection, but worth a shot.

TWIG
{% for item in items %}
    {% set isCurrent = (item.active or item.activeChild) ? 'active' : '' %}
    <li class='regular-class {{isCurrent}}'><a href='{{item.url}}'>{{item.title}}</a></li>
{% endfor %}
👍 1

Suggested topics

Topic Participants Replies Views Activity
General · by jean-louis67, 3 days ago
2 79 2 days ago
General · by Andy Miller, 6 days ago
0 144 6 days ago
General · by Veehem, 1 week ago
0 144 1 week ago
General · by milkboy, 1 week ago
0 138 1 week ago
General · by ian russell, 2 weeks ago
2 225 2 weeks ago