{"id":116815,"date":"2023-04-04T10:45:40","date_gmt":"2023-04-04T10:45:40","guid":{"rendered":"https:\/\/elementor.com\/blog\/einfuehrung-von-elementor-3-12-gestalten-sie-schoene-und-anspruchsvolle-mega-menues\/"},"modified":"2025-12-28T06:30:58","modified_gmt":"2025-12-28T04:30:58","slug":"einfuehrung-von-elementor-3-12-gestalten-sie-schoene-und-anspruchsvolle-mega-menues","status":"publish","type":"post","link":"https:\/\/elementor.com\/blog\/de\/einfuehrung-von-elementor-3-12-gestalten-sie-schoene-und-anspruchsvolle-mega-menues\/","title":{"rendered":"Einf\u00fchrung von Elementor 3.12 – Gestalten Sie sch\u00f6ne und anspruchsvolle Mega-Men\u00fcs"},"content":{"rendered":"\n

Elementor 3.12 enth\u00e4lt eine Reihe aufregender Funktionen, darunter ein neues Men\u00fc-Widget, mit dem Sie visuell anspruchsvolle Mega-Men\u00fcs in Elementor erstellen k\u00f6nnen.\nDiese Version enth\u00e4lt auch eine neue Funktion, mit der Sie Ihre Website-Listen weiter anpassen und eine alternative Vorlage im Loop Grid-Widget erstellen k\u00f6nnen.\nSchlie\u00dflich erweitert diese Version auch bestehende Funktionen und bietet Ihnen zus\u00e4tzliche Design- und Anpassungsoptionen. <\/p>\n\n

\"\"<\/figure>\n\n

[Pro] Einf\u00fchrung des Mega-Men\u00fcs in Elementor mit dem neuen Men\u00fc-Widget<\/h2>\n\n

Diese Version f\u00fchrt eine der am h\u00e4ufigsten nachgefragten Funktionen ein \u2013 das Mega-Men\u00fc, verf\u00fcgbar mit dem neuen Men\u00fc-Widget.\nMit dem neuen Men\u00fc-Widget k\u00f6nnen Sie ein erweiterbares Men\u00fc erstellen, das es Ihnen erm\u00f6glicht, mehr Inhalte anzuzeigen.\nDies verbessert die Besucher-Erfahrung, indem es den Besuchern Ihrer Website erleichtert wird, bestimmte Kategorien und Unterkategorien zu finden, und erm\u00f6glicht es Ihnen, Website-Designs<\/a> zu erstellen, die einzigartig und auff\u00e4llig sind.\nUm das neue Men\u00fc-Widget zu verwenden, aktivieren Sie die Funktionen Men\u00fc, Flexbox-Container und Verschachtelte Elemente, indem Sie zu Ihrem WordPress-Dashboard \u2192 Elementor \u2192 Funktionen gehen. <\/p>\n\n

Einrichten der Navigation Ihrer Website<\/h3>\n\n

Mit dem neuen Men\u00fc-Widget k\u00f6nnen Sie so viele Men\u00fcelemente erstellen, wie Sie m\u00f6chten, von Grund auf – ohne unbedingt Men\u00fcs im WordPress-Men\u00fcbildschirm erstellen zu m\u00fcssen.\nJedes Men\u00fcelement kann mit jeder Seite verlinkt werden, was Ihnen mehr Flexibilit\u00e4t bei der Strukturierung der Navigation Ihrer Website gibt.\nF\u00fcr eine bestm\u00f6gliche Navigation wird empfohlen, das dynamische interne URL<\/a>-Tag zu verwenden, um sicherzustellen, dass Ihre Men\u00fcelemente immer auf die beabsichtigte Seite verlinken. <\/p>\n\n

F\u00fcr jedes Men\u00fcelement k\u00f6nnen Sie entscheiden, ob das Men\u00fcelement Dropdown-Inhalte enth\u00e4lt, in denen Sie Unterkategorien hinzuf\u00fcgen k\u00f6nnen, oder nicht, und ein Symbol f\u00fcr den Dropdown-Indikator ausw\u00e4hlen.\nWenn Sie sich entscheiden, Dropdown-Inhalte hinzuzuf\u00fcgen, k\u00f6nnen Sie einen Dropdown-Effekt festlegen, um das Men\u00fcelement beim Hover oder Klick zu \u00f6ffnen, und w\u00e4hlen, ob die Dropdown-Inhalte mit einem Animationseffekt einblenden sollen. <\/p>\n\n

Erstellen Sie ein Mega-Men\u00fc mit Dropdown-Inhalten<\/h3>\n\n

Durch Aktivieren der Dropdown-Inhalte pro Men\u00fcelement und Nutzung der Leistungsf\u00e4higkeit von Containern und verschachtelten Elementen k\u00f6nnen Sie sch\u00f6ne und anspruchsvolle Mega-Men\u00fcs erstellen.\nWenn Sie die Dropdown-Inhalte f\u00fcr ein Men\u00fcelement aktivieren, wird dem Men\u00fcelement ein neuer Container hinzugef\u00fcgt, in den Sie beliebige Widgets ziehen, den Inhaltsbereich gestalten und jedes gew\u00fcnschte Layout entwerfen k\u00f6nnen, was zu einer besseren Besucher-Erfahrung und einer h\u00f6heren Engagement-Rate f\u00fchrt.\nErfahren Sie, wie Sie ein Mega-Men\u00fc hier<\/a> erstellen. <\/p>\n\n

Responsive Einstellungen<\/h2>\n\n

Um die Besucher-Erfahrung an jedes Ger\u00e4t anzupassen, k\u00f6nnen Sie den Breakpoint ausw\u00e4hlen, bei dem das Men\u00fc zu einem Toggle-Men\u00fc wird, und die Gestaltung der Dropdown-Inhaltsbereiche anpassen, um sie an den Bildschirm anzupassen, auf dem sie angezeigt werden. <\/p>\n\n

Bitte beachten:<\/strong> Im Rahmen dieses Updates wurde das Nav-Men\u00fc-Widget in WordPress-Men\u00fc umbenannt, und Sie k\u00f6nnen es jederzeit weiterhin verwenden, auch innerhalb Ihres Men\u00fc-Widgets, um Men\u00fcs basierend auf dem Men\u00fcbildschirm in WordPress zu erstellen. <\/p>\n\n

\"\"<\/figure>\n\n

[Pro] Diversifizieren Sie Ihr Design mit einer alternativen Loop-Vorlage<\/strong><\/h2>\n\n

Die alternative Loop-Vorlage, eine neue Funktion im Loop Grid-Widget, erm\u00f6glicht es Ihnen, ein h\u00f6heres Ma\u00df an Designflexibilit\u00e4t zu erreichen, indem Sie eine andere Vorlage auf bestimmte Elemente innerhalb eines Loop Grids anwenden. <\/p>\n\n

F\u00fcgen Sie eine alternative Vorlage hinzu, um Elemente hervorzuheben<\/h3>\n\n

Um eine weitere Vorlage in Ihrem Loop Grid hinzuzuf\u00fcgen, schalten Sie den Schalter ‚Eine alternative Vorlage anwenden‘ ein.\nDas Klicken auf Vorlage erstellen f\u00fchrt Sie zum Theme Builder<\/a>, wo Sie ein neues Loop-Element entwerfen k\u00f6nnen, alternativ k\u00f6nnen Sie eine der zuvor erstellten Loop-Element-Vorlagen als Ihre alternative Vorlage ausw\u00e4hlen.\nSie k\u00f6nnen bis zu 20 verschiedene Vorlagen<\/a> f\u00fcr jedes Loop Grid auf Ihrer Website erstellen. <\/p>\n\n

Sobald Sie die Vorlage ausgew\u00e4hlt haben, die Sie verwenden m\u00f6chten, k\u00f6nnen Sie bestimmen, auf welche Position im Grid sie angewendet werden soll und ob sie wiederholt werden soll oder nicht.\nZum Beispiel k\u00f6nnen Sie eine alternative Vorlage auf das Element in der 2. Position im Grid anwenden und dann bestimmen, ob sie nur auf das 2. Element angewendet werden soll oder auf jedes 2. Element wiederholt werden soll. <\/p>\n\n

Bitte beachten:<\/strong> Im Rahmen dieser Version \u00fcberschreibt das Anwenden einer alternativen Vorlage das Design bestimmter Elemente in Ihrem Loop Grid basierend auf der Abfrage, die Sie f\u00fcr das gesamte Grid ausgew\u00e4hlt haben.\nEs ist noch nicht m\u00f6glich, ein Element einzuf\u00fcgen, das extern zur Abfrage ist. <\/p>\n\n

Nehmen Sie mehr Platz ein mit Spalten-Spannweite<\/h3>\n\n

Legen Sie eine Spalten-Spannweite f\u00fcr die alternative Vorlage fest, um bestimmte Loop-Elemente noch mehr hervorzuheben.\nDies erm\u00f6glicht es Ihnen, eine Vorlage zu entwerfen, die mehr Platz innerhalb Ihres Loop Grids einnimmt.\nZum Beispiel, wenn Sie ein Loop Grid mit 3 Spalten haben, k\u00f6nnen Sie eine alternative Vorlage erstellen, die 2 Spalten abdeckt.\nDas bedeutet, dass wenn Sie die alternative Vorlage auf das 2. Element anwenden und es auf 2 Spalten spannen, das 2. Element 2 Spalten in der ersten Reihe einnehmen wird. <\/p>\n\n

\"\"<\/figure>\n\n

[Pro] Starten Sie Ihren Workflow mit vordefinierten Loop-Vorlagen<\/strong><\/h2>\n\n

Beschleunigen Sie Ihren Arbeitsablauf und lassen Sie sich von 10 neuen Loop-Vorlagen in der Bibliothek inspirieren.\nDiese Version enth\u00e4lt 6 Vorlagen f\u00fcr Beitr\u00e4ge und 4 f\u00fcr WooCommerce<\/a>-Produkte.\nSie finden die Vorlagen, indem Sie auf das Symbol der Vorlagenbibliothek im Canvas klicken, wenn Sie eine neue Loop-Vorlage erstellen.\nDie Vorlagenbibliothek zeigt Ihnen Vorlagen f\u00fcr Beitr\u00e4ge oder Produkte basierend auf dem von Ihnen im Inhaltstab des Loop-Rasters gew\u00e4hlten ‚Vorlagentyp‘ an. <\/p>\n\n

Sobald Sie die gew\u00fcnschte Vorlage ausgew\u00e4hlt haben, k\u00f6nnen Sie sie weiter anpassen und den Inhalt und die Abfrage ausw\u00e4hlen, die Sie anzeigen m\u00f6chten. <\/p>\n\n

Bitte beachten Sie<\/strong>: Loop-Vorlagen sind containerbasiert und nur f\u00fcr Websites verf\u00fcgbar, die Container aktiviert haben. <\/p>\n\n

\"\"<\/figure>\n\n

Elementor-Oberfl\u00e4chen\u00fcberarbeitung<\/strong><\/h2>\n\n

Elementor gibt es seit fast 7 Jahren, was auch der Zeitpunkt ist, als die Benutzeroberfl\u00e4che des Editors erstmals entworfen wurde.\nIm Laufe der Jahre wurden unz\u00e4hlige neue Funktionen und Widgets<\/a> hinzugef\u00fcgt, was es wichtig macht, dass Elementor \u00c4nderungen an der Benutzeroberfl\u00e4che (UI) und Benutzererfahrung (UX) vornimmt, um zuk\u00fcnftiges Produktwachstum zu erleichtern. <\/p>\n\n

In den kommenden Versionen wird die Benutzeroberfl\u00e4che von Elementor schrittweise \u00fcberarbeitet, die in REACT erstellt wird.\nDie \u00c4nderungen an der Benutzeroberfl\u00e4che f\u00f6rdern Best Practices bei der Website-Erstellung mit Elementor, verbessern die Zug\u00e4nglichkeit, optimieren Arbeitsabl\u00e4ufe und erm\u00f6glichen die Einf\u00fchrung neuer Funktionen in der Zukunft. <\/p>\n\n

Ein neues Farbschema f\u00fcr Elementor <\/strong><\/h3>\n\n

In Elementor 3.12 wurde die Benutzeroberfl\u00e4che des Editors erstmals aktualisiert, um sich an das neue Farbschema<\/a> anzupassen.\nIm Rahmen dieses Updates wurden die Farben im Editor vereinfacht.\nDie neuen Farben sind f\u00fcr den Dunkel- und Hellmodus optimiert, bieten eine bessere Zug\u00e4nglichkeit und erm\u00f6glichen es Ihnen, sich auf den Inhalt Ihrer Website zu konzentrieren, ohne die Funktionalit\u00e4ten des Produkts zu beeintr\u00e4chtigen. <\/p>\n\n

Experiment: Neue obere Leiste<\/strong><\/h3>\n\n

In Elementor 3.12 wird die neue obere Leiste als Experiment eingef\u00fchrt, das Sie aktivieren k\u00f6nnen (vom WordPress-Dashboard \u2192 Elementor \u2192 Funktionen).\nDiese Version zeigt die Anfangsphase der neuen oberen Leiste im Editor, die mit REACT erstellt wurde, um die Leistung zu verbessern und zuk\u00fcnftige F\u00e4higkeiten zu erm\u00f6glichen.\nDie obere Leiste vereint alle wesentlichen Aktionen, die f\u00fcr die Erstellung von Websites erforderlich sind, an einem zentralen und leicht zug\u00e4nglichen Ort. <\/p>\n\n

Als Teil dieser Version enth\u00e4lt die obere Leiste die folgenden Elemente und Funktionen: <\/p>\n\n