Springe zum Hauptinhalt

Wie man ein Mega-Menü auf Divi erstellt

Divi: das am einfachsten zu verwendende WordPress-Theme

Divi: Das beste WordPress-Theme aller Zeiten!

Mehr 600.000 Downloads, Divi ist das beliebteste WordPress-Theme der Welt. Es ist vollständig, einfach zu bedienen und enthält mehr als 62-freie Vorlagen. [Empfohlen]

Mit Megamenüs können Benutzer mehr Links auf einmal sehen, ohne den Inhalt Ihres Menüs scrollen, schweben und sich merken zu müssen. Der beste Weg, das Mega-Menü zu verstehen, ist, dass es sich um Dropdown-Menüs in Dropdown-Menüs handelt.

Anstelle Ihres normalen Dropdown-Menüs, in dem ein Untermenü angezeigt wird, wenn Sie den Mauszeiger über die wichtigsten übergeordneten Links in Ihrer Navigationsleiste bewegen, können Sie in einem Mega-Menü zusätzliche Links und Untermenüs aus dem Dropdown-Menü verwenden.

So fügen Sie Ihrer Navigationsleiste ein Megamenü hinzu

Melden Sie sich bei Ihrem WordPress-Dashboard an und navigieren Sie zu Auftritte> Menüs .

Wordpress-Menü divi.png

Erstellen Sie ein Menü mit vier übergeordneten Verknüpfungen, wobei jede der übergeordneten Verknüpfungen ihre eigenen Untermenü-Verknüpfungen hat. Im folgenden Beispiel füge ich drei Untermenüelemente unter jedem der vier übergeordneten Menülinks hinzu.

Beginnen Sie mit der Bewerbung Ihres Blogs

Laden Sie Dutzende von Logos, Bannern, Website-Vorlagen und vielen anderen Marketing-Tools herunter, um Ihren WordPress-Blog zu vermarkten. [Empfohlen]

Menü divi.png

Erstellen Sie einen zusätzlichen Link als Megamen-Link. Für das folgende Beispiel nenne ich diesen Link "Main". Ziehen Sie dann die beiden übergeordneten Menüverknüpfungen (jeweils mit ihren Untermenüverknüpfungen) unter den Hauptlink.

Um nun Ihr Megamenu zu erstellen, müssen Sie dem Hauptlink der obersten Ebene, "Main", eine spezielle CSS-Klasse hinzufügen. Klicken Sie dazu oben auf Ihrer Seite auf den Link mit den Bildschirmoptionen und vergewissern Sie sich, dass die Option für die CSS-Klasse aktiviert ist.

css Klassen divi.png

Erstellen Sie ganz einfach Ihre Website mit Elementor

Mit Elementor können Sie auf einfache Weise jedes Website-Design mit einem professionellen Look erstellen. Zahlen Sie nicht mehr teuer für das, was Sie selbst tun können. [Kostenlos]

Schließlich müssen Sie dem soeben erstellten "Main" -Link eine CSS-Klasse hinzufügen. Klicken Sie auf den Pfeil rechts neben dem Menüpunkt "Main", um die zusätzlichen Konfigurationsoptionen umzuschalten. Suchen Sie das Textfeld mit der Bezeichnung CSS-Klassen und geben Sie die Klasse "Mega-Menü" ein.

Mega Menü divi.png

Wenn Sie jetzt Ihre Seite neu laden, können Sie sehen, dass alle vorherigen Menüs im riesigen Menü unter diesem Link, dem Megamenü, platziert wurden.

Suchst du nach den besten WordPress Themes und Plugins?

Laden Sie die besten Plugins und WordPress-Themes auf Envato herunter und erstellen Sie ganz einfach Ihre Website. Schon mehr als 49.720.000 Downloads. [EXCLUSIVE]

Mega Menü Divi Beispiel.png

Das ist alles für dieses Tutorial. Ich hoffe, Sie können damit ganz einfach ein Mega-Menü auf Divi erstellen.

Dieser Artikel enthält Kommentare 0

Hinterlassen Sie einen Kommentar

Ihre E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind markiert *

Diese Website verwendet Akismet, um unerwünschte Inhalte zu reduzieren. Erfahren Sie mehr darüber, wie Ihre Kommentardaten verwendet werden.

Zurück nach oben
15 Aktien
Aktie6
tweet2
Registrieren7