Navigation / menu
<?php
echo ipSlot('menu', 'menu1');
This function gives you following menu list structure:
<ul class="level1">
<li class="active">
<a href="http://www.example.com/home" title="Home">Home</a>
</li>
<li>
<a href="http://www.example.com/lorem-ipsum" title="Lorem ipsum">Lorem ipsum</a>
</li>
<li>
<a href="http://www.example.com/dolor-sit" title="Dolor sit">Dolor sit</a>
</li>
</ul>
Please be aware that 'menu1' is not the title of the menu, but its name. You can find out a menu name by pressing settings icon next to menu record in Pages admin panel.
CSS classes used in menu list
Use these CSS classes to style menus in your own way:
| CSS class | Tag | Meaning |
| level | ul |
A prefix used to set the depth of the list. First level ul item will have level1, its child list level2, etc. |
| active | li | Menu item is active. Represents currently displayed page. |
| crumb | li | Means that the page is in currently active breadcrumb. In other words, this page is parent of an active page. |
| disabled | li | Page has disabled flag on. See page properties in Pages admin panel. |
| parent | li | A page has children. |
| children | ul | Marks all lists of a menu except the first one. |
Two examples bellow are very useful in every day usage when you want to add your own styles or add HTML attributes to generated menu HTML. Please read them carefully.
You can use your alternative class names by passing an array of options instead of a menu name.
<?php
$options = array(
'items' => 'menu1', //menu to be displayed
'active' => 'light', // use 'light' instead of 'active'
'crumb' => 'dark' // use 'dark' instead of 'crumb'
);
echo ipSlot('menu', $options);
Additionally, there is an attributes parameter that gives you an option to set any attributes on root ul tag.
<?php
$options = array(
'items' => 'menu1', //menu to be displayed
'attributes' => array ('id' => 'ipsTest')
);
echo ipSlot('menu', $options);
Custom items array
items attribute can accept not only the name of a menu, but exact list of items to be displayed. That list has to be an array of \Ip\Menu\Item objects.
Add custom menu items
<?php
$page1 = new \Ip\Menu\Item();
$page1->setTitle('My shop');
$page1->setUrl('http://www.example.com/shop');
$page2 = new \Ip\Menu\Item();
$page2->setTitle('Support');
$page2->setUrl('http://www.example.com/support');
$options = array(
'items' => array($page1, $page2), //menu to be displayed
'attributes' => array ('id' => 'ipsTest')
);
echo ipSlot('menu', $options);
Also, you can use \Ip\Menu\Helper class, as in the following example:
Print submenu of currently active page
<?php
$pages = \Ip\Menu\Helper::getChildItems();
echo ipSlot('menu', $pages);
Print specific levels of A menu
The example below outputs 'menu1' levels from 2 to 7.
<?php
$pages = \Ip\Menu\Helper::getMenuItems('menu1', 2, 7);
echo ipSlot('menu', $pages);
Please note that it is possible to generate second menu level only if the first level item is in a breadcrumb.
Other navigation features
ImpressPages also has breadcrumb, languages and logo slots which can be used to output respective navigation elements in your theme.
Override default HTML
If you want to change the defaul HTML, override Ip/Internal/Config/view/menu.php file in your theme. This will change the look of all menus on your website. If you want to use custom layout just for one particular menu, pass the view option:
<?php
echo ipSlot('menu', array(
'items' => 'menu1',
'view' => 'Theme/MyTheme/view/mycustomview.php'
));
?>