Können Sie sich eine große Website ohne Navigationsmenü vorstellen?
Auf keinen Fall!
Die Menschen legen mehr Wert auf die Zeit, die sie online verbringen. Das zeigt eine aktuelle Studie 94% der Webbenutzer Sagen wir, einfache Navigation sei das nützlichste Merkmal einer Website.
Fast jeder, oder?
Aufgrund der Benutzerfreundlichkeit und der Fähigkeit, den Benutzer einzubinden, ist ein Mega-Menü die perfekte Art von Navigationsmenü für Ihre Website. Ein einfaches, aber funktionales Mega-Menü ermutigt Benutzer, noch mehr Bereiche Ihrer Website zu erkunden und sofort zu handeln.
Sogar die größten E-Commerce-Websites wie Amazon und eBay verwenden Megamenüs, damit Benutzer die gesamte Navigation einer Website in einem einzigen Menü durchsuchen können.
Nicht nur eine E-Commerce-Website, sondern auch ein Mega-Menü ist eine großartige Option für alle Nachrichten-Websites, Zeitschriften, Content-Publisher, Unternehmen und mehr.
Beim Erstellen einer großen Website mit mehreren Kategorien und Unterkategorien ist Megamenu ein großes, mehrspaltiges, erweiterbares Menü, in dem alles auf einmal sichtbar ist.
Ich bin mir sicher, dass mir so viele Fragen in den Sinn kommen! Rechts?
Keine Sorge … Hier werde ich Ihnen helfen, alle Antworten auf Ihre Fragen zu erhalten, und am Ende dieses Artikels erfahren Sie, wie Sie ganz einfach Ihr eigenes Mega-Menü erstellen.
Wir stellen vor: ElementsKit Mega Menu Builder
Verwendung der funktionsreichen ElementsKit Mega Menu Builder Sie können jede Art von Megamenü mit einer Elementor-Live-Content-Schnittstelle erstellen und anpassen.
Sie erhalten Variationen im Mega-Menü wie das Navigationsmenü und das vertikale Mega-Menü sowie viele Anpassungsoptionen.
Insgesamt ist ElementsKit Elementor Mega Menu ein voll ausgestattetes Modul für Ihre professionelle Website, das leicht an der Spitze der beste WordPress Mega Menu Builder für Elementor.
Wie erstelle ich ein Mega-Menü mit Elementor?
Elementor bietet Ihnen viele Funktionen zum Entwerfen Ihres Mega-Menüs, aber um zusätzliche Funktionen zu erhalten, können Sie ein Plugin eines Drittanbieters verwenden.
Genau, du brauchst ElementsKit. Obwohl es so viele Plugins zum Erstellen eines Mega-Menüs gibt, unterstützt ElementsKit dennoch verschiedene Arten von Mega-Menüs, darunter vertikale Mega-Menüs, horizontale Mega-Menüs und viele weitere Anpassungsoptionen.
Hier zeigen wir Ihnen Schritt für Schritt im Detail, wie Sie ein voll funktionsfähiges Mega-Menü erstellen.
Was Sie zum Erstellen eines Megamenüs mit Elementor benötigen
Um diesem Tutorial-Blog zu folgen, benötigen Sie zwei Dinge–>
Oder befolgen Sie die Schritt-für-Schritt-Anleitung:
Stellen Sie sicher Megamenü Modul ist AN aus ElementsKit → MODULE.
Schritt #1: Menü hinzufügen
Um ein Mega-Menü in Elementor zu erstellen, müssen Sie ein Menü aus dem WordPress-Dashboard erstellen. Dazu
- Navigieren Sie zu Darstellung > Menü.
- Klicke auf Erstellen Sie ein neues Menü.
- Bieten Menüname > Überprüfen Sie die Kontrollkästchen > Menü erstellen.
- Klicke auf Benutzerdefinierten Link > Bereitstellung Verknüpfung Und Menüelemente hinzufügen auf die gleiche Weise.
Schritt #2: Megamenü-Inhalt anpassen
In diesem Schritt können Sie Mega-Menüelemente hinzufügen aus dem von Ihnen erstellten WordPress-Menü.
Aktivieren Sie das Kontrollkästchen „Dieses Menü für Megamenu-Inhalte aktivieren“ > Klicken Sie auf das Mega-Menü mit Einstellungssymbol zu welchem Menüpunkt Sie das Mega-Menü hinzufügen möchten.
- Es öffnet sich ein Popup, schalten Sie das um Mega-Menü Option und Speichern. Klicken Sie anschließend daraufe MEGAMENÜ-INHALT BEARBEITEN Taste.
Vorlage wählen
- Drücke den Elementskit Klicken Sie auf das Symbol der Vorlagenbibliothek und navigieren Sie dann zu Überschriften.
- Klicke auf Header > Mega-Menüinhalt > Fügen Sie beliebige Mega-Menü.
Steuerungslayout
- Bearbeiten Sie den inneren Abschnitt indem Sie auf den gepunkteten Abschnitt klicken.
- Inhaltsbreitenfeld: Passen Sie die Breite Ihres Inhalts an, indem Sie nach rechts oder links ziehen.
- Inhalt in voller Breite: Wählen Gesamtbreite.
Wählen Sie Spaltenabstand aus
- Spaltenlücke=> Wählen Sie Ihren Spaltenabstand aus runterfallen.
Wählen Sie Position
- Höhe: Wählen Sie Ihre Größe aus, indem Sie von links nach rechts ziehen.
- Vertikal ausrichten: Wählen Sie „Vertikal ausrichten“ aus dem Dropdown-Menü aus.
- Überlauf: Wählen Sie „Überlauf Standard“ oder „Ausgeblendet“.
Wählen HTML-Tag
- Wähle Deine HTML-Tag aus Runterfallen.
Passen Sie den Überschriftentext des Mega-Menüs an
- Wählen Sie den Symboltyp aus.
- Aktivieren Sie diese Option, um ein Symbol hinzuzufügen.
- Kopfzeilensymbol hochladen.
- Titel hinzufügen oder bearbeiten.
- Beschreibung bearbeiten hinzufügen.
Text anpassen
- Text hinzufügen oder bearbeiten.
- Untertitel hinzufügen oder bearbeiten.
- Aktivieren Sie diese Option, um die Beschriftung anzuzeigen.
- Etikett hinzufügen oder bearbeiten.
- Passen Sie Hintergrundfarbe, Typografie, Polsterung, Ausrichtung und Radius an.
Schritt #3: Symbol anpassen
- Klicken 'Aktualisieren', um das Menü zu speichern > Schließen Sie den Editor.
- Gehen Sie jetzt zur Registerkarte „Symbol“ > Wählen Sie eine beliebige Farbe aus der Farbpalette.
- Wählen Sie ein Symbol aus der Symbolbibliothek aus.
- Gehen Sie jetzt zur Site > Ausgewähltes Symbol und Farbe wurden angezeigt.
Schritt #4: Badge anpassen
- Text hinzufügen oder bearbeiten.
- Wählen Abzeichenfarbe.
- Wählen Abzeichen-Hintergrundfarbe.
- Klicken Speichern.
Schritt #5: Einstellungen
Standardbreite
- Wählen Sie die Breite des Mega-Menüs: Standard.
- Wählen Sie die Position des Mega-Menüs: Standard.
- Speichern Sie das Fenster.
- Site-Ansicht: Standardbreite mit Standardposition anzeigen.
Standardrelativ
- Wählen Sie die Breite des Mega-Menüs: Standard.
- Wählen Sie die Position des Mega-Menüs: Relativ.
- Klicken Speichern.
- Site-Ansicht: Standardbreite mit relativer Position anzeigen.
Standardmäßige volle Breite
- Wählen Sie die Breite des Mega-Menüs: Gesamtbreite.
- Wählen Sie die Position des Mega-Menüs: Standard.
- Klicken Speichern.
- Site-Ansicht: Anzeige in voller Breite mit Standardposition.
Relative Position in voller Breite
- Wählen Sie die Breite des Mega-Menüs: Gesamtbreite.
- Wählen Sie die Position des Mega-Menüs: Relativ.
- Klicken Speichern.
- Site-Ansicht: Wird angezeigt Volle Breite mit relativer Position.
Benutzerdefinierte Standardbreite
- Wählen Sie die Breite des Mega-Menüs: Benutzerdefinierte Breite.
- Geben Sie eine beliebige benutzerdefinierte Breite an, standardmäßig ist dies jedoch der Fall 750px.
- Wählen Sie die Position des Mega-Menüs: Standard.
- Klicken Speichern.
- Site-Ansicht: Wird angezeigt Benutzerdefinierte Breite mit Standardposition.
Benutzerdefinierte Standardbreite Relativ
- Wählen Sie die Breite des Mega-Menüs: Benutzerdefinierte Breite.
- Geben Sie eine beliebige benutzerdefinierte Breite an, standardmäßig ist dies jedoch der Fall 750px.
- Wählen Sie die Position des Mega-Menüs: Relativ.
- Klicken Speichern.
- Site-Ansicht: Wird angezeigt Benutzerdefinierte Breite mit relativer Position.
Schritt #6: Erstellen Sie eine Header-Vorlage
Hier können Sie die verwenden Elementor-Header-Vorlage oder Sie können das verwenden ElementsKit-Header-Vorlage.
- Jetzt suchen Navigationsmenü > Ziehen Sie den Ekit Nav-Menü Und Fallen auf dem ausgewählten Bereich. Stellen Sie sicher, dass Sie das ElementsKit Nav-Menü ziehen, da sonst Ihr erstelltes Meg-Menü nicht angezeigt wird.
- Gehe zu Menüeinstellungen > wählen Sie Ihre erstellte Kopfzeilenmenü aus dem Dropdown-Menü.
- Sie können von hier aus jede Art von Widget hinzufügen, um Ihre Header-Vorlage anzupassen.
Erstellen Sie ein Mega-Menü mit Gutenberg
Wenn Sie Ihre Website im WordPress-Blockeditor erstellt haben, können Sie auch Mega-Menü in Gutenberg erstellen reibungslos. Das Blockeditor-Plugin GutenKit bietet die einfachste Möglichkeit, ein WordPress-Megamenü in Gutenberg zu erstellen.
Mit GutenKit können Sie das gesamte Menü im Editor erstellen und Megamenüs sowohl in vertikaler als auch horizontaler Ausrichtung gestalten.
Sie müssen lediglich das Plugin GutenKit Pro installieren und mit dem Erstellen Ihrer schönen Site in Gutenberg beginnen.
Endgültige Ausgabe
- Wenn Sie fertig sind, klicken Sie auf Aktualisieren Taste, um das Menü zu speichern.
- Gehen Sie nun zu Ihrer Website und Sie können sehen, dass Ihr ausgewähltes Megamenü entsprechend angezeigt wird.
Weitere Einzelheiten zum Erstellen eines Mega-Menüs in WordPress finden Sie in der Dokumentation von ElementsKit. Mega-Menü-Widget für Elementor.
Zusammenfassung
Endlich haben wir es erfolgreich bis zum Ende geschafft. Ich hoffe, wir konnten Ihnen mit diesem Tutorial helfen! Und jetzt können Sie mithilfe von ein benutzerdefiniertes Elementor-Megamenü erstellen ElementsKit!
Hier können Sie alle Schritte in einem einzigen Video sehen.
Wenn Sie weitere Bedenken haben oder auf andere Probleme gestoßen sind, teilen Sie uns dies bitte im Kommentarbereich mit!
Schreibe einen Kommentar