Elementor ist ein leistungsstarker Seitenersteller, mit dem Sie atemberaubende Websites mit Leichtigkeit erstellen können, und sein grundlegendes Flipbox-Widget bietet eine einfache Möglichkeit, interaktive 3 D-Effekte hinzuzufügen Das Problem? Es ist ein Pro-Feature, Designs und Animationen sind begrenzt.
Master Addons ist ein leistungsstarkes Elementor-Addon, das auch ein Flipbox-Widget bereitstellt. Es ist kostenlos und ermöglicht eine größere Anpassung als das Elementors Flipbox-Widget.
Mit Master Addons können Sie visuell markante 3 D-Flipboxen erstellen, die Benutzer auf eine Weise bewegen, transformieren und ansprechen, wie es das Standard-Elementor-Widget einfach nicht kann.
In diesem Ratgeber zeigen wir Ihnen, wie Sie mit Master Addons erstklassige 3 D-Flipboxen erstellen und auffällige Designs kreieren, die auffallen.
Erstellen einer 3 D Elementor Flipbox mit Master Addons
Lassen Sie uns Stein für Stein vorgehen und unser eigenes erschaffen Flipbox Verwenden Master Addons. Am Ende sollten Sie ein sehr klares Verständnis dafür haben, wie Sie Ihr eigenes einzigartiges erstellen können.
Schritt 1: Installation von Master-Addons für Elementor
Bevor Sie mit der Verwendung des Master Addons Flipbox-Widgets beginnen können, müssen Sie dies tun Installieren und aktivieren Das Master Addons Plugin So geht's:
1. Gehen Sie in Ihrem WordPress-Dashboard auf Plugins > Neu hinzufügen.
2. Suchen Sie in der Suchleiste nach “Master Addons for Elementor”.
3. Klicken Sie Jetzt installieren Und dann Aktivieren Sobald das Plugin installiert ist.
Nach der Aktivierung sind die Master Addons-Widgets, einschließlich der Flipbox, im Elementor-Editor verfügbar.
Schritt 2: Hinzufügen des Flipbox Widgets
Nachdem das Plugin nun installiert ist, fügen wir die Flipbox zu Ihrer Seite hinzu
1. Öffnen Sie Ihre Seite im Elementor-Editor Wählen Sie Flexbox oder Raster als Ihr Layout.
2. Suchen Sie auf der linken Seite nach dem Flipbox. Sie sollten ein Flipbox-Widget mit einem “sehenMA” Tag.
3. Ziehen Sie die Drag & Drop Flipbox Widget in den gewünschten Abschnitt Ihrer Seite Wichtig zu beachten ist hier, dass immer wenn Sie mit Flipboxen arbeiten, es Flexbox zu verwenden empfohlen Um sicherzustellen, dass Ihre Flipboxen gut aussehen.
Nach dem Hinzufügen erscheint ein einfaches Flipbox-Design auf Ihrer Leinwand, das individuell angepasst werden kann.
Schritt 3: Erstellen einer 3 D Elementor Flipbox
Jetzt sind wir bei den Einstellungen angekommen, die Sie optimieren können, um einen Premium-Looking 3 D-Effekt auf Ihre Flipbox zu bekommen.
Erstmal ab.
1. Stilvoreinstellung
In der Stilvoreinstellung stellen Sie die Designvariation und Animationsstil
Mit der Designvariante können Sie die Vorderseite Ihrer Box anpassen. Sie können sie auf: einstellen Standard, Bild, Diagonal, Vorderes Symbol.
Mit dem Animationsstil können Sie genau auswählen, wie Ihre Flipbox animiert wird.
Master Addons hat 20+ Premium Animationen zur Verfügung Von einfachen horizontalen und vertikalen Flip bis 3 D Flip, Würfelanimationen(Überschlagseffekte usw.
Master Addons gibt Ihnen eine dedizierte 3 D-Flip-Animation, die Ihren Flipboxen ein dynamisches Gefühl verleiht Sie können sogar den Flip-Stil dieser Animation anpassen Sobald Sie es ausgewählt haben, erscheint eine neue Option in der “Stil” Reiter unter Allgemeine Einstellungen: 3 D Flip Style.
2. Frontinhalt
Klicken Sie auf die Flipbox Widget zum Bearbeiten.
Unter der Inhalt Tab, sehen Sie Felder, um Ihre Inhalte für die Front Kasten. Sie können hier eine Überschrift, Beschreibung und ein Bild oder Symbol hinzufügen.
3. Zurück Inhalt
Scrollen Sie nach unten zum Zurück Inhalt Abschnitt im selben Inhalt Tab.
Fügen Sie in ähnlicher Weise den Inhalt hinzu, der angezeigt werden soll, wenn die Flipbox umgedreht ist. Sie können eine neue Überschrift, einen neuen Text oder eine Call-to-Action-Schaltfläche hinzufügen.
Sie können beide Seiten der Flipbox separat stylen, indem Sie die Stil Tab, um Schriftarten, Farben, Polsterung, Ränder und mehr für jede Seite anzupassen.
Schritt 4: Verbesserung von 3 D-Flipboxen mit anderen Erweiterungen
Master-Addons für das Elementor stoppen nicht nur bei der grundlegenden Flipbox-Funktionalität, sondern heben Ihre Flipbox mit einer Vielzahl von Erweiterungen, die Interaktivität, reibungslose Animationen und ansprechende Effekte hinzufügen sollen, auf ein völlig neues Niveau.
Wir untersuchen die leistungsstarken Funktionen, mit denen Sie Ihre Flipbox verbessern und sie dynamischer, visuell fesselnder und benutzerfreundlicher machen können.
Egal, ob Sie erweiterte 3 D-Transformationen erstellen, Parallaxeneffekte hinzufügen oder Eingangsanimationen fein abstimmen möchten, Master Addons bietet alles, was Sie brauchen, um Ihre Flipboxen auf die nächste Stufe zu heben.
Transformiert:
- In der Fortgeschritten Tab, finden Sie die Transformiert Einstellungen.
- Hier können Sie das anpassen Flipbox-rotation Auf der X, Y, oder Z Achse, um komplexere 3 D-Effekte zu erzeugen.
- Herumspielen mit Skala, Übersetzen, und Schrägstellen Optionen für eine noch dynamischere Flipbox.
Rellax (Parallaxeneffekt):
- Um den Rellax-Effekt zu ermöglichen, gehen Sie zu den Fortgeschritten Tab und scrollen Sie zum Rellax Einstellungen.
- Aktivieren Sie den Effekt und passen Sie den Scrollgeschwindigkeit Parallaxeneffekt zu erzeugen, bei dem sich die Flipbox beim Scrollen der Benutzer mit einer anderen Geschwindigkeit als der Rest des Inhalts bewegt.
Schwimmende Effekte:
- Floating-Effekte (Pro) hinzufügen, damit die Flipbox sanft in einer Schleife driftet Diese Option finden Sie unter der Bewegungseffekte Abschnitt.
- Wählen Sie die Art der Bewegung (z.B. nach oben oder unten schweben) und passen Sie die Intensität nach Ihren Wünschen an.
Kurzinfos:
- Mit Master Addons können Sie auch hinzufügen Tooltips Ihrer Flipbox, die angezeigt werden, wenn Benutzer mit der Maus über Elemente fahren Tooltips können zusätzliche Informationen oder Kontext bereitstellen, ohne Ihr Design zu überladen.
- Unter den erweiterten Einstellungen können Sie Tooltips sowohl für den vorderen als auch für den hinteren Inhalt der Flipbox aktivieren und anpassen.
- Passen Sie den Text, die Position (oben, unten, links oder rechts) und den Stil (Farben, Schriftgröße) des Tooltips an, damit sie zu Ihrem Design passen.
Einige andere hilfreiche Erweiterungen
- Unter der Bewegungseffekte Tab, aktivieren Eingangsanimation Aufmerksamkeit erregenden Effekt anzuwenden, da die Flipbox auf der Seite erscheint.
- Sie können aus verschiedenen Animationen wie Einblenden, Folien oder Abprallen wählen, damit Ihre Flipbox beim Betreten des Ansichtsfensters platzt.
- Wenn Sie eine glatte Enthüllungsanimation wünschen, wenn die Flipbox umgedreht wird, aktivieren Sie die Enthüllen Option unter der Fortgeschritten Einstellungen.
- Mit dieser Funktion kann der hintere Inhalt der Flipbox nach und nach angezeigt werden, wodurch ein ausgefeilter Übergang entsteht.
- Verwenden Anzeigebedingungen Regeln festzulegen, wann und wo die Flipbox erscheint, Sie können die Sichtbarkeit anhand von Gerätetypen (Desktop, Tablet, Mobilgerät) oder sogar Bedingungen wie der Scrollposition steuern.
Vorschau und Fertigstellung Ihrer Flipbox
Wenn du deine Flipbox angepasst hast, ist es Zeit, sie in Aktion zu sehen.
- Klicken Sie auf die Augensymbol Unten im Elementor-Panel, um eine Vorschau Ihrer Flipbox im Editor anzuzeigen.
- Testen Sie, wie sich die Flipbox auf verschiedenen Geräten (Desktop, Tablet und Mobilgerät) verhält, um sicherzustellen, dass sie reaktionsschnell ist und überall gut aussieht.
- Nehmen Sie letzte Anpassungen am Design, den Animationsgeschwindigkeiten oder der Position vor, bis Sie mit dem Aussehen zufrieden sind.
Sobald Sie zufrieden sind, klicken Sie Veröffentlichen Flipbox auf Ihrer Seite live zu gestalten.
Schlussfolgerung
Master Addons for Elementor verleiht dem Standard-Flipbox-Erlebnis mehr Würze und bietet eine Reihe fortschrittlicher Funktionen, mit denen Sie wirklich dynamische, interaktive Designs erstellen können.
Passend zu den 3 D-Animationseffekten gibt es Optionen wie Transformationen, Parallaxeneffekte, sanfte Enthüllungsübergänge und mehr, mit denen Sie Ihre Flipboxen auf eine Weise zum Leben erwecken können, die über grundlegende Animationen hinausgeht.
Wenn Sie diesem Leitfaden folgen, können Sie Ihrer Website ganz einfach auffällige Flipboxen hinzufügen und so sowohl die Benutzereinbindung als auch die visuelle Attraktivität steigern. Tauchen Sie also in Master Addons ein und beginnen Sie mit Experimenten, um atemberaubende 3 D-Flipboxen zu erstellen, die Ihre Besucher beeindrucken werden!
