Manchmal finden Sie vielleicht ein tolles Theme und stellen fest, dass es toll wäre, wenn es ein zusätzliches Navigationsmenü mit wichtigen oder häufig verwendeten Links hätte, um die Benutzerfreundlichkeit Ihrer WordPress-Site zu erhöhen.
Mit nur ein bisschen Code können Sie die Grundlage für Ihr neues Menü schnell einrichten und es so gestalten, dass es zu Ihrem Theme passt.
Wenn Sie sich nicht mit Code herumschlagen möchten, gibt es viele Plugins, die Ihnen die schwere Arbeit abnehmen und auch Styling-Optionen bieten.
Für welche Option Sie sich auch entscheiden, die folgende Anleitung hilft Ihnen bei der Umsetzung.
Basic Housekeeping
Um ein neues Menü zu erstellen, müssen Sie Ihre Theme-Dateien bearbeiten. Bevor Sie Änderungen an Ihren Kerndateien vornehmen, sollten Sie eine Sicherungskopie Ihrer gesamten Website erstellen, für den Fall, dass dabei etwas schief geht. So können Sie Ihre Website schnell wiederherstellen, als wäre nie etwas passiert.
Sie können Ihre Website manuell per FTP oder mit einem Plugin, wie z. B. unserem Snapshot, sichern. Achten Sie nur darauf, dass Sie eine Kopie Ihrer Datenbank und Ihrer Dateien an einem von Ihrer Website getrennten Ort speichern, um das Risiko eines Verlusts Ihres Backups zu minimieren.
Konstruieren eines Child-Themes
Um neue Menüs mit Code zu erstellen, müssen Sie Änderungen vornehmen, die bei einem Update Ihres Themes verloren gehen würden. Das Erstellen eines Child-Themes löst dieses Problem.
Die Details, die Sie zum Erstellen eines Child-Themes benötigen, finden Sie in unseren anderen Beiträgen How to Create a WordPress Child Theme und How to Automagically Create Child Themes in WordPress.
Sie können auch ein ganz neues eigenes Theme erstellen oder es auf einer lokalen oder Testseite ausprobieren.
In diesen Beiträgen finden Sie weitere Details zur Erstellung einer lokalen Installation von WordPress:
- Wie man WordPress lokal mit MAMP entwickelt
- Wie man XAMPP und WordPress lokal auf PC/Windows installiert
- Wie man WordPress lokal in 5 Minuten mit DesktopServer einrichtet
- Der schnelle und einfache Leitfaden für die Migration einer lokalen WordPress-Installation auf eine Live-Site
- Wie man WordPress für die lokale Entwicklung mit XAMPP verschiebt
Sobald Sie eine dieser Optionen eingerichtet haben, können Sie damit beginnen, Ihre zusätzlichen Navigationsmenüs zu erstellen. Wenn Sie sich jedoch für ein Plugin oder ein Theme-Framework entscheiden, müssen Sie kein Child-Theme erstellen.
Erstellen neuer Menüs
Um in Ihrem Admin-Dashboard unter Darstellung > Menüs eine auswählbare Menüoption hinzuzufügen, müssen Sie etwas tun, was „ein Menü registrieren“ genannt wird. Dazu müssen Sie lediglich einen Codeschnipsel in die Datei functions.php einfügen, die sich in wp-content > themes > your-theme.
Klicken Sie im cPanel auf das Dateimanager-Symbol im Abschnitt Dateien auf der Startseite. Wenn Sie den Dateimanager nicht so eingestellt haben, dass er in das Stammverzeichnis Ihrer Website lädt, navigieren Sie jetzt dorthin.
In Ihrem Ordner /wp-includes/ gibt es eine Datei functions.php, die Sie aber nicht bearbeiten müssen. Vergewissern Sie sich, dass Sie die Datei functions.php finden, die in dem von Ihnen verwendeten Thema enthalten ist. Andernfalls würden Sie Fehler erhalten, wenn Sie versuchen, den gefundenen Code später hinzuzufügen.
Suchen Sie Ihre functions.php-Datei und klicken Sie einmal darauf, gefolgt von einem Klick auf die Schaltfläche „Bearbeiten“ oben auf der Seite.
Wenn sich ein Pop-up öffnet, klicken Sie einfach auf die Schaltfläche „Bearbeiten“ unten rechts. Möglicherweise wird es nicht angezeigt, wenn Sie es zuvor deaktiviert haben.
Scrollen Sie zum Ende der Datei. Wenn Sie nur ein Menü hinzufügen möchten, fügen Sie den folgenden Code in eine neue Zeile ein:
function register_my_menu() {register_nav_menu('new-menu',__( 'New Menu' ));}add_action( 'init', 'register_my_menu' );
In diesem Beispiel ist New Menu der Name, der auf der Menüseite Ihres Admin-Dashboards erscheinen wird, um es für das menschliche Auge verständlich zu machen. Der new-menu-Name ist das, was WordPress versteht, um Ihren Code korrekt auszuführen.
Sie können Ihr Menü nennen, wie Sie wollen, aber stellen Sie sicher, dass nur der für Menschen lesbare Name Leerzeichen und Großbuchstaben enthält.
Wenn Sie Ihrer Website mehrere Menüs hinzufügen möchten, fügen Sie stattdessen diesen Code in eine neue Zeile ein:
Sie können mit dieser Methode so viele neue Menüs hinzufügen, wie Sie möchten. Für die Benennung der Menüs gelten dieselben Regeln:
Speichern Sie die Änderungen, die Sie an der Datei vorgenommen haben. Jetzt müssen Sie nur noch das neue Menü zu Ihrer Website hinzufügen.
Hinzufügen von Menüpositionen zu Ihrem Thema
Hier müssen Sie entscheiden, wo Sie Ihr Menü platzieren möchten. Wenn Sie möchten, dass Ihr Menü oben auf der Seite erscheint, müssen Sie die Datei header.php bearbeiten. Sie können es auch in der Fußzeile platzieren, was bedeutet, dass Sie die Datei footer.php bearbeiten müssen.
Sie können sogar ein Menü auf einer Seite anzeigen, indem Sie die Vorlagendatei bearbeiten, oder in einer Seitenleiste, indem Sie die Datei sidebar.php bearbeiten.
Sie können Ihr neues Menü platzieren, wo immer Sie möchten. Hier ist das Minimum an Code, den Sie an einer dieser Stellen hinzufügen müssen:
<?php wp_nav_menu( array( 'theme_location' => 'new-menu' ) ); ?>
Ersetzen Sie einfach new-menu durch den von Ihnen gewählten, für WordPress lesbaren Namen. Wahrscheinlich möchten Sie Ihr Menü mit CSS gestalten, damit es über die Grundfunktionen hinausgeht und auch gut aussieht. Dazu müssen Sie eine Klasse erstellen und sie mit dem folgenden Code zu Ihrem Thema hinzufügen.
<?php wp_nav_menu( array( 'theme_location' => 'new-menu', 'container_class' => 'new_menu_class' ) ); ?>
Ersetzen Sie wie zuvor new-menu durch den von Ihnen gewählten Namen. In diesem Beispiel habe ich die Klasse, die ich erstellt habe, new_menu_class genannt. Sie können dies ändern, aber stellen Sie sicher, dass Sie diesen Code aktualisieren, um die Anpassung wiederzugeben.
Klicken Sie auf die Schaltfläche „Speichern“ und gehen Sie zu „Erscheinungsbild > Menüs“ in Ihrem Dashboard. Sie werden feststellen, dass Ihre neuen Menüs unter Themenstandorte im Abschnitt Menüeinstellungen aufgelistet werden.
Sie werden nun in der Lage sein, Ihre neuen Menüstandorte aufgelistet zu sehen. Wenn Sie ein Menü hinzufügen, können Sie einen oder alle Standorte auswählen.
Um Links in Ihren neu erstellten Menüstandorten anzeigen zu lassen, klicken Sie oben auf der Seite auf „Neues Menü erstellen“.
Wenn Sie noch kein Menü haben, können Sie einen Namen für Ihr Menü in das Feld auf der Seite eingeben und dann auf Menü erstellen klicken. Wenn Sie bereits ein Menü erstellt haben, können Sie oben auf der Seite auf den Link „Neues Menü erstellen“ klicken.
Sobald Sie ein neues Menü erstellt haben, können Sie auf der Registerkarte „Standorte verwalten“ auch die Standorte verwalten, an denen sie angezeigt werden.
Styling, Plugins und responsive Menüs
Ihr neues Menü kann nun mit CSS gestaltet werden. Die erforderliche Codierung ist spezifisch für das von Ihnen verwendete Theme, daher werde ich in diesem Beitrag nicht näher darauf eingehen, aber wir haben einen anderen Beitrag mit dem Titel How to Create an Awesome Responsive Menu for Your WordPress Theme, den Sie sich ansehen können. Darin wird auch gezeigt, wie man responsive Menüs erstellt, die für Mobilgeräte geeignet sind.
Wenn du eine einfachere Option möchtest, gibt es viele Plugins, die responsive Menüs auf der Grundlage der Stile deines Themes erstellen können. Eines der besten, die ich gefunden habe, ist Responsive Menu.
Einige bemerkenswerte Erwähnungen, die Sie vielleicht auch hilfreich finden, sind ShiftNav, WP Responsive Menu und Max Mega Menu.
Ressourcen für weitere Schritte
Sie haben jetzt die solide Grundlage, die Sie benötigen, um zusätzliche Menüs für Ihr Thema zu erstellen, und Ressourcen, die Ihnen helfen, weiter zu gehen. Egal, ob Sie es selbst programmieren, ein Plugin oder ein Theme-Framework verwenden, Sie haben jetzt ein neues Menü auf Ihrer WordPress-Site.
Wenn Sie auf Probleme stoßen, fragen Sie einfach unsere Support-Helden. Sie können Ihnen fachkundigen Rat und Unterstützung geben, um so gut wie jedes Problem zu lösen. Du kannst ein Ticket in unserem Support-Forum eröffnen und wir werden dir sofort helfen.
Für weitere Informationen darüber, wie du dein neues Theme gestalten kannst, gibt es viele Ressourcen, die du dir ansehen kannst. Du findest sie alle in unserem Beitrag A Mega Guide to Learning and Referencing CSS for WordPress: 150+ Resources.
Sie können auch einige unserer anderen Beiträge 10 Simple Tips for Learning CSS for WordPress, 25 Expert Tips for Cleaner CSS Coding for WordPress, 25 Pro Tips for Improving Your CSS Workflow und 5 Free CSS Plugins for Live Editing Your WordPress Site für weitere Details zur Codierung von CSS für Ihr Theme ansehen.
Tags:
- Menüs
- Navigation