Elementor Tipps und Tricks für Fortgeschrittene
Veröffentlicht: 2021-11-29Suchen Sie nach einer Möglichkeit, eine Website zu erstellen, die weniger Zeit mit Tipps und Tricks verbringt?
Sind Sie neugierig auf die fortgeschrittenen Tipps und Tricks von Elementor? Elementor ist der zeitsparendste Seitenersteller auf dem Markt.
Elementor ist ein großartiges Tool und bietet Ihnen viele Anpassungsmöglichkeiten. Jetzt hat es sich mit Zeit und Mühe weiterentwickelt und ermöglicht es Ihnen, voll funktionsfähige Websites ohne Programmierung zu entwerfen. Es hat viele erstaunliche Tipps und Tricks. Dabei können Ihnen die Elementor Tipps und Tricks sehr helfen.
Warum fortgeschrittene Tipps und Tricks von Elementor verwenden?
Tipps und Tricks sind im Grunde genommen hilfreiche Hinweise und eine einfachere Möglichkeit, Ihre Arbeit deutlich komfortabler zu gestalten. Wenn Sie mit Elementor arbeiten, können Sie die erweiterten Tipps und Tricks von Elementor verwenden, um Ihre Erfahrung beim Erstellen von Websites weiter zu bereichern.
Wie wir wissen, braucht es Zeit, sich an ein neues Tool zu gewöhnen. Wenn Sie Ihre Aufgabe menüweise erledigen, dauert das sehr lange. Deshalb müssen Sie einige Tipps und Tricks in der Hand halten, um Ihre Zeit zu sparen. Mit den erweiterten Tipps und Tricks von Elementor können Sie problemlos und ohne Zeitverschwendung eine Website erstellen und anpassen.
Wie helfen Ihnen die erweiterten Tipps und Tricks von Elementor?
Die fortgeschrittenen Tipps und Tricks von Elementor sind im Arbeitsumfeld von großer Bedeutung. Sie können dir so helfen-
- Helfen Sie dabei, Seiten schneller zu erstellen und Ihren Arbeitsablauf zu verbessern.
- Erstellen Sie professionelle Seiten in Elementor.
- Verwenden Sie erweiterte Funktionen und verleihen Sie Ihren Seiten visuelles Flair.
In diesem Artikel werde ich einige fortgeschrittene Tipps und Tricks zu Elementor auflisten und beschreiben, um Ihnen zu zeigen, wie Sie sie verwenden. Sie können sie sofort und einfach implementieren, was Ihnen sehr helfen wird.
Hier ist eine Liste einiger fortgeschrittener Tipps und Tricks zu Elementor:
- Verwenden Sie den Finder
- Verwenden Sie die Elementor-Vorlagen
- Arbeiten Sie mit dem Navigator
- Verwenden Sie die Hotkeys oder Shortcuts
- Speichern Sie Ihre Elementor-Vorlagen
- Finden Sie die Lösung zuerst in Elementor
- Nutzen Sie globale Widgets effizient
- Laden Sie Ihre eigenen Schriftarten hoch
- Fügen Sie Ihren Widgets/Abschnitten eine Eingangsanimation hinzu
- Formteiler hinzufügen
- Fügen Sie Ihren Bildern Filtereffekte hinzu
- Standardschriftarten festlegen
- Standardfarben festlegen
- Fügen Sie einen Abschnitt in voller Höhe hinzu
- Fügen Sie Videohintergründe hinzu
- Verwenden Sie benutzerdefinierte Positionen für Bildhintergründe
- Seitenlayout-Einstellungen ändern
- Fügen Sie Parallax-Effekte hinzu
Lass uns anfangen!
1. Verwenden Sie den Finder

