ProcessWire - Navigation Beispiele

Siehe auch

ProcessWire - Navigation Snippets
http://wiki.zone30.info/wikizone/index.php?title=Aligator_(ProcessWire)#Komplettes_Beispiel_1

MarkupSimpleNavigation Modul Navigation

Hinweis: Oft tun's auch kleine Navigationssnippets anstatt der Module.

Multilevel Navigation mit diversen Klassen

<?php namespace ProcessWire;

$prependHomepage = 0;
foreach($homepage->menus as $item) {
  if($item->id == 1) $prependHomepage = 1;
}
if($prependHomepage) {
	$pa = $homepage->and($homepage->children("menus.id=1")); 
}else $pa = $homepage->children("menus.id=1");
// additional MarkupSimpleNavigation Filter
$selector = 'menus.id=1'; // filter works only for first level because markup simple navigation renders children by itself. This is why we need extra selector

$outer_tpl = '<ul class=" ul-nav">||</ul>';
$inner_tpl = '<ul>||</ul>';
$list_tpl = '<li%s>||</li>';//%s is where classes form parent_class etc. goes
$item_tpl = '<a href="{url}" class="nav-link">{headline|title}</a>';
$item_current_tpl ='<a href="{url}" class="current nav-link">{headline|title}</a>';

$myMenu = $modules->get("MarkupSimpleNavigation"); // load the module
$options = array(
    'parent_class' => 'parent',	// goes in li classes
    'current_class' => 'current', // goes in li classes
    'has_children_class' => 'has_children', // goes in li classes
    'levels' => true,
    'levels_prefix' => 'l-',//goes in li classes
    'max_levels' => 4,
    'firstlast' => true,
    'collapsed' => false,
    'show_root' => false,
    'outer_tpl' => $outer_tpl, // usually the ul part
    'inner_tpl' => $inner_tpl, // usually inner ul tags
    'list_tpl' => $list_tpl,
    'list_field_class' => '',
    'item_tpl' => $item_tpl,
    'item_current_tpl' => $item_current_tpl,
    'xtemplates' => '',
    'selector' => $selector,
    'date_format' => 'd.m.Y',
    'code_formatting' => false,
    'debug' => false
);
$out = '
<nav>
'.$myMenu->render($options,null,$pa).'
</nav>
';
echo $out;

Sidebar Navigation für MaterializeCSS

Beispiel orig. aus prantner.de. Nutzt ein Selectfeld um im Backen zu bestimmen ob eine Seite aufgeführt wird.

<?php namespace ProcessWire;

$pages->get(1001)->my_selector = "template=projects";
$pa = $homepage->and($homepage->children("menus.id=1"));


$outer_tpl = '<ul id="slide-out" class="sidenav">||</ul>';
//if($configpage->nav_type->value == 1) $outer_tpl = '<ul id="slide-out" class="sidenav sidenav-fixed">||</ul>';
$sideMenu = $modules->get("MarkupSimpleNavigation"); // load the module
$options = array(
    'parent_class' => 'parent',
    'current_class' => 'current',
    'has_children_class' => 'has_children',
    'levels' => true,
    'levels_prefix' => 'l-',
    'max_levels' => 4,
    'firstlast' => true,
    'collapsed' => false,
    'show_root' => false,
    'selector' => '',
    'selector_field' => 'nav_selector',
    'outer_tpl' => $outer_tpl,
    'inner_tpl' => '<ul>||</ul>',
    'list_tpl' => '<li%s>||</li>',
    'list_field_class' => '',
    'item_tpl' => '<a href="{url}">{title}</a>',
    'item_current_tpl' => '<a class="cur" href="{url}">{title}</a>',
    'xtemplates' => '',
    'xitem_tpl' => '<a href="{url}">{title}</a>',
    'xitem_current_tpl' => '<span class="cur">{title}</span>',
    'date_format' => 'd.m.Y',
    'code_formatting' => false,
    'debug' => false
);
$out = $sideMenu->render($options,null,$pa);

$out .= '
<a href="#" data-target="slide-out" class="sidenav-trigger" style="margin-left:0;"><i class="material-icons">menu</i></a>';
echo $out;

Previous Next Navigation mit Auswahlfeld im Backend

Main Template

	<!-- footer -->
	<?php include("partials/nav/nav-page.inc"); ?>

nav-page.inc

<?php namespace ProcessWire;

/*
 * Page Prev Next Navigation
 */
$next = '';
$prev = '';
$navPageMarkup = '';
if($page->show_prev_next){
	if($page->next->id){
		$next = '
				<span class="page-title next table-cell">
					<a href="'.$page->next->url.'">
						'.$page->next->title.'
					</a>
				</span>

				<span class="nav-icon next table-cell">
					&nbsp;
					<a href="'.$page->next->url.'">
						<i class="fa fa-chevron-right" aria-hidden="true"></i>
					</a>
				</span>
			</span>
		';
	}

	if($page->prev->id){
		$prev = '
				<span class="nav-icon prev table-cell">
					<a href="'.$page->prev->url.'">
						<i class="fa fa-chevron-left" aria-hidden="true"></i>
					</a>
					&nbsp;
				</span>
				<span class="page-title prev table-cell">
					<a href="'.$page->prev->url.'">
						'.$page->prev->title.'
					</a>
				</span>
		';
	}

	$navPageMarkup = '
	<div class="section v2 nav-page hide-on-small-only">
		<div class="row container no-margin-bot">
			<div class="col s12 nav-page">
				<div class="page-nav-wrap table" style="">
					<div class="table-row">
						'.$prev.$next.'
					</div>
					<!--<div class="clearfix"></div>-->
				</div>
			</div>
		</div>
	</div>
	';
}
echo $navPageMarkup;

Megamenu

Ab 3.0.119 gibt es eine neue Funktion WireArray->slice mit der man geschickt mehrspaltige Ausgaben realisieren kann.

https://processwire.com/blog/posts/processwire-3.0.119-and-new-site-updates/#new-wirearray-slices-method

Beispiel:

$categories = $pages->get('/about/sites/categories/')->children();
foreach($categories->slices(3) as $items) {
  echo "<div class='uk-width-1-3'><ul>";
  echo $items->each("<li><a href='{url}'>{title}</a>");
  echo "</ul></div>";
}