Es ist an der Zeit, unser Design tatsächlich in WordPress zu übertragen. Fangen wir am besten von oben nach unten an und beginnen mit dem Header. Abgesehen davon, dass es ein logischer Ausgangspunkt ist, bedeutet dies, dass wir uns Dinge wie den <head> ansehen und sicherstellen, dass die richtigen Ressourcen geladen werden.
Wir teilen unseren Bildschirm in zwei Hälften, das statische Mockup-Projekt ist links in Sublime Text 2 geöffnet und die WordPress-Seite rechts. So können wir Zeile für Zeile vergleichen und sicherstellen, dass wir alles korrekt übertragen.
Am Ende sieht die Seite immer noch chaotisch aus, aber das ist zu erwarten. Der korrekte Markup ist noch nicht vorhanden. Aber wir können sehen, dass wir auf dem richtigen Weg sind.
Kann jemand genauer erklären, wie die body_class() Funktion funktioniert?
Der Codex erklärt, dass sie eine Reihe von Klassen ausgibt, wie zum Beispiel:
class=”page page-id-2 page-template page-template-default logged-in”
Das scheint nicht zu den CSS-Regeln zu passen, die Chris zuvor geschrieben hat, wo er eine Body-Klasse wie .snippets oder .deals anvisiert hat, um sein Menüelement hervorzuheben.
Wie kann diese body_class() Funktion verwendet werden, um nur das Menüelement der aktuellen Seite hervorzuheben?
Ich sollte präzisieren, wie die body_class() Funktion verwendet werden kann, um nur das Menüelement der aktuellen Seite hervorzuheben, wenn man die Website nicht selbst kontrolliert. Was ist, wenn der Kunde eine neue Seite und ein neues Menüelement namens ... hinzufügt. Wie kann das automatisch hervorgehoben werden, wenn es aktiv ist, wenn es keine CSS dafür gibt?
Hallo Scott,
Versuch es im CSS-Tricks Forum – dort gibt es viele hilfsbereite Leute, die dir das erklären können.
@Scott, du musst eine Funktion in functions.php schreiben, um die richtige Klasse zum
body_classFilter hinzuzufügen. Das passiert nicht automatisch. Du brauchst nur eine einfache if-Anweisung, die bestimmt, ob die richtige Seite geladen wird, und dann die richtige Body-Klasse über diesen Filter hinzufügst.Hey Scott,
Du musst dich nicht auf die body class verlassen. Ich rufe Menüs so auf:
wp_nav_menu( array('container' => '', 'theme_location' => 'main' ) );Und verwende dann CSS, um das aktuelle Element anzusprechen.
.main-menu .current-menu-item{//some CSS}Ein Beispiel findest du auf Falls Village Marshmallow