====== Untermenü mit Hauptpunkt als Überschrift, aber ohne Bindestriche ======

Eine mehrstufige Navigation ist praktisch: Horizontales Menü mit den Hauptpunkten und Unterpunkte in der Sidebar links oder rechts, so wird das häufig umgesetzt (auf dieser Seite ja auch).

Aber nicht immer erschließt sich die Zugehörigkeit eines Sidebar-Menüs zum übergeordneten Menüpunkt, auch wenn man das visuell hervorheben kann (s. [[i18n-css-aktive-unterpunkte/|der Tipp hierzu]] und schauen Sie mal oben im Menü auf den Menüpunkt Anwendung).

Um das Ganze mit ein wenig Cat-Content zu verdeutlichen:

Die Seitenstruktur wäre so aufgebaut:

- Meine Papageien - Meine Hunde - Meine Katzen

Die Unterseiten von - Meine Katzen:\\ - - Anna\\ - - Luise\\ - - Hans\\ - - Franz

Gibt man nun in der Sidebar die Unterseiten des aktiven Menüpunktes aus, dafür gibt es ja das wunderbare Plugin I18N:

<code>
<ul><?php get_i18n_navigation(return_page_slug(),1,99); ?>
</code>

dann bekommt man zwar die Liste der Katzenseiten als Untermenü in die Seitenliste, die inhaltliche Zuordnung zu dem Hauptpunkt "Meine Katzen" ist aber nicht unbedingt gegeben, das könnten ja auch Papageien oder Hunde sein. Also soll der zugehörige Hauptmenüpunkt als Überschrift über diesem Untermenü ausgegeben werden.

Das kann man leicht erledigen mit dem [[template-tags/|Template-Tag]]

<code>
<?php get_parent(); ?>
</code>

Die Sache hat nur einen unschönen Haken: Diese Anweisung gibt den Slug aus, der bei der [[linkgestaltung/|Linkgestaltung]] aus dem Seitentitel eine URL, also Seitenadresse bildet. Und wenn solch ein Seitentitel aus mehreren Worten besteht, wird aus dem Leerschritt zwischen den Worten ein Bindestrich. Das ist richtig, aber in diesem speziellen Fall stört es, denn:

die Überschrift über dem Untermenü in der Seitenleise soll ja nicht meine-katzen, sondern Meine Katzen lauten. **Martin** gab im Forum den entscheidenden Tipp:

den Template-Tag mit ein wenig PHP erweitern:

<code>
<h2 id="replace"><?php echo str_replace('-',' ',get_parent(false)); ?></h2>
</code>

und schon ist der Bindestrich verschwunden. Der letzte Schritt zur endgültigen Schönheit: mit CSS die Ausgabe gestalten, damit der Menüpunkt  mit Groß- und Kleinschreibung ausgegeben wird:

<code>
#replace {text-transform: capitalize;}
</code>