Unterseiten in der Seiten-Hierarchie ohne PlugIn ein-/ausblenden - Guru 2.0
Unterseiten in der Seiten-Hierarchie ohne PlugIn ein-/ausblenden

Unterseiten in der Seiten-Hierarchie ohne PlugIn ein-/ausblenden

Da ich bei einem aktuellen Projekt, WordPress als ein einfaches CMS einsetze, bin ich auf folgendes Problem gestoßen:

  1. In der Seitenleiste sollen alle Seiten der obersten Ebene angezeigt werden.
  2. Manche Seiten dürfen absolut nicht in der Seitenleiste aufscheinen.
  3. Die Unterseiten sollen nur sichtbar sein, sobald eine Elternseite angezeigt wird.
  4. Eine ausgewählte Seite soll im Menü hervorgehoben werden.

Irgendwie wollte ich diese Anforderungen nicht mit einem PlugIn lösen. Klar ist mir bekannt, dass es so viel einfacher geht, klick-i-di-klick und schon ist das PlugIn drauf. Noch kurz ein wenig in den Einstellungen herumgefummelt und schon sieht es so aus wie man es sich vorstellt. Aber gleichzeitg wird die ganze WebSite auch langsamer. Irgendwie muss es doch auch anders gehen, oder?

Klar, geht das! Kümmern wir uns um die einzelnen Punkte.

1. In der Seitenleiste sollen alle Seiten der obersten Ebene angezeigt werden

Nur die Elternseiten anzeigen

Nur die Elternseiten anzeigen

Dazu brauchen wir in der entsprechenden Datei (in diesem Theme sidebar.php) nur alles rauswerfen und folgenden Code einfügen. Wir verwenden einfach den Befehl wp_list_pages() von WordPress und ergänzen in um ein paar Parameter. Mit title_li= unterdrücken wir die Ausgabe eines Titels für das Widget. Der Parameter depth=0 gibt nur Seiten der ersten Hierarchie-Ebene aus. Und mit dem Parameter sort_column=menu_order können wir einstellen, dass die im Dashboard vergebene Sortierung verwendet wird, sonst gibt WordPress die Seiten alphabetisch sortiert aus.

2. Manche Seiten dürfen absolut nicht in der Seitenleiste aufscheinen

Die ID einer Seite im DashBoard finden

Die ID einer Seite im DashBoard finden

Dies ist relativ einfach, denn wir haben eigentlich schon alles nötige in unserem Code stehen. Wir benötigen nur mehr die IDs der einzelnen Seiten welche nicht angezeigt werden sollen. Dazu gehst Du einfach in Dein DashBoard und rufst die Liste der Seiten auf. Sobald Du über den Link Bearbeiten der jeweiligen Seite mit der Maus fährst, siehst Du in der Statuszeile Deines Browser die ID. Sie steht direkt hinter dem Parameter post=. Am Besten schreibst Du dir sie auf, denn jetzt müssen wir den Befehl wp_list_pages() um den Parameter exclude ergänzen, wie es hier geziegt ist. Hinter dem Gleichheits-Zeichen fügst Du einfach alle auszublendenden ID-Nummer der Seiten, mit Kommas getrennt an.

3. Die Unterseiten sollen nur sichtbar sein, sobald eine Elternseite angezeigt wird

Liste der Seiten mit Unterseiten

Liste der Seiten mit Unterseiten

Dafür brauchen wir nicht einmal programmieren. Denn das ganze lässt sich mit ein paar CSS-Eigenschaften schön lösen. Du brauchst dazu die Datei style.css und ergänzt Sie um die folgenden Zeilen. Denn WordPress ist so nett, die jeweiligen Elemente in der Liste der Seiten bereits mit den passenden Klassen zu versehen. Daher brauchen wir sie nur mehr ein- bzw. ausblenden. Und das erledigen wir mit dem Attribut display.

4. Eine ausgewählte Seite soll im Menü hervorgehoben werden

Jetzt fehlt nur mehr das Hervorheben der aktiven Seite. Auch hier arbeiten wir mit der Datei style.css. Wir ergänzen Sie einfach um eine Klasse welche WordPress für die aktuelle Seite vergibt und versehen diese mit den für unser Theme passenden Attribute. Vergiss nicht, dass es sich hierbei um a-Elemente handelt, welche Du natürlich auch formatieren musst.

Damit haben wir diese Anforderung mit ein paar Zeilen css und Hausmitteln von WordPress erledigt! Und dafür brauchten wir keine großartigen PlugIns, JavaScript-Frameworks oder sonst etwas, einfach nur ein wenig nachdenken hat uns schon gereicht.

Es wurden 2 Kommentare zu diesem Beitrag geschrieben.

Blogheim.at Logo
Diese Website verwendet Cookies - nähere Informationen dazu finden Sie in unserer „Datenschutzerklärung“. Klicken Sie auf „Ich stimme zu“, um Cookies zu akzeptieren und unsere Webseite zu besuchen, oder klicken Sie auf „Cookie-Einstellungen“, um Ihre Cookies selbst zu verwalten.