Run
composer require mimmi20/mezzio-navigation-laminasviewrenderer-bootstrap
Calling the view helper for menus in your layout script:
<!-- ... -->
<body>
<?= $this->navigation('default')->menu() ?>
</body>
<!-- ... -->
Once the mezzio-navigation module is registered, you can create as many navigation definitions as you wish, and the underlying factories will create navigation containers automatically.
Add the container definitions to your configuration file, e.g.
config/autoload/global.php
:
<?php
return [
// ...
'navigation' => [
// Navigation with name default
'default' => [
[
'label' => 'Home',
'route' => 'home',
],
[
'label' => 'Page #1',
'route' => 'page-1',
'pages' => [
[
'label' => 'Child #1',
'route' => 'page-1-child',
],
],
],
[
'label' => 'Page #2',
'route' => 'page-2',
],
],
// Navigation with name special
'special' => [
[
'label' => 'Special',
'route' => 'special',
],
[
'label' => 'Special Page #2',
'route' => 'special-2',
],
],
// Navigation with name sitemap
'sitemap' => [
[
'label' => 'Sitemap',
'route' => 'sitemap',
],
[
'label' => 'Sitemap Page #2',
'route' => 'sitemap-2',
],
],
],
// ...
];
There is one important point to know when using mezzio-navigation as a module: The name of the container in your view script must be prefixed with
Mezzio\Navigation\
, followed by the name of the configuration key. This helps ensure that no naming collisions occur with other services.
The following example demonstrates rendering the navigation menus for the named
default
, special
, and sitemap
containers.
<!-- ... -->
<body>
<?= $this->navigation('Mimmi20\Mezzio\Navigation\Default')->menu() ?>
<?= $this->navigation('Mimmi20\Mezzio\Navigation\Special')->menu() ?>
<?= $this->navigation('Mimmi20\Mezzio\Navigation\Sitemap')->menu() ?>
</body>
<!-- ... -->
The navigation helpers are used for rendering navigational elements from
Mimmi20\Mezzio\Navigation\Navigation
instances for the use with Bootstrap.
There are 2 built-in helpers:
- Breadcrumbs, used for rendering the path to the currently active page.
- Menu, used for rendering menus.
All built-in helpers implements the interface Mimmi20\Mezzio\Navigation\LaminasView\View\Helper\Navigation\ViewHelperInterface
, which
adds integration with
laminas-acl or laminas-rbac and
laminas-i18n.
If a container is not explicitly set, the helper will create an empty
Mezzio\Navigation\Navigation
container when calling $helper->getContainer()
.
Navigation view helpers use the magic method __call()
to proxy method calls to
the navigation container that is registered in the view helper.
$this->navigation()->addPage([
'type' => 'uri',
'label' => 'New page',
]);
The call above will add a page to the container in the Navigation
helper.
The navigation helpers support translation of page labels and titles.
The proxy helper will inject its own translator to the helper it proxies to if the proxied helper doesn't already have a translator.
All navigational view helpers support Permissions. If an
Permission is used in the helper, the role in the helper must be allowed by the Permission to
access a page's resource
and/or have the page's privilege
for the page to be
included when rendering.
If a page is not accepted by Permission, any descendant page will also be excluded from rendering.
The proxy helper will inject its own Permission and role to the helper it proxies to if the proxied helper doesn't already have any.
Breadcrumbs are used for indicating where in a sitemap a user is currently browsing, and are typically rendered like the following:
You are here: Home > Products > FantasticProduct 1.0
The breadcrumbs()
helper follows the Breadcrumbs Pattern
as outlined in the Yahoo! Design Pattern Library, and allows simple
customization (minimum/maximum depth, indentation, separator, and whether the
last element should be linked), or rendering using a partial view script.
The Breadcrumbs helper finds the deepest active page in a navigation container, and renders an upwards path to the root. For Route pages, the "activeness" of a page is determined by inspecting the request object, as stated in the section on pages.
The helper sets the minDepth
property to 1 by default, meaning breadcrumbs
will not be rendered if the deepest active page is a root page. If maxDepth
is
specified, the helper will stop rendering when at the specified depth (e.g. stop
at level 2 even if the deepest active page is on level 3).
This example shows how to render breadcrumbs with default settings.
In a view script or layout:
<?= $this->navigation()->breadcrumbs(); ?>
The call above takes advantage of the magic __toString()
method, and is
equivalent to:
<?= $this->navigation()->breadcrumbs()->render(); ?>
Output:
<a href="/products">Products</a> > <a href="/products/server">Foo Server</a> > FAQ
This example shows how to render breadcrumbs with initial indentation.
Rendering with 8 spaces indentation:
<?= $this->navigation()->breadcrumbs()->setIndent(8) ?>
Output:
<a href="/products">Products</a> > <a href="/products/server">Foo Server</a> > FAQ
This example shows how to customize breadcrumbs output by specifying multiple options.
In a view script or layout:
<?= $this->navigation()->breadcrumbs()
->setLinkLast(true) // link last page
->setMaxDepth(1) // stop at level 1
->setSeparator(' â–¶' . PHP_EOL); // cool separator with newline
?>
Output:
<a href="/products">Products</a> â–¶
<a href="/products/server">Foo Server</a>
Setting minimum depth required to render breadcrumbs:
<?= $this->navigation()->breadcrumbs()->setMinDepth(10) ?>
Output: Nothing, because the deepest active page is not at level 10 or deeper.
The menu()
helper is used for rendering menus from navigation containers. By
default, the menu will be rendered using HTML UL
and LI
tags, but the helper
also allows using a partial view script.
This example shows how to render a menu from a container registered/found in the view helper. Notice how pages are filtered out based on visibility and ACL.
In a view script or layout:
<?= $this->navigation()->menu()->render() ?>
Or:
<?= $this->navigation()->menu() ?>
Output:
<ul class="navigation">
<li>
<a title="Go Home" href="/">Home</a>
</li>
<li class="active">
<a href="/products">Products</a>
<ul>
<li class="active">
<a href="/products/server">Foo Server</a>
<ul>
<li class="active">
<a href="/products/server/faq">FAQ</a>
</li>
<li>
<a href="/products/server/editions">Editions</a>
</li>
<li>
<a href="/products/server/requirements">System Requirements</a>
</li>
</ul>
</li>
<li>
<a href="/products/studio">Foo Studio</a>
<ul>
<li>
<a href="/products/studio/customers">Customer Stories</a>
</li>
<li>
<a href="/products/studio/support">Support</a>
</li>
</ul>
</li>
</ul>
</li>
<li>
<a title="About us" href="/company/about">Company</a>
<ul>
<li>
<a href="/company/about/investors">Investor Relations</a>
</li>
<li>
<a class="rss" href="/company/news">News</a>
<ul>
<li>
<a href="/company/news/press">Press Releases</a>
</li>
<li>
<a href="/archive">Archive</a>
</li>
</ul>
</li>
</ul>
</li>
<li>
<a href="/community">Community</a>
<ul>
<li>
<a href="/community/account">My Account</a>
</li>
<li>
<a class="external" href="http://forums.example.com/">Forums</a>
</li>
</ul>
</li>
</ul>
This example shows how to render a menu that is not registered in the view
helper by calling renderMenu()
directly and specifying options.
<?php
// render only the 'Community' menu
$community = $this->navigation()->findOneByLabel('Community');
$options = [
'indent' => 16,
'ulClass' => 'community'
];
echo $this->navigation()
->menu()
->renderMenu($community, $options);
?>
Output:
<ul class="community">
<li>
<a href="/community/account">My Account</a>
</li>
<li>
<a class="external" href="http://forums.example.com/">Forums</a>
</li>
</ul>
This example shows how renderSubMenu()
will render the deepest sub menu of
the active branch.
Calling renderSubMenu($container, $ulClass, $indent)
is equivalent to calling
renderMenu($container, $options)
with the following options:
[
'ulClass' => $ulClass,
'indent' => $indent,
'minDepth' => null,
'maxDepth' => null,
'onlyActiveBranch' => true,
'renderParents' => false,
]
Usage of renderSubMenu
method:
<?= $this->navigation()
->menu()
->renderSubMenu(null, 'sidebar', 4) ?>
The output will be the same if 'FAQ' or 'Foo Server' is active:
<ul class="sidebar">
<li class="active">
<a href="/products/server/faq">FAQ</a>
</li>
<li>
<a href="/products/server/editions">Editions</a>
</li>
<li>
<a href="/products/server/requirements">System Requirements</a>
</li>
</ul>
<?= $this->navigation()
->menu()
->setMaxDepth(1) ?>
Output:
<ul class="navigation">
<li>
<a title="Go Home" href="/">Home</a>
</li>
<li class="active">
<a href="/products">Products</a>
<ul>
<li class="active">
<a href="/products/server">Foo Server</a>
</li>
<li>
<a href="/products/studio">Foo Studio</a>
</li>
</ul>
</li>
<li>
<a title="About us" href="/company/about">Company</a>
<ul>
<li>
<a href="/company/about/investors">Investor Relations</a>
</li>
<li>
<a class="rss" href="/company/news">News</a>
</li>
</ul>
</li>
<li>
<a href="/community">Community</a>
<ul>
<li>
<a href="/community/account">My Account</a>
</li>
<li>
<a class="external" href="http://forums.example.com/">Forums</a>
</li>
</ul>
</li>
</ul>
<?= $this->navigation()
->menu()
->setMinDepth(1) ?>
Output:
<ul class="navigation">
<li class="active">
<a href="/products/server">Foo Server</a>
<ul>
<li class="active">
<a href="/products/server/faq">FAQ</a>
</li>
<li>
<a href="/products/server/editions">Editions</a>
</li>
<li>
<a href="/products/server/requirements">System Requirements</a>
</li>
</ul>
</li>
<li>
<a href="/products/studio">Foo Studio</a>
<ul>
<li>
<a href="/products/studio/customers">Customer Stories</a>
</li>
<li>
<a href="/products/studio/support">Support</a>
</li>
</ul>
</li>
<li>
<a href="/company/about/investors">Investor Relations</a>
</li>
<li>
<a class="rss" href="/company/news">News</a>
<ul>
<li>
<a href="/company/news/press">Press Releases</a>
</li>
<li>
<a href="/archive">Archive</a>
</li>
</ul>
</li>
<li>
<a href="/community/account">My Account</a>
</li>
<li>
<a class="external" href="http://forums.example.com/">Forums</a>
</li>
</ul>
<?= $this->navigation()
->menu()
->setOnlyActiveBranch(true) ?>
Output:
<ul class="navigation">
<li class="active">
<a href="/products">Products</a>
<ul>
<li class="active">
<a href="/products/server">Foo Server</a>
<ul>
<li class="active">
<a href="/products/server/faq">FAQ</a>
</li>
<li>
<a href="/products/server/editions">Editions</a>
</li>
<li>
<a href="/products/server/requirements">System Requirements</a>
</li>
</ul>
</li>
</ul>
</li>
</ul>
<?= $this->navigation()
->menu()
->setOnlyActiveBranch(true)
->setMinDepth(1) ?>
Output:
<ul class="navigation">
<li class="active">
<a href="/products/server">Foo Server</a>
<ul>
<li class="active">
<a href="/products/server/faq">FAQ</a>
</li>
<li>
<a href="/products/server/editions">Editions</a>
</li>
<li>
<a href="/products/server/requirements">System Requirements</a>
</li>
</ul>
</li>
</ul>
<?= $this->navigation()
->menu()
->setOnlyActiveBranch(true)
->setMaxDepth(1) ?>
Output:
<ul class="navigation">
<li class="active">
<a href="/products">Products</a>
<ul>
<li class="active">
<a href="/products/server">Foo Server</a>
</li>
<li>
<a href="/products/studio">Foo Studio</a>
</li>
</ul>
</li>
</ul>
<?= $this->navigation()
->menu()
->setOnlyActiveBranch(true)
->setRenderParents(false)
->setMaxDepth(1) ?>
Output:
<ul class="navigation">
<li class="active">
<a href="/products/server">Foo Server</a>
</li>
<li>
<a href="/products/studio">Foo Studio</a>
</li>
</ul>
This example shows how to render a custom menu using a partial view script. By
calling setPartial()
, you can specify a partial view script that will be used
when calling render()
; when a partial is specified, that method will proxy to
the renderPartial()
method.
The renderPartial()
method will assign the container to the view with the key
container
.
In a layout:
$this->navigation()->menu()->setPartial('my-module/partials/menu');
echo $this->navigation()->menu()->render();
In module/MyModule/view/my-module/partials/menu.phtml
:
foreach ($this->container as $page) {
echo $this->navigation()->menu()->htmlify($page) . PHP_EOL;
}
Output:
<a title="Go Home" href="/">Home</a>
<a href="/products">Products</a>
<a title="About us" href="/company/about">Company</a>
<a href="/community">Community</a>
Starting with version 2.6.0, you can assign custom variables to a partial script.
In a layout:
// Set partial
$this->navigation()->menu()->setPartial('my-module/partials/menu');
// Output menu
echo $this->navigation()->menu()->renderPartialWithParams(
[
'headline' => 'Links',
]
);
In module/MyModule/view/my-module/partials/menu.phtml
:
<h1><?= $headline ?></h1>
<?php
foreach ($this->container as $page) {
echo $this->navigation()->menu()->htmlify($page) . PHP_EOL;
}
?>
Output:
<h1>Links</h1>
<a title="Go Home" href="/">Home</a>
<a href="/products">Products</a>
<a title="About us" href="/company/about">Company</a>
<a href="/community">Community</a>
In a layout:
// Set options
$this->navigation()->menu()
->setUlClass('my-nav')
->setPartial('my-module/partials/menu');
// Output menu
echo $this->navigation()->menu()->render();
In module/MyModule/view/my-module/partials/menu.phtml
:
<div class"<?= $this->navigation()->menu()->getUlClass() ?>">
<?php
foreach ($this->container as $page) {
echo $this->navigation()->menu()->htmlify($page) . PHP_EOL;
}
?>
</div>
Output:
<div class="my-nav">
<a title="Go Home" href="/">Home</a>
<a href="/products">Products</a>
<a title="About us" href="/company/about">Company</a>
<a href="/community">Community</a>
</div>
If you want to use a Permission within your partial view script, then you will have to check the access to a page manually.
In module/MyModule/view/my-module/partials/menu.phtml
:
foreach ($this->container as $page) {
if ($this->navigation()->accept($page)) {
echo $this->navigation()->menu()->htmlify($page) . PHP_EOL;
}
}
By default, laminas-view uses UTF-8 as its default encoding. If you want to use another encoding with
Sitemap
, you will have do three things:
- Create a custom renderer and implement a
getEncoding()
method.- Create a custom rendering strategy that will return an instance of your custom renderer.
- Attach the custom strategy in the
ViewEvent
.See the example from the HeadStyle documentation to see how you can achieve this.
This package is licensed using the MIT License.
Please have a look at LICENSE.md
.