Wenn Sie eine Weile brauchen, um 'Finder' zu verwenden, können Sie nicht widerstehen, es zu verwenden. Weil es einen Platz ganz oben auf der Speisekarte einnimmt. Unter den fortgeschrittenen Tipps und Tricks von Elementor ist die Verwendung des Finders am besten geeignet.
Finder macht es super einfach, zwischen Elementor-Seiten und Ihren Dashboard-Einstellungen in Elementor zu wechseln. Indem Sie die Tipps und Tricks verwenden, müssen Sie Elementor nicht ständig schließen und die Seite erneut in WordPress durchsuchen.
Sie können viel Zeit sparen, wenn Sie den Finder überall in WordPress verwenden. Diese Funktion hilft Ihnen, direkt zu jeder Elementor-Vorlage, Seite, Einstellungen oder einem Teil eines Themas zu springen, indem Sie in der Suchleiste suchen. Greifen Sie über die Elementor-Einstellungen oder mit den Tasten Cmd/Strg + E auf den Finder zu.
2. Verwenden Sie die Elementor-Vorlagen
Klick hier

Vorlage auswählen

Dieser unter den fortgeschrittenen Tipps und Tricks von Elementor ist ein bisschen offensichtlich, aber wir können ihn erwähnen. Das Rad muss nicht jedes Mal neu erfunden werden. Sie haben noch kein Design für eine Website oder sind mit Elementor noch nicht ganz vertraut, keine Sorge! Verwenden Sie einfach eine Standardvorlage, die von der Elementor-Bibliothek bereitgestellt wird.
Sie können eine Seite mit Elementor bearbeiten, indem Sie die Vorlage einfach finden. Klicken Sie einfach auf das „Ordner“-Symbol und die Bibliothek wird sofort angezeigt. Zweifellos finden Sie schönere Vorlagen, wenn Sie mit diesem Schlüsselwort „Elementor-Vorlagen“ in Google suchen. Sie können diese fortgeschrittenen Tipps und Tricks von Elementor für Ihre Arbeit anwenden.
3. Arbeiten Sie mit dem Navigator

Der Elementor Navigator hilft Ihnen, ganz einfach den Überblick über Ihre Seite zu behalten. Außerdem können Sie den Navigator verwenden, um Abschnitte/Spalten/Widgets einfach an einen anderen Ort zu verschieben. Von allen fortgeschrittenen Tipps und Tricks zu Elementor können Sie dies als bessere Wahl verwenden.
Wenn Sie lange Seiten erstellen möchten, ist Navigator für diesen Job sehr nützlich. Navigator ist die am wenigsten genutzte Funktion von Elementor, mit der Sie im Grunde von einem kleinen Bedienfeld aus durch Ihre gesamte Seite navigieren können.
Sie können mit Navigator auf jedes Element zugreifen, indem Sie darauf klicken. Sie können die Widgets einfach in einem Abschnitt sehen und sie auch direkt aus dem Navigator löschen.
Unten links in Ihrem Elementor-Bedienfeld sehen Sie die Schaltfläche Navigator, Sie müssen nur darauf klicken, um sie zu öffnen. Es gibt eine andere Möglichkeit, dies zu tun – klicken Sie mit der rechten Maustaste auf das Widget und wählen Sie Navigator.
4. Verwenden Sie die Hotkeys oder Shortcuts

Müssen Sie schnell zwischen Seiten oder Einstellungen wechseln? Oder müssen Sie schnell Seiten gestalten, etwas speichern, eine Änderung rückgängig machen, die Elementor-Bibliothek öffnen oder den Finder verwenden?
Sie können eine Reihe von Tastenkombinationen verwenden, um Dinge schnell zu erledigen, wenn Sie mit Elementor arbeiten. Erweiterte Tipps und Tricks von Elementor haben eine bemerkenswerte Funktion wie die Verwendung von Verknüpfungen.
Steigern Sie Ihre Produktivität, indem Sie einfache Aufgaben mithilfe von Verknüpfungen schnell erledigen. Tatsache ist, dass Shortcuts Ihre Arbeit zweifellos einfacher und viel schneller machen. Sie können Ihren Designprozess beschleunigen, da Verknüpfungen in den Seitenersteller integriert sind. In Elementor erhalten Sie viele erweiterte benutzerdefinierte Verknüpfungen.
Tipp: Sie können die Liste aller Shortcuts sehen, indem Sie das Shortcuts-Referenzblatt mit 'Cmd/Strg + ?' öffnen.
Hier ist die Liste der verschiedenen Shortcuts, die in Elementor verfügbar sind:
Aktionsverknüpfungen:

Gehen Sie zu den Verknüpfungen:

5. Speichern Sie Ihre Elementor-Vorlagen

