So erstellen Sie ein dynamisches Menü in WordPress

WordPress ist ein Content-Management-System (CMS), mit dem Sie eine Website oder einen Blog von Grund auf neu erstellen oder eine vorhandene Website verbessern können. In diesem Artikel zeigen wir Ihnen, wie Sie ein dynamisches Menü in WordPress erstellen. Ein dynamisches Menü ist ein Menü, das sich entsprechend der angezeigten Seite ändert. Wenn Sie beispielsweise eine Seite über „WordPress-Themes“ anzeigen, zeigt das Menü Links zu anderen Seiten über WordPress-Themes. Wenn Sie eine Seite über „WordPress-Plugins“ anzeigen, zeigt das Menü Links zu anderen Seiten über WordPress-Plugins. Das Erstellen eines dynamischen Menüs in WordPress ist einfach. Zuerst müssen Sie ein Menü erstellen. Zweitens müssen Sie dem Menü Elemente hinzufügen. Drittens müssen Sie das Menü einem Ort zuweisen. Viertens müssen Sie den Code zu Ihrem WordPress-Theme hinzufügen. Beginnen wir mit dem ersten Schritt: dem Erstellen eines Menüs.

In Teil 2 dieser Serie gehen wir noch einen Schritt weiter und erstellen dynamische Navigationsmenüs. Sie lernen, wie Sie bedingte Menüs basierend auf ihrer Position in Block Visibility erstellen, indem Sie das Pro-Add-on verwenden. Ein Blockthema wird verwendet, um Vorlagenteile zu erstellen, die auf Blockprinzipien basieren. Dieses Tutorial führt Sie durch die Schritte, die zum Erstellen eines sekundären Navigationsmenüs auf der Seite „Wanderausflüge“ erforderlich sind. Es ist so einfach wie auf den Site-Editor zu klicken, um den Website-Header zu bearbeiten. Mithilfe der Standortsteuerung im Block Visibility-Plugin können wir auch die Position des sekundären Menüs einschränken. Wählen Sie in der Wissensdatenbank die Option Standort aus und klicken Sie dann auf das Auslassungssymbol, um sie zu aktivieren.

Wir können jetzt die Sichtbarkeit des Blocks auf die Seite „Wanderausflüge“ beschränken, indem wir die Standortsteuerung verwenden, die eine bessere Kontrolle über die Sichtbarkeit ermöglicht. Die Beitragsregel weist uns an, einen Seitenbeitragstyp sowie einen „Wander“-Seitentyp auszuwählen. Bei der resultierenden Regeleinstellung sollte Folgendes befolgt werden. Auf der Startseite unserer Demoseite können wir auf ein brandneues bedingtes Menü zugreifen. Der Rest dieses Artikels ist zu vervollständigen. Sie können dies erreichen, indem Sie eine Vielzahl von Regeln und Regelsätzen verwenden. Für diese Demo haben wir ein einfaches Beispiel gewählt.

Um ein neues Menü zu erstellen, gehen Sie zu Aussehen. Klicken Sie auf „Menü erstellen“, wenn Sie ein sekundäres Menü erstellen möchten, „Mein benutzerdefiniertes Menü“, wenn Sie ein benutzerdefiniertes Menü für einen bestimmten Standort erstellen möchten, und „Sekundäres Menü“, wenn Sie ein sekundäres Menü für einen anderen Standort erstellen möchten. Nachdem Sie dem Menü einige Elemente hinzugefügt haben, speichern Sie es (z. B. Menüelement 1, Menüelement 2 und Menüelement 3).

Wie erstelle ich ein dynamisches Menü in einem benutzerdefinierten WordPress-Design?

Eine Möglichkeit, ein dynamisches Menü in WordPress zu erstellen, ist die Verwendung der Funktion wp_nav_menu. Mit dieser Funktion können Sie ein Menü erstellen, das basierend auf der Struktur Ihrer Website automatisch generiert wird. Sie können diese Funktion auch verwenden, um ein benutzerdefiniertes Menü zu erstellen, das für Ihr Thema spezifisch ist.

Indem Sie diesen Schritten folgen, können Sie ein einfaches und dynamisches Navigationsmenü in WordPress erstellen. Der erste Schritt besteht darin, das Navigationsmenü mit der Funktion register_nav_menus() zu registrieren. Um dies auszuführen, musst du es zuerst in der Datei functions.php in deinem Child-Theme registrieren und dann den ‚init‘-Hook verwenden. In diesem Beispiel nutzen wir das primäre Kopfzeilenmenü. Das Nav Menu-Plugin ist auf WordPress.org verfügbar und ermöglicht es Ihnen, verschiedenen Benutzern basierend auf ihrer Rolle verschiedene Menüs zuzuweisen. Wir können dieses Plugin auch verwenden, um mehrere Menüs gleichzeitig zu registrieren. Im vorherigen Schritt können wir das Navigationsmenü basierend auf dem Design der Website gestalten, indem wir im Funktionsaufruf WP_nav_menu auf benutzerdefinierte CSS-Klassen verweisen.

So erstellen Sie ein dynamisches Kopfzeilenmenü in WordPress

Um ein dynamisches Kopfzeilenmenü in WordPress zu erstellen, müssen Sie zuerst ein benutzerdefiniertes Menü erstellen. Gehen Sie dazu zum Abschnitt Menüs im WordPress-Adminbereich und klicken Sie auf den Link Neues Menü erstellen. Geben Sie einen Namen für Ihr Menü ein und klicken Sie auf die Schaltfläche Menü erstellen. Als Nächstes müssen Sie Elemente zu Ihrem Menü hinzufügen. Klicken Sie dazu auf den Link Artikel hinzufügen und wählen Sie die Seiten oder Beiträge aus, die Sie Ihrem Menü hinzufügen möchten. Nachdem Sie alle gewünschten Elemente hinzugefügt haben, klicken Sie auf die Schaltfläche Menü speichern. Ihr dynamisches Kopfzeilenmenü ist jetzt einsatzbereit.

Wenn wir eine dynamische Menüseite mit der WordPress-Methode für dynamische Menüseiten erstellen, die später in diesem Tutorial beschrieben wird, können wir sie ändern. In der Hauptnavigation wird ein Hintergrundbild verwendet, um die Position des Menüpunkts anhand seiner ID zu ändern. Die Verwendung des „span“-Tags ermöglicht es uns, den Text auszublenden, um das Hintergrundbild so anzuzeigen, wie wir es sehen. Der Code, den wir verwenden werden, wird dynamisch von WordPress generiert, wobei eine spezielle Klasse namens current_page_ancestor verwendet wird, also sollte er so aussehen: Sonst wurde nichts gesagt. Wenn wir die Anzahl der Unterseiten erhöhen möchten, erhöhen oder verringern Sie einfach die Einstellung für Tiefe = 2, sodass eine unbegrenzte Anzahl von Seiten angezeigt wird. Mithilfe von CSS kann der aktuelle Seitenlink, wie im Bild unten gezeigt, jetzt sehr einfach in Fettschrift angezeigt werden. Navigieren Sie zur übergeordneten Seite mit einem hervorgehobenen Abschnitt. Markieren Sie die untergeordnete Seite des übergeordneten Elements.

WordPress Menüelemente dynamisch hinzufügen

Das Hinzufügen von Menüelementen zu WordPress-Menüs kann entweder über das WordPress-Admin-Dashboard oder durch Hinzufügen von Code zu Ihrem Design erfolgen. Wenn Sie einem bestehenden Menü einen Menüpunkt hinzufügen möchten, melden Sie sich einfach bei Ihrer WordPress-Site an und navigieren Sie zur Seite „Darstellung > Menüs“. Von dort aus können Sie neue Menüpunkte hinzufügen, indem Sie sie auf der linken Seite auswählen und auf die Schaltfläche „Zum Menü hinzufügen“ klicken. Wenn Sie Menüpunkte per Code hinzufügen möchten, müssen Sie der Datei functions.php Ihres Themes einige Codezeilen hinzufügen. Als erstes müssen Sie eine neue Funktion erstellen, die die Menüpunkte hinzufügt. Diese Funktion kann beliebig benannt werden, aber wir nennen sie „my_custom_menu_items()“. Innerhalb dieser Funktion müssen Sie den WordPress-Filter-Hook „wp_nav_menu_items“ verwenden. Mit diesem Hook können Sie einem bestehenden Menü neue Elemente hinzufügen. Der Code in Ihrer Funktion sieht in etwa so aus: function my_custom_menu_items( $items, $args ) { // Etwas mit $items tun return $items; } add_filter( 'wp_nav_menu_items', 'my_custom_menu_items', 10, 2 ); Der obige Code fügt eine neue Funktion hinzu, die verwendet werden kann, um Elemente zu einem vorhandenen Menü hinzuzufügen. Die Funktion selbst macht noch nichts, aber sie stellt einen Rahmen bereit, den Sie verwenden können, um Ihre eigenen benutzerdefinierten Menüelemente hinzuzufügen. Um Menüpunkte tatsächlich hinzuzufügen, müssen Sie den Code innerhalb der Funktion an Ihre Bedürfnisse anpassen. Wenn Sie beispielsweise einen Link zu Ihrer „Über“-Seite hinzufügen möchten, würden Sie den folgenden Code verwenden: function my_custom_menu_items( $items, $args ) { $items .= 'Info'; gib $items zurück; } add_filter( 'wp_nav_menu_items', 'my_custom_menu_items', 10, 2 ); Der obige Code fügt Ihrem Menü einen neuen Link mit dem Text „Über“ hinzu. Sie können beliebig viele Menüelemente hinzufügen, indem Sie zusätzliche Codezeilen innerhalb der Funktion hinzufügen.

WordPress-Plugin für dynamische Menüs

Ein WordPress- Plugin für dynamische Menüs ist eine großartige Möglichkeit, der Navigation Ihrer Website ein wenig Würze zu verleihen. Indem Sie es Ihnen ermöglichen, Menüs zu erstellen, die sich je nach dem, was Ihre Besucher ansehen, ändern, können Sie sie beschäftigen und für mehr zurückkommen.

So erstellen Sie ein benutzerdefiniertes Menü in WordPress

Um ein benutzerdefiniertes Menü in WordPress zu erstellen, müssen Sie im Dashboard zum Abschnitt „Darstellung“ navigieren und die Option „Menüs“ auswählen. Von dort aus können Sie ein neues Menü erstellen und beliebige Seiten, Kategorien oder benutzerdefinierte Links hinzufügen. Nachdem Sie Ihre Änderungen gespeichert haben, können Sie Ihr neu erstelltes Menü über den Reiter „Standorte verwalten“ einem Ort auf Ihrer Website zuweisen.

Vegibit vermittelt Ihnen ein Verständnis dafür, wie Sie ein WordPress-Theme erstellen. Das Menü befindet sich unter dem Site-Namen und dem Slogan-Bereich, aber es befindet sich weiter oben im Site-Inhalt. Damit das Menü erscheint, müssen wir zuerst den Speicherort in der Datei functions.php des Themes registrieren. Erstellen Sie unser benutzerdefiniertes Menü im WordPress Dashboard. Nun ist es notwendig, unser neues Menü beim WordPress-Core zu registrieren. Mit dieser Funktion können wir jetzt den Standort des Dashboards verwalten. Wir möchten, dass es so aussieht, als käme es direkt von der Funktion WordPress_nav_menu().

Im nächsten Schritt verlinken wir auf die gesamte Kategorieliste. Sie können möglicherweise einen Hover-Effekt erzielen, wenn Sie mit der Maus über jeden Link fahren. Um ein Gefühl dafür zu bekommen, wie das funktionieren wird, haben wir eine style.css-Datei erstellt. Wir möchten die Unterstreichung für Links und die Aufzählungszeichen von jedem Element in unserer Liste entfernen sowie die Auffüllung und den Rand von jedem Element entfernen. In der WordPress-Zusammenfassung finden Sie eine Schritt-für-Schritt-Anleitung zum Erstellen eines benutzerdefinierten Menüs. Dies ist eine hervorragende Erklärung, wie man ein benutzerdefiniertes Menü in einem WordPress-Theme verwendet. Unsere Aufgabe wurde dank einiger WordPress-Funktionen erleichtert. Sobald das neue Menü mit WordPress verknüpft war, war es einfach, jede Art von Inhalt, den wir wollten, zu diesem Menü hinzuzufügen oder zu entfernen.

Erstellen eines benutzerdefinierten Menüs in WordPress

Nachdem Sie Ihr Menü erstellt haben, gehen Sie zu Aussehen. Sie können das neue Menü auf der Menüseite sehen. Sobald Sie es ausgewählt haben, können Sie es nach Belieben anpassen.