Showing Subpages in Nav

Kirby 3 Solved ✅
1

I am showing Subpages onclick in the navigation. I got it to work to show the subpages for the first menuitem with:

   <?php $x = $page()->children();?>
           <?php foreach ($x as $y): ?>
               <a href="<?=$y->url();?>"><?=$y->title();?></a>
    <?php endforeach;?>

But now all subpages are shown, but to use “not” wouldn´t be practical, since I also have one submenu in the navigation. I tried: Subpages in Subpages with foreach loop
which did not work.

Thank you so much for the help in this forum!

2

Hey Jay, I’m missing some context. Could you please post the complete navigation?

3

Hi Sonja! Of course! Just didn´t want to complicate the process.

<div id=mobile__nav__complete class="nav__menu">      

<!-- Get the Main Navigation -->

  <?php $page = $site->children()->not('datenschutz', 'impressum', "error", "home");?>

  <?php foreach ($page as $item): ?>
  <a href="<?=$item->url();?>"><?=$item->title();?></a>
  <?php endforeach;?>

This is the Subnavigation below:

    <!--- Start Verfahren -Navigation -->

   <div id="verfahren__sub" class="verfahren__submenu">
        <?php $verfahren = $page()->children();?>
           <?php foreach ($verfahren as $y): ?>
               <a href="<?=$y->url();?>"><?=$y->title();?></a>
        <?php endforeach;?>
  </div>

<!--- Start Service-Navigation -->

 <div id="service__sub" class="service__submenu">
        <?php $service = $page()->children();?>
           <?php foreach ($service as $a): ?>
               <a href="<?=$a->url();?>"><?=$a->title();?></a>
        <?php endforeach;?>
  </div>
4

Why are those separate submenus not part of the main navigation loop? A nested menu should look like this:

1 Like
5

I did not understand some parts of the loop and tried to get the main navigation to work first.

6

Yes, that’s fine, but creating the submenu independently of the loop doesn’t really make sense.

What exactly is not clear in the example and needs more explanation?

1 Like
7

This for example I don´t understand:

        <li><a<?php e($child->isOpen(), ' class="active"')?> href="<?=$child->url()?>"><?=$child->title()->html()?></a></li>

What does “isOpen()” mean, checked the documentation but could not really make sense of it.
I guess this is still for the lack of php on my end. Still have a long way to go.
Nevertheless, thank you so much for helping!

8

Kirby has two methods that allows you to act on the “state” of a menu item, e.g. add a class:

  • $page->isActive(): Checks if the page is the current page, i.e. the one that is currently showing in the browser
  • $page->isOpen() : Checks if the page is either the current page or a descendant of the current one.

e() is a helper function that checks a condition and prints the second parameter if the condion is true or the third (if given) if the condition is false.

1 Like
9

Thank you for the clarification! All items navigation items are visible now.
Working on EventListeners would be the next step? Since all items are visible.
Thank you!

10

Yep, by default you would hide the submenu, and then show it when the parent item is focused. You can do this via classes, e.g add a class is-active or whatever when the item is focused, and remove this class again when it doesn’t apply anymore.

1 Like
11

Going back to the drawing board. Thanks again!