Nehmen wir an, Sie haben für sich oder für einen Kunden ein schönes Design erstellt und möchten dieses später wieder auf Ihrer eigenen Website mit Elementor verwenden. In diesem Fall müssen Sie es als Vorlage über die Schaltfläche „Veröffentlichen/Aktualisieren“ speichern, wie unten links dargestellt.
Dies bietet Ihnen den Vorteil, dass Sie es nicht für jede Instanz erneut entwerfen müssen. Auch hier fühlen sich die Benutzer in Bezug auf Geschwindigkeit und schnellen Zugriff frei. Sie können Ihre gespeicherten Vorlagen wie jede andere Vorlage einfügen.
Wenn Sie einen Abschnitt als Vorlage speichern möchten, gehen Sie wie folgt vor:
- Öffnen Sie Elementor und klicken Sie mit der rechten Maustaste auf den Abschnitt
- Klicken Sie auf „Als Vorlage speichern“.
- Geben Sie Ihrer Vorlage einen Namen und Sie sind fertig.
Wenn Sie jedoch eine ganze Seite als Vorlage speichern möchten, befolgen Sie die nachstehenden Anweisungen:
- Klicken Sie auf das grüne Pfeilsymbol neben der Schaltfläche „Veröffentlichen/Aktualisieren“.
- Klicken Sie auf die Option „Als Vorlage speichern“.
- Geben Sie Ihrer Vorlage einen Namen und sie wird gespeichert.
Alle Vorlagen, einschließlich der Abschnitts- und Seitenvorlage, werden in der Elementor-Vorlagenbibliothek gespeichert. Mit Elementor können Sie auch Vorlagen exportieren. Um dies zu erhalten, gehen Sie in Ihrem WordPress-Dashboard zu Elementor>Gespeicherte Vorlagen.
Auf dieser Seite können Sie Ihre gespeicherten Vorlagen im JSON-Format herunterladen. Sie können diese Vorlagen dann auf jeder anderen Website verwenden, ohne die gesamte Vorlage erneut erstellen zu müssen.
6. Finden Sie zuerst die Lösung in Elementor

Wenn Sie in einem Problem stecken bleiben und Stunden damit verbringen, ein Plugin für die Lösung auf der Website zu suchen, dann finden Sie die Lösung in Elementor. Erstaunlicherweise finden Sie hier die Lösung, da Elementor viele Plugins auf Ihrer Website ersetzt.
Wenn Sie sich für Elementor- und Element Pack-Plugins entscheiden, müssen Sie sicherlich nicht nach anderen Plugins für normale Websites suchen. Sie können einige großartige Vorteile erzielen, wenn Sie Elementor Pro neben Element Pack als Pro-Version betrachten.
7. Verwenden Sie globale Widgets effizient
Klicken Sie zunächst hier

Geben Sie dann einen Namen ein und klicken Sie auf „Speichern“.

Wenn Sie es gewohnt sind, Widgets per Kopieren/Einfügen wiederzuverwenden, können Sie mit globalen Widgets beginnen, um Ihren Arbeitsprozess zu beschleunigen. Elementor hat eine Funktion namens „globale Widgets“, mit der Sie ein Widget definieren und auf verschiedenen Seiten verwenden können.
Sobald ein Widget als global definiert ist, wirken sich daran vorgenommene Änderungen auf alle Seiten aus, auf denen das Widget hinzugefügt wird. Wenn Sie eine Website mit vielen Seiten haben, die dasselbe Widget haben, betrachten Sie es als goldenes Feature, dh: eine CTA-Schaltfläche, Testimonials usw.
Sehen wir uns an, wie Sie ein globales Widget in Elementor verwenden können:
- Klicken Sie mit der rechten Maustaste auf das Widget und klicken Sie auf „Als global speichern“.
- Geben Sie Ihrem Widget einen Namen und klicken Sie auf „Speichern“.
Sie sehen einen gelben Rand um das Widget, nachdem Sie es in ein globales Widget umgewandelt haben, und können es wie andere normale Widgets bearbeiten. Sie können Ihr globales Widget von der globalen Registerkarte in Elementor zu verschiedenen Seiten hinzufügen und es bei Bedarf verwenden, um Konflikte zu vermeiden.
8. Laden Sie Ihre eigenen Schriftarten hoch

