Möchten Sie ein vertikales Navigationsmenü in WordPress erstellen?
In WordPress können Navigationsmenüs horizontal oder vertikal angezeigt werden. Vertikale Menüs bieten eine Reihe von Vorteilen, beispielsweise passen sie besser in die Seitenleiste Ihrer Website und sind auf Mobilgeräten einfacher zu navigieren.
In diesem Artikel zeigen wir Ihnen, wie Sie in WordPress ein vertikales Navigationsmenü erstellen.
Was ist ein Navigationsmenü?
Ein Navigationsmenü ist eine Liste von Links, die auf wichtige Bereiche einer Website verweisen. Sie werden normalerweise als horizontale Leiste mit Links oben auf jeder Seite einer WordPress-Website angezeigt.
Navigationsmenüs geben Ihrer Website Struktur und helfen Besuchern, das Gesuchte zu finden. Sie können Links zu Ihren wichtigsten Seiten, Kategorien oder Themen, WordPress-Blogbeiträgen und sogar benutzerdefinierten Links, wie Ihrem Social-Media-Profil, hinzufügen.
Obwohl sie häufig horizontal oben auf einer Website platziert werden, haben vertikale Navigationsmenüs viele Verwendungsmöglichkeiten und Vorteile.
Schauen wir uns nun verschiedene Möglichkeiten zum Erstellen eines vertikalen Navigationsmenüs in WordPress an. Dies sind die Themen, die wir in diesem Artikel behandeln werden:
Wenn Sie Ihrer Website ein Navigationsmenü hinzufügen, wird es vertikal oder horizontal angezeigt. Dies hängt von Ihrem Thema sowie der von Ihnen gewählten Menüposition ab.
Die Anzahl der verfügbaren Menüpositionen hängt vom verwendeten Thema ab. An einigen dieser Orte wird das Menü möglicherweise vertikal angezeigt.
Um dies mit Ihrem Theme zu testen, müssen Sie zu navigieren Aussehen » Menüs. Hier können Sie experimentieren, um zu sehen, welche Standorte auf Ihrer Website verfügbar sind und wie diese angezeigt werden.
Beispielsweise bietet das Thema „Twenty Twenty-One“ keine vertikalen Positionen, während das Thema „Twenty Twenty“ eine solche mit dem Namen „Desktop Expanded Menu“ bietet.
Sie können einfach das Menü auswählen, das Sie vertikal anzeigen möchten, und dann das Kontrollkästchen „Erweitertes Desktop-Menü“ am unteren Bildschirmrand aktivieren. Danach sollten Sie unbedingt auf die Schaltfläche „Menü speichern“ klicken, um Ihre Einstellungen zu speichern.
So sieht es auf unserer Demo-Website aus.
Weitere Informationen zum Bearbeiten von Menüs und Menüpositionen finden Sie in unserem Anfängerleitfaden zum Hinzufügen eines Navigationsmenüs in WordPress.
Unabhängig davon, welches Theme Sie verwenden, können Sie mithilfe eines Widgets ganz einfach ein vertikales Navigationsmenü zur Seitenleiste hinzufügen.
Zunächst müssen Sie ein Navigationsmenü erstellen, das Sie anzeigen möchten, falls Sie dies noch nicht getan haben.
Dann müssen Sie zu navigieren Aussehen » Widgets. Klicken Sie von hier aus einfach auf die blaue Schaltfläche zum Einfügen des Blocks „+“ oben auf der Seite und ziehen Sie den Block „Navigationsmenü“ in die Seitenleiste.
Anschließend können Sie dem Widget einen Namen geben und aus dem Dropdown-Menü das anzuzeigende Menü auswählen.
So sieht das vertikale Seitenleistenmenü auf unserer Demo-Website aus.
Auf ähnliche Weise können Sie Beiträgen und Seiten ein vertikales Navigationsmenü hinzufügen.
Zuerst müssen Sie einen neuen Beitrag erstellen oder einen vorhandenen bearbeiten. Danach müssen Sie oben auf der Seite auf die blaue Schaltfläche „+“ zum Einfügen von Blöcken klicken und dann den Navigationsblock auf die Seite ziehen.
Als nächstes müssen Sie auswählen, welches Menü angezeigt werden soll. Klicken Sie einfach auf die Schaltfläche „Menü auswählen“ in der Symbolleiste und wählen Sie das gewünschte Menü aus.
Abschließend sollten Sie sich die Blockeinstellungen im linken Bereich ansehen. Dort finden Sie zwei Schaltflächen zur Menüorientierung. Sie müssen auf den Abwärtspfeil klicken, um das Menü vertikal auszurichten.
Mit dem neuen vollständigen Site-Editor können Sie Ihre WordPress-Themes mithilfe des Blockeditors anpassen. Es wurde in WordPress 5.9 veröffentlicht und ermöglicht es Ihnen, Ihren Vorlagen verschiedene Blöcke hinzuzufügen, um ein einzigartiges Design zu erstellen.
Allerdings befindet sich der vollständige Site-Editor noch in der Beta-Phase und ist auf bestimmte Themes beschränkt, die ihn unterstützen, wie zum Beispiel das Standard-Theme Twenty Twenty-Two. Weitere Informationen finden Sie in unserem Artikel über die besten WordPress-Themen für die vollständige Bearbeitung von Websites.
Um ein Navigationsmenü mit dem vollständigen Site-Editor hinzuzufügen, müssen Sie zu gehen Aussehen » Herausgeber aus Ihrem WordPress-Dashboard. Sobald Sie sich im Editor befinden, klicken Sie auf das Navigationsmenü, das oben in der Kopfzeile der Website angezeigt wird.
Als nächstes müssen Sie in der Symbolleiste auf die Schaltfläche „Navigation auswählen“ klicken.
Im rechten Bereich sehen Sie nun verschiedene Optionen zum Anpassen des Navigationsmenüs. Eine dieser Optionen besteht darin, ob das Menü in horizontaler oder vertikaler Ausrichtung angezeigt werden soll.
Klicken Sie einfach auf den Abwärtspfeil, um die vertikale Ausrichtung zu erhalten und ein vertikales Menü zu erstellen.
Weitere Informationen finden Sie in unserer Anleitung zum Hinzufügen eines Navigationsmenüs in WordPress.
SemillaProd ist der beste WordPress-Seitenersteller und benutzerdefinierte Theme-Builder-Plugin auf dem Markt. Damit können Sie problemlos überall auf Ihrer WordPress-Website vertikale Menüs erstellen.
Als erstes sollten Sie das installieren und aktivieren SemillaProd Stecker. Weitere Einzelheiten finden Sie in unserer Schritt-für-Schritt-Anleitung zur Installation eines WordPress-Plugins.
Notiz: Da ist ein kostenlose Version von SeedProd Dadurch können Sie einzelnen Seiten ein vertikales Navigationsmenü hinzufügen. Sie benötigen jedoch die Pro-Version, um auf den Theme Builder zuzugreifen und Ihren Theme-Vorlagen ein Menü hinzuzufügen.
Bei der Aktivierung müssen Sie Ihren Lizenzschlüssel eingeben. Sie finden diese Informationen in Ihrem Konto auf der SeedProd-Website.
Danach müssen Sie SeedProd verwenden, um ein benutzerdefiniertes WordPress-Theme zu erstellen.
Erstellen Sie ein benutzerdefiniertes WordPress-Theme
Sie finden den SeedProd-Theme-Builder, indem Sie zu navigieren SeedProd » Theme Builder Seite. Hier verwenden Sie eines der vorgefertigten Themes von SeedProd als Ausgangspunkt. Dadurch wird Ihr bestehendes WordPress-Theme durch ein neues, individuelles Design ersetzt.
Sie können dies tun, indem Sie auf die Schaltfläche „Themen“ klicken.
Ihnen wird eine Liste professionell gestalteter Themes für verschiedene Arten von Websites angezeigt. Es gibt beispielsweise Vorlagen mit den Namen „Modern Business“, „Marketing Agency“ und „Mortgage Broker Theme“.
Schauen Sie sich die Optionen an und wählen Sie diejenige aus, die Ihren Anforderungen am besten entspricht, indem Sie auf das Häkchensymbol klicken.
Sobald Sie ein Thema ausgewählt haben, generiert SeedProd alle benötigten Themenvorlagen. Wie Sie diese Vorlagen anpassen, erfahren Sie in unserem Leitfaden zum einfachen Erstellen eines benutzerdefinierten WordPress-Themes.
Fügen Sie Ihren Website-Vorlagen ein vertikales Navigationsmenü hinzu
Sie können SeedProd jetzt verwenden, um jeder Ihrer Designvorlagen ein vertikales Navigationsmenü hinzuzufügen. In diesem Tutorial fügen wir der Blog-Indexvorlage ein Menü hinzu.
Sie müssen mit der Maus über diese Vorlage fahren und dann auf den Link „Design bearbeiten“ klicken.
Dadurch wird der Drag-and-Drop-Seitenersteller von SeedProd geöffnet. Rechts sehen Sie eine Vorschau Ihrer Website und links eine Sammlung von Blöcken, die Sie Ihrer Website hinzufügen können.
Sie müssen die Blöcke nach unten scrollen, bis Sie den Abschnitt „Erweitert“ erreichen.
Sobald Sie den Block „Navigationsmenü“ gefunden haben, müssen Sie ihn in die Seitenleiste oder an eine beliebige Stelle ziehen, an der Sie das Navigationsmenü anzeigen möchten. Standardmäßig gibt es im Menü nur einen Eintrag: „Info“.
Jetzt müssen Sie die Menüeinstellungen ändern. Dazu müssen Sie auf das Menü klicken und die verfügbaren Optionen werden in einem Bereich auf der linken Seite der Seite angezeigt.
Derzeit ist der Menütyp „Einfach“ ausgewählt. Dadurch können Sie Ihr eigenes Navigationsmenü in SeedProd erstellen.
Für dieses Tutorial klicken wir jedoch auf den Typ „WordPress-Menü“, um das WordPress-Navigationsmenü zu verwenden.
Abschließend müssen Sie auf die Registerkarte „Erweitert“ klicken. Hier finden Sie die Möglichkeit, das Listenlayout vertikal oder horizontal auszurichten.
Wenn Sie auf die Schaltfläche „Vertikal“ klicken, werden Sie feststellen, dass sich die Vorschau sofort in ein vertikales Navigationsmenü ändert.
Vergessen Sie nicht, oben auf dem Bildschirm auf die Schaltfläche „Speichern“ zu klicken, um Ihr vertikales Menü zu speichern.
Es kann schwierig sein, ein Standardmenü zu berühren, während man den kleinen Bildschirm eines Smartphones verwendet. Aus diesem Grund empfehlen wir Ihnen, eine Vorschau der mobilen Version Ihrer WordPress-Site anzuzeigen, um zu sehen, wie Ihre Website auf Mobilgeräten aussieht.
Vertikale Menüs sind viel einfacher zu navigieren, insbesondere wenn Sie ein auf den Vollbildmodus reagierendes Menü verwenden, das sich automatisch an unterschiedliche Bildschirmgrößen anpasst.
Um zu erfahren, wie Sie Ihr Navigationsmenü mobilfreundlicher gestalten können, lesen Sie unsere Anleitung zum Hinzufügen eines responsiven Vollbildmenüs in WordPress.
Ein Dropdown-Menü sieht wie ein normales horizontales Navigationsmenü oben auf dem Bildschirm aus, aber wenn Sie mit der Maus über eines der Elemente fahren, wird ein vertikales Untermenü angezeigt.
Wenn Sie eine inhaltsreiche Website haben, können Sie die Menüstruktur über ein Dropdown-Menü nach Thema oder Hierarchie organisieren. Dadurch werden mehr Inhalte auf begrenztem Raum angezeigt.
Um ein Dropdown-Navigationsmenü auf Ihrer Website anzuzeigen, müssen Sie ein Design auswählen, das Dropdown-Menüs unterstützt. Anschließend müssen Sie das Navigationsmenü erstellen und dann zu einigen Menüeinträgen Unterpunkte hinzufügen.
Wie das geht, erfahren Sie Schritt für Schritt in unserem Einsteiger-Guide zum Erstellen eines Dropdown-Menüs in WordPress.
Ein Mega-Menü listet mehrere Menüs vertikal auf der Seite auf. Sie ähneln Dropdown-Menüs, mit dem Unterschied, dass alle Untermenüs gleichzeitig angezeigt werden, sodass Benutzer schnell und einfach die besten Inhalte finden können.
Mega-Menüs sind sehr attraktiv und interaktiv, da sie das Beste aus horizontalen und vertikalen Menüs kombinieren, um einen nützlichen Überblick über den Inhalt Ihrer Website auf einem einzigen Bildschirm anzuzeigen.
Wir haben WPBeginner kürzlich ein Mega-Menü hinzugefügt, um die Sichtbarkeit von Inhalten zu verbessern. Wie uns das gelungen ist, erklären wir in unserem Blick hinter die Kulissen des neuen Designs unserer Website.
Weitere Informationen zum Hinzufügen eines Mega-Menüs zu Ihrer WordPress-Site finden Sie in unserem Leitfaden.
Wir hoffen, dass Ihnen dieses Tutorial dabei geholfen hat, das Erstellen eines vertikalen Navigationsmenüs in WordPress zu erlernen. Vielleicht möchten Sie auch erfahren, wie Sie Ihren eigenen Podcast starten oder sich unseren Expertenvergleich der besten Domain-Registrare ansehen.
