So erstellen Sie benutzerdefinierte Menüstrukturen in WordPress

WordPress hat eine automatische eingebaute Navigationsstruktur, die Ihre Menüs für Sie erstellt. Es enthält Seiten und Kategorien. Es platziert sie in Ihrem Primärmenü, ohne dass Sie etwas anderes tun müssen, als die Seite oder einen Beitrag innerhalb der Kategorie zu erstellen. Das funktioniert großartig, wenn Sie nur wenige Seiten und Kategorien haben, aber nach einer Weile kann es anfangen, außer Kontrolle zu geraten. Nur weil es Ihre Navigation automatisch handhaben kann, heißt das nicht, dass Sie es zulassen sollten.

WordPress verwaltet Ihre Menüs automatisch ohne Ihr Zutun, aber wenn Sie Ihre Menüstruktur wirklich voll ausnutzen möchten, können Sie Ihre eigenen benutzerdefinierten Menüs erstellen. Benutzerdefinierte Menüs ermöglichen Ihnen die volle Kontrolle über Ihre Navigationsstruktur und können Ihrer Website ein saubereres und professionelleres Aussehen verleihen.

Art der Menüs

Es gibt verschiedene Arten von Menüs. Welche Menütypen Sie verwenden können, hängt von den Funktionen Ihres Themas ab. Beliebte Menütypen sind:

• Primäres Menü – dieses erscheint unter der Kopfzeile. Es sollte Ihre Hauptnavigation und Seiten enthalten, die Ihre Besucher basierend auf der Art Ihrer Website erwarten: Startseite, Info, Kontakt, Blog, Portfolio usw.
• Sekundäres Menü – dieses erscheint über der Kopfzeile. Dies sollte Links und Seiten beinhalten, die Sie Ihren Lesern an einer geeigneten Stelle, aber nicht unbedingt in Ihrer Hauptnavigationsstruktur zur Verfügung stellen möchten. Dies können Elemente wie Tutorials, ein Einkaufswagen usw. sein.
• Seitenleiste – Ihre benutzerdefinierten Menüs können mit dem benutzerdefinierten Menü-Widget in der Seitenleiste platziert werden. Sie können beliebig viele Widgets verwenden und beliebige Menüs darin platzieren.
• Fußzeile – Sie können ein Menü nur für Ihre Fußzeile erstellen. Dieses Menü enthält normalerweise weniger Informationen als Ihr Hauptmenü. Abhängig von den Anforderungen Ihrer Website enthält sie normalerweise Startseite, Info, Kontakt, Blog usw. Wenn Ihre Website Stellenausschreibungen, ein Partnerprogramm und Schwesterseiten enthält, können sie hier ebenfalls enthalten sein.
• Social-Links-Menü – Dies ist ein spezielles Menü, das in Themen wie Twenty Fifteen zu finden ist und Ihre Social-Media-Links in Ihrer Seitenleiste platziert. Wenn das Thema das soziale Netzwerk erkennt, wird es das richtige Symbol bereitstellen. Wenn nicht, werden die Namen als Text angezeigt (je nachdem, wie Sie den Link beschriftet haben).

Die primären und sekundären Menüs sind die beliebtesten unter den WordPress-Themen. Was darin enthalten ist, hängt wirklich vom Fokus Ihrer Website ab. Der primäre Fokus Ihrer Website sollte im primären Menü erscheinen. Es sollte für Ihre Besucher sinnvoll sein und das sein, was sie erwarten.

Wenn Sie beispielsweise ein Geschäft haben, sollte sich Ihr Einkaufswagen im Hauptmenü befinden. Wenn Sie eine Portfolio-Website haben, aber auch einige Dinge verkaufen, sollte Ihr Portfolio in Ihrem Primärmenü und der Einkaufswagen im Sekundärmenü sein. Überlegen Sie einfach, wo es logisch passt und platzieren Sie es entsprechend.

Erstellen Sie Ihre eigenen benutzerdefinierten Menüs

WordPress macht es einfach, Ihre eigenen benutzerdefinierten Menüs von Hand zu erstellen. Sie können Menüs vom Backend aus erstellen, anpassen und anwenden, und Sie können Ihre Menüs vom Frontend aus auswählen, um sie anzuzeigen und zu testen, bevor Sie live gehen.

Erstellen der Menüs aus dem Backend

Gehen Sie im Backend zu Appearance und wählen Sie Menus. Gehen Sie im Frontend zu Anpassen und wählen Sie Navigation.

Wählen Sie auf dem Menübildschirm „Neues Menü erstellen“, geben Sie dem Menü einen Namen und klicken Sie auf die Schaltfläche „Menü erstellen“.

Jetzt können Sie mit dem Hinzufügen der Navigationsstruktur beginnen. Auf der linken Seite befinden sich Felder für Seiten, benutzerdefinierte Links und Kategorien. Sie können all diese als Links in Ihrem benutzerdefinierten Menü verwenden. In der Mitte haben Sie einige Optionen. Sie können zulassen, dass alle neuen Seiten automatisch zur Menüstruktur hinzugefügt werden, oder dies deaktiviert lassen, wenn Sie mehr Kontrolle haben und die Seiten und Kategorien selbst auswählen möchten.

Seiten

Wählen Sie die Registerkarte Seiten im linken Fenster aus, falls sie noch nicht geöffnet ist. Um Seiten zum Menü hinzuzufügen, wählen Sie alle gewünschten Seiten aus und klicken Sie auf Zum Menü hinzufügen.

Wenn Sie sie anders anordnen möchten, ziehen Sie einfach den Menüpunkt, den Sie verschieben möchten, per Drag & Drop an seine neue Position. Sie können es sogar zu einem Unterpunkt eines anderen Menüpunkts machen, indem Sie ihn per Drag-and-Drop nach rechts unter den Punkt ziehen, dessen Unterpunkt er sein soll.

Sie können den Pfeil auf der rechten Seite auswählen, um das Element zu öffnen und Anpassungen vorzunehmen, z. B. das Ändern des Namens und des Speicherorts. Hier können Sie den Eintrag auch aus der Menüstruktur entfernen.

Benutzerdefinierte Links

Um benutzerdefinierte Links hinzuzufügen, öffnen Sie im linken Fenster benutzerdefinierte Links, fügen Sie die gewünschte URL hinzu und wählen Sie Zum Menü hinzufügen aus. Sie können jede Art von Link erstellen, die Sie möchten, und sie in Ihre Menüstruktur integrieren. Auf diese Weise erstellen Sie auch Links für das Menü "Soziale Links".

Sie können es dann per Drag & Drop an die gewünschte Stelle in der Menüstruktur ziehen.

Kategorien

Du wählst Kategorien aus und fügst sie hinzu, genauso wie du Seiten im linken Fenster auswählst und hinzufügst. Sie verhalten sich genauso wie Seiten und Links im Menü.

Speichern Sie Ihr Menü

Sobald Ihnen Ihre neue Menüstruktur gefällt, speichern Sie sie und können sie dann verwenden.

Standorte verwalten

Es gibt zwei Möglichkeiten, Ihr Menü vom Backend aus zu verwenden.

Menüeinstellungen

Auf dem Bildschirm, auf dem Sie das Menü erstellt haben, befindet sich unter Menüeinstellungen eine Gruppe von Kontrollkästchen. Sie können ein beliebiges Menü auswählen und dann auswählen, wo es verwendet werden soll. Sie können beliebig viele auswählen. Vergessen Sie nicht, es zu speichern.

Standorte verwalten

Wählen Sie die Registerkarte Standorte verwalten. Hier können Sie in den Dropdown-Feldern auswählen, welches Menü wo verwendet werden soll. Sie müssen nicht alle verwenden. Wenn Sie ausgewählt haben, welches Ihrer Menüs verwendet werden soll, klicken Sie einfach auf Speichern, und Sie haben gerade Ihre Menüstruktur aktualisiert.

Widget

WordPress hat auch ein benutzerdefiniertes Menü-Widget, das Sie per Drag & Drop in Ihre Seitenleisten ziehen können. Hier können Sie Ihr Menü auswählen.

Testen

Hier ist ein Blick auf mein Testmenü und mein Seitenleisten-Widget. Als nächstes müssen Sie jedes Element testen, um sicherzustellen, dass es reibungslos und intuitiv funktioniert. Vergiss diesen Schritt nicht. Es ist sehr wichtig, dass Sie Ihr Menü testen, um zu sehen, ob es so funktioniert, wie Sie es beabsichtigt haben. Offensichtlich sind dies keine Menütitel, die Sie auf Ihrer Website verwenden sollten.

Verwenden des Frontends für eine WYSIWYG-Ansicht

Um Ihre Menüstruktur vom Frontend aus zu ändern, gehen Sie zu Darstellung und wählen Sie Anpassen aus. Sobald Sie zum Frontend gelangen, wählen Sie Navigation. Hier können Sie Ihre Menüs auswählen. Der Vorteil dieser Ansicht ist, dass Sie die Änderungen unmittelbar vor dem Speichern sehen können. Auf diese Weise können Sie entscheiden, ob es Ihnen gefällt, bevor Sie sich festlegen. Leider lässt Sie dieses System sie nicht erstellen.

Passen Sie das Erscheinungsbild mit Themen wie Divi an

Einige Themen, wie z. B. Divi 2.4 von Elegant Theme, bieten Ihnen Tools, mit denen Sie das Erscheinungsbild Ihrer Menüs vom Frontend aus anpassen und deren Auswirkungen sofort sehen können. Auf diese Weise wissen Sie, was Ihre Besucher sehen werden, bevor Sie es speichern.

Hier ist ein Blick auf die Menüanpassungen von Divi. Sie können dieselben Anpassungen vornehmen, um das Erscheinungsbild für jeden Menüpunkt zu ändern.

Noch weiter anpassen – Plugins verwenden, um Ihre Menüs zu modifizieren

Es gibt viele Plugins für WordPress, die Ihnen helfen, Ihre benutzerdefinierten Menüs mit neuen Funktionen, Aussehen und Funktionalität zu modifizieren. Sie fügen viele CSS-Anpassungen hinzu, machen sie reaktionsschnell und sogar schneller. Hier ist ein Blick auf einige der beliebtesten Plugins.

Benutzerdefiniertes Menü-Assistenten-Widget

Dieses kostenlose Plugin fügt ein benutzerdefiniertes Menü-Widget hinzu, das Sie in Ihren Seitenleisten oder in Ihren Inhalten mithilfe von Shortcodes verwenden können. Es gibt Ihnen die volle Kontrolle über Ihre Menüparameter und lässt Sie bestimmte Teile Ihrer benutzerdefinierten Menüs verwenden. Es fügt auch einige benutzerdefinierte Klassen hinzu.

Sie können bestimmte Teile des Menüs oder das gesamte Menü anzeigen. Sie können die Ausgabe auch bedingt machen. Sie wird entsprechend der von Ihnen angegebenen Anzahl von Ebenen flach oder hierarchisch angezeigt. Sie können die Ausgabe auch mit HTML ändern.

Die Einstellungen für das Widget sind einfach zu bedienen. Sie wählen das Menü aus einem Dropdown-Feld und wählen Filter, Fallbacks, Ausgabe, Container, Klassen, Links und Alternativen aus (dies ist eine weitere Bedingungsebene). Es gibt Ihnen auch einen Shortcode, damit Sie Ihre Menüs in Ihre Inhalte einfügen können.

WeiterEnde Akkordeon-Menü

Mit diesem Plugin können Sie Menüs im Akkordeonstil mit vollständiger Kontrolle über Menüebenen, Farben, Animationen usw. erstellen, jedes mit seinen eigenen Einstellungen und Skins. Sie haben die Kontrolle über die Ebenen und Zustände von Schriftarten, Hintergründen, Farben, Bildern usw. Es beschleunigt das Menüsystem durch die Verwendung von Cache, bietet verschiedene Arten von Animationen, unbegrenzte Menüebenen und 30 Einstellungen.

Ich mag die Art und Weise, wie die Akkordeonmenüs funktionieren. Sie können sie erweitern, wenn Sie sie verwenden möchten, und sie dann ausblenden, um ein übersichtlicheres Layout zu erhalten, wenn Sie sie nicht auf dem Bildschirm sehen möchten. Das Plugin ist einfach zu bedienen und einzurichten. Sie erstellen Menüs genauso wie benutzerdefinierte Inhaltstypen. Sie können das Widget dann in Ihre Seitenleisten ziehen und das Menü innerhalb des Widgets auswählen.

Es gibt auch eine Pro-Edition, die drei Themen und Unterstützung hinzufügt. Die Preise beginnen bei $29.

Responsives Menü

Dieses kostenlose Plugin hat 70 Optionen, um anzupassen, wie Ihre Menüs aussehen, sich anfühlen und verhalten. Sie können die Titel, CSS, Aktionen, Größen, Animationen, Skripte und vieles mehr anpassen. Es funktioniert hervorragend für mobile Geräte und verfügt über Funktionen, um das Menü von einer Seite zu ziehen und die Position des Menüs festzulegen. Es minimiert sogar das CSS und JavaScript Ihres Menüs. Sie können auch benutzerdefiniertes HTML hinzufügen und Ihre Einstellungen importieren/exportieren.

Es gibt viele Anpassungen in den Einstellungen, aber sie sind alle einfach zu verstehen und anzupassen. Es gibt auch eine erweiterte Ebene von Einstellungen, aber Sie können sie ignorieren, wenn Sie möchten. Es enthält Shortcodes und Sie können sogar den PHP-Code zu Ihrem Thema hinzufügen, wenn Sie dies bevorzugen.

Andere Plugins zum Modifizieren von Menüs

Hier ist eine Liste anderer Plugins, die ich interessant fand. Sie fügen die Funktionen Ihrer Menüs hinzu oder ändern sie und lassen Sie sie auf verschiedene Weise steuern.

• WordPress-Mega-Menü
• CSS3-Mega-Dropdown-Menü
• WP-Responsive-Menü
• Font Awesome 4 Menüs
• Shortcodes in Menüs
• Schnelleres Erscheinungsbild – Menüs
• Speise- und Getränkekarte
• Einfache Einzelhandelsmenüs
• Reinigen Sie WordPress-Menüs
• Widget-Menüizer

Tipps zum Erstellen großartiger Menüstrukturen

• Verwenden Sie Ihre Menüs, um Ihre Navigationsstruktur zu organisieren.
• Verwenden Sie so wenige Ebenen, wie Sie auskommen können. Denken Sie in Begriffen von Primary und Secondary.
• Verwenden Sie Namen, die für Leser sinnvoll sind, ohne dass sie Ihren Code entziffern müssen.
• Verwenden Sie die KISS-Methode. Denken Sie daran – einfacher ist besser. Menüs sollten einfach zu bedienen und intuitiv sein.
• Überprüfen Sie die Menüstrukturen Ihrer Lieblingsseiten und sehen Sie, was Ihnen gefällt und was nicht. Dann mach deine besser.

Abschließende Gedanken

Das Hinzufügen Ihrer eigenen benutzerdefinierten Menüstruktur ist einfach und lässt Ihre WordPress-Site professioneller aussehen und sich professioneller anfühlen und verhindert, dass Ihre Struktur zufällig aussieht. Es dauert nur wenige Minuten, um Ihre ganz eigenen Menüs zu erstellen, und Sie können sie sehen und ausprobieren, bevor Sie live gehen. Ihre Besucher werden eine Menüstruktur zu schätzen wissen, mit der sie schneller und intuitiver auf Ihrer Website navigieren können.

Du bist dran! Haben Sie Ihre eigene benutzerdefinierte Menüstruktur erstellt? Haben Sie etwas hinzuzufügen? Verwenden Sie Plugins, um Ihre Menüs zu ändern? Erzählen Sie uns davon in den Kommentaren unten.