Sie können beeindruckende Seiten mit Schriftarten aus einer riesigen Sammlung von Google Fonts erstellen. Wenn Sie sich jedoch von der Masse abheben möchten, können Sie benutzerdefinierte Schriftarten verwenden.

Sie können Ihre eigenen Schriftarten in Elementor hochladen und auf Ihren Seiten verwenden. Dies ist eine erstaunliche fortgeschrittene Elementor-Tipps und Tricks, die Sie verwenden können.
Der Prozess zum Hochladen benutzerdefinierter Schriftarten in Elementor:
- Gehen Sie in Ihrem WordPress-Dashboard zu Elementor > Benutzerdefinierte Schriftarten.
- Klicken Sie auf der Seite mit benutzerdefinierten Schriftarten auf „Neu hinzufügen“, um Ihre benutzerdefinierte Schriftart hochzuladen.
- Sie müssen die Schriftart in diesen Formaten hochladen: .woff, .woff2, .ttf, .svg, .eot usw.
Sie können einen Schriftartkonverter verwenden, um verschiedene Formate zu erstellen, wenn Sie nicht alle Formate Ihrer Schriftart haben. Stellen Sie sicher, dass Sie alle Variationen Ihrer Schriftarten hochladen. Sie können die Stärke und den Stil der Schriftart auswählen, während Sie benutzerdefinierte Schriftarten hochladen.
9. Fügen Sie Ihren Widgets/Abschnitten eine Eingangsanimation hinzu

Im Online-Markt ist UX ein zentrales Thema. Wenn Sie Ihren Benutzern eine ansprechende und reibungslose UX bieten, werden sie auf Ihre Website stürmen. Sie können die gesamte UX Ihrer Website ändern, indem Sie sogar einige subtile visuelle Elemente hinzufügen. Es ist ein großartiger Elementor für fortgeschrittene Tipps und Tricks.
Sie können dies einfach tun, indem Sie Ihren Widgets und Abschnitten Eingangsanimationseffekte hinzufügen. Elementor bietet viele Funktionen, um Ihren Widgets Animationen hinzuzufügen.
Wie können Sie in Elementor einen Eingangsanimationseffekt hinzufügen? Folge diesen:
- Wählen Sie das Widget aus und gehen Sie zu Erweitert > Bewegungseffekte.
- Wählen Sie auf dieser Registerkarte aus vielen Optionen die Eingangsanimation für Ihr Widget aus.
- Legen Sie die Animationsdauer und -verzögerung fest.
10. Fügen Sie Formteiler hinzu

Formteiler sind allgemeine Merkmale, die oben/unten in einem Abschnitt hinzugefügt werden, und ich glaube, dass Sie sie verwendet haben. Es sind erstaunliche Elementor-Tipps und Tricks für Sie. Sie können Ihre Seiten attraktiv gestalten, indem Sie Formteiler hinzufügen, anstatt einfache Teiler zu verwenden, die viel besser aussehen.
Befolgen Sie die Anweisungen, um einen Formteiler hinzuzufügen:
- Wählen Sie den Abschnitt aus, in dem Sie einen Formteiler hinzufügen möchten
- Gehen Sie zu Stil > Formteiler
- Wählen Sie die Anzeige am oberen oder unteren Rand des Abschnitts aus
Es gibt mehr als 15 Formteiler, aus denen Sie wählen können. Sie können die Farbe anpassen, die Höhe ändern, die Trennwand umdrehen und die Formtrennwand nach vorne bringen, sobald Sie Ihre bevorzugte ausgewählt haben.
11. Fügen Sie Ihren Bildern Filtereffekte hinzu
Klicken Sie zunächst hier

Dann ändern Sie, wie Sie wollen

Grundlegende Bildanpassungen, dh: Ändern der Ausrichtung, Bildgröße und -breite können in Elementor vorgenommen werden. Sie können grundlegende Bildbearbeitung in Elementor durchführen. Es ist ein nettes Elementor für fortgeschrittene Tipps und Tricks, die für Sie geeignet sind.
Mit CSS-Filtern auf der Registerkarte „Stil“ des Bild-Widgets können Sie Ihre Bilder grundlegend bearbeiten. Sie können die Helligkeit, den Kontrast, die Sättigung und den Farbton des Bildes anpassen. Sogar Sie können das Bild unkenntlich machen und alles ändern, was Sie brauchen, damit es auf der Seite besser aussieht.
12. Legen Sie Standard-/globale Schriftarten fest

