Benutzer-Werkzeuge

Webseiten-Werkzeuge


modx:bootstrapmenu1

Bootstrap Menü mit Headlines

Anmerkung: Leider kann es sein, dass die Templates bei Wayfinder manchmal nicht korrekt geladen werden. Dann bitte alle Aufrufe, die geladen werden mal eben aus dem Wayfinder-Call rausnehmen; Chunk speichern; im Debug-Modus testen - wenn der Chunk des Untertemplates dann richtig geladen wird - die zuerst geladenen Chunkaufrufe wieder reinnehmen; jetzt sollten alle geladen werden.

Website der Straßenbahnfreunde Hemer

Wayfinder Call

Ein ganz einfacher Wayfinder-Call. Bei der Benennung der Templates habe ich mich an das originale Wayfinder-Schema gehalten.

[[Wayfinder?
 &startId=`0`
 &level=`2`
 &rowTpl=`rowTpl`
 &outerTpl=`outerTpl`
 &innerTpl=`innerTpl`
 &innerRowTpl=`innerRowTpl`
 &innerHereTpl=`innerHereTpl` 
]]

rowTpl

Da es auf der Seite 6 Bereiche gibt, passt die Bootstrap-Rasteraufteilung mit 6 Spalten zufällig ganz gut. Dies nach eigenem Belieben anpassen.

<article class="col-md-2">
<h4 class="[[+wf.classnames]]"><a href="[[+wf.link]]">[[+wf.linktext]]</a></h4>
[[+wf.wrapper]]
</article>

Die obersten Ebenen werden mit h4 abgebildet - der wf.wrapper Aufruf lädt die Submenüs der Ebene 2.

outerTpl

In der OuterTpl steht nur ein Call - der zum Laden des Menüs. Die Anlage dieses Elements ist notwendig, um das Laden einer umklammernden ul zu verhindern.

[[+wf.wrapper]]

innerTpl

Nur eine kleine Ergänzung einer eigenen Klasse.

<ul class="ft-menu [[+wf.classnames]]">[[+wf.wrapper]]</ul>

innerrowTpl

<li[[+wf.classes]]><a href="[[+wf.link]]" title="[[+wf.title]]">[[+wf.linktext]]</a>[[+wf.wrapper]]</li>

innerhereTpl

Die innerhereTPL habe ich später noch ergänzt. In dieser gibt es noch ein vorgestelltes Sonderzeichen für das aktive Element.

<li[[+wf.classes]]><a href="[[+wf.link]]" title="[[+wf.title]]">[[+wf.linktext]]</a>[[+wf.wrapper]]</li>
modx/bootstrapmenu1.txt · Zuletzt geändert: 2016-05-01 14:57 von t.schuermann