CMS Made Simple erklärt in deutscher Sprache

Top einfache Navigation + links Subnavigation + 1 Spalte

Mit dem Menü-Manager können Sie die Navigation einfach in zwei Teile aufteilen. Auf dieser Seite wird die oberste Ebene in der Seitenhierarchie horizontal angezeigt, und je nachdem, welche Seite angezeigt wird, wird ein lokalisiertes Untermenü vertikal auf der linken Seite angezeigt. In diesem Fall zeigt das Untermenü auf der linken Seite die Unterebenen (Kinder) von "Standardvorlagen erklärt" an.

Der {menu}-Tag

Der {menu}-Tag wird zweimal in die Seitenvorlage eingefügt. Zuerst an der Stelle, an der sich die Hauptnavigation befindet, die nur die oberste Ebene anzeigen soll. Er sieht so aus: {menu template='Einfache Navigation' number_of_levels='1'}.

Die Unternavigation sollte nur die zweite Ebene und darunter enthalten, je nachdem, was auf der ersten Ebene ausgewählt wurde. Außerdem sollten die Links der dritten Ebene nur angezeigt werden, wenn die übergeordnete Ebene auf der zweiten Ebene angeklickt wird, andernfalls werden sie ausgeblendet. Das heißt, die zweite Ebene wird ausgeblendet, wenn die aktuelle Seite keine Unterseiten hat.

Der Tag für die Unternavigation sieht wie folgt aus: {menu template='simple_navigation.tpl' start_level='2' collapse='1'}.

Angehängte Stylesheets für das Menü

Da die Haupt- und die Unternavigation unterschiedlich gestaltet werden müssen (eine horizontal, die andere vertikal), sind dieser Seitenvorlage zwei Navigationsvorlagen beigefügt. Navigation Simple - Horizontal ist für die Gestaltung des horizontalen Hauptmenüs. Navigation Simple - Vertical hingegen enthält die Formatvorlage für die Unternavigation auf der linken Seite.

Beide verwenden die gleiche Menümanager-Vorlage

Wie Sie jedoch sehen können, verwenden beide Teile der Navigation dieselbe Menümanager-Vorlage. Das liegt daran, dass der Ausgabecode derselbe ist. Nur durch CSS werden die beiden Teile unterschiedlich gestylt.

Verschieben der Seitenleiste nach rechts

Sie können die Seitenleiste mit der Subnavigation ganz einfach nach rechts verschieben. Suchen Sie in der Stilvorlage Layout Top-Menü + 2 Spalten nach der Eigenschaft float:left; im Element div#sidebar. Ändern Sie diese in float:right; und die Seitenleiste mit dem Menü wird stattdessen auf der rechten Seite des Inhalts sein, natürlich müssen Sie auch die Ränder für die Seitenleiste und das div#main anpassen, im Grunde nur die linken und rechten Ränder vertauschen.

 

---