Es kommt häufig vor, dass Sie die Schriftart jedes Mal ändern müssen, wenn Sie eine Seite erstellen. Dies wird nicht passieren, wenn Sie diese erweiterten Tipps und Tricks von Elementor verwenden und eine Standardschriftart Ihrer Website festlegen, die auf jeder neuen Seite angezeigt wird, und Sie müssen sich nicht darum kümmern.
Sie können die Standard-/Global-Schriftart Ihrer Website auswählen. So können Sie dies tun:
- Klicken Sie in Elementor auf das Hamburger-Menü oben links, um das Konfigurationsmenü für Stil und Einstellungen zu öffnen.
- Hier sehen Sie eine Option für Standardschriftarten. Klicken Sie auf diese Option und legen Sie die Standardschriftarten fest. Sie können verschiedene Schriftarten für die primäre Überschrift, die sekundäre Überschrift, den Haupttext und den Akzenttext auswählen.
Sobald Sie die Standard-/globalen Schriftarten ausgewählt haben, werden sie automatisch auf jeder neuen Seite oder beim Bearbeiten einer Seite ausgewählt. Beachten Sie, dass die Standardschriftarten nicht funktionieren, wenn Sie explizit eine Schriftart angewendet haben.
13. Stellen Sie Standard-/globale Farben ein

Unter den erweiterten Tipps und Tricks von Elementor ähnelt dies den Standard-/Global-Schriftarten. Sie können Standard-/globale Farben festlegen, wie Sie die Standardschriftarten festgelegt haben. Aber im Gegensatz zu den Standardschriftarten fügt diese Funktion die von Ihnen gewählten Farben einfach der Farbauswahl-Voreinstellung von Elementor hinzu.
Dennoch ist dies eine nützliche Funktion, da Sie nicht jedes Mal einen Farbcode kopieren und einfügen müssen.
Um Standardfarben festzulegen, müssen Sie:
- Klicken Sie oben links auf das Hamburger-Menü von Elementor und dann auf Standardfarben.
- Wählen Sie die Standardfarben.
Sie können Primär-, Sekundär-, Körper- und Akzentfarben auswählen. Es gibt vorgefertigte Paletten, die Sie auch als Ihre Standardfarben auswählen können.
14. Fügen Sie einen Abschnitt in voller Höhe hinzu

Sie können einen Abschnitt hinzufügen, der den gesamten Browserbildschirm abdeckt. Dies ist auch eine gute Wahl unter den fortgeschrittenen Tipps und Tricks von Elementor. Mit Elementor können Sie ganz einfach einen Abschnitt in voller Höhe erstellen.
Führen Sie dazu die folgenden Schritte aus:
- Wählen Sie den Abschnitt aus, den Sie in voller Höhe erstellen möchten.
- Klicken Sie in den Layouteinstellungen auf die Höhe.
- Stellen Sie es ein, indem Sie auf „An Bildschirm anpassen“ klicken.
Du bist fertig! Dadurch wird der gesamte Abschnitt automatisch an den Browserbildschirm angepasst.
15. Fügen Sie Videohintergründe hinzu

Einer der fortgeschrittenen Tipps und Tricks von Elementor ist das Hinzufügen von Videohintergründen. Sie können Ihrer Seite ganz einfach atemberaubende Videohintergründe hinzufügen.
Um Videohintergründe in Elementor hinzuzufügen, müssen Sie:
- Wählen Sie den Abschnitt aus
- Gehen Sie zu Stil > Hintergrund
- Ändern Sie den Hintergrundtyp in den Hintergrundeinstellungen in ein Video.
- Wählen Sie ein Video aus
- Fügen Sie den Link zum Video hinzu, legen Sie die Start- und Endzeit des Videos fest.
Es besteht auch die Möglichkeit, ein Fallback-Image auszuwählen. Dieses Bild ersetzt das Hintergrundvideo auf Tablets und Mobilgeräten.
16. Verwenden Sie benutzerdefinierte Positionen für Bildhintergründe

Anfänger wissen nicht, wie man die Position eines Hintergrunds richtig einstellt, und das ist eines der größten Probleme. Keine Sorgen! Die Verwendung benutzerdefinierter Positionen für Bildhintergründe ist einer der fortgeschrittenen Tipps und Tricks von Elementor, mit denen das Problem gelöst werden kann.
Es gibt Optionen, mit denen Sie die Position für den Bildhintergrund festlegen können. Wenn Ihr Hintergrundbild immer noch nicht positioniert ist, können Sie eine benutzerdefinierte Position festlegen.
Dazu müssen Sie diese Anweisung unten befolgen:
- Gehen Sie zu den Stileinstellungen des Hintergrundbilds
- Klicken Sie auf Positionseinstellungen
- Wählen Sie Optionen aus, z. B.: Oben links, Oben rechts, Mitte links usw.
Es gibt eine weitere Option für die benutzerdefinierte Position. Mit dieser Option können Sie die x- und y-Position des Bildes einfach festlegen. Dies ist sehr hilfreich, um den Abschnitt richtig an die anderen Positionsoptionen anzupassen. Sie können diese Option verwenden, um ein Bild für mobile Geräte zu positionieren.
17. Seitenlayouteinstellungen ändern

Viele neue Elementor-Benutzer sind sich dieser weiteren Funktion nicht bewusst. Dies ist einer der fortgeschrittenen Tipps und Tricks von Elementor. Sie können das Layout Ihrer Seite mithilfe der Seitenlayouteinstellungen anpassen.
So ändern Sie Ihr Seitenlayout:
- Klicken Sie unten links auf die Schaltfläche Einstellungen
- Wählen Sie die allgemeinen Einstellungen
- Ändern Sie das Seitenlayout, dh: Standardlayout, Elementor Canvas, Elementor Full Width.
Mal sehen, was diese Layouts tun:
- Standardlayout: Das Standardlayout enthält das Seitenlayout Ihres Designs.
- Elementor Canvas: Mit Elementor Canvas können Sie bei Null anfangen und Ihre Seite von einer leeren Leinwand aus gestalten.
- Elementor Full Width: Elementor Full Width macht den Inhalt in voller Breite. Es ermöglicht das Design von Grund auf neu, einschließlich der Kopf- und Fußzeile.
18. Fügen Sie Parallax-Effekte hinzu

Ein weiterer erstaunlicher Tipp von Elementor für fortgeschrittene Tipps und Tricks ist das Hinzufügen von Parallax-Effekten. Es macht die Seite ansprechender und benutzerfreundlicher. Abgesehen davon, dass es ein Designmerkmal ist, schafft es eine ansprechende Umgebung und bietet eine zufriedenstellende UX.
Mit den neu eingeführten Bewegungseffekten von Elementor können Sie verschiedene Parallaxeneffekte hinzufügen. Es gibt zwei Arten davon:
- Scroll-Effekte: Dies sind die Effekte, wenn Sie auf der Seite scrollen. Vertikale und horizontale Bildlaufeffekte können hinzugefügt werden.
- Mauseffekte: Es kann helfen, ein Gefühl von Tiefe zu erzeugen. Es bewirkt, dass sich das Element in Bezug auf die Bewegung der Maus bewegt.
So fügen Sie Parallaxeneffekte hinzu:
- Wählen Sie das Widget aus, dem Sie den Effekt hinzufügen möchten.
- Gehen Sie zu Erweitert > Bewegungseffekte.
- Aktivieren Sie diejenige, die Sie auswählen möchten, und passen Sie sie nach Ihren Wünschen an.
Transparenz, Unschärfe, Skalierung, Drehung und andere Eigenschaften dieses Widgets können leicht angepasst werden.
Fazit
Dies sind einige coole fortgeschrittene Tipps und Tricks zu Elementor, die ich oben für Sie besprochen habe. Ich hoffe, dies wird Ihnen helfen, Ihre Arbeit ziemlich zu beschleunigen.
Wir sehen uns wieder. Einen schönen Tag noch!