Elementor ist einer der beliebtesten WordPress Page Builder, die es derzeit gibt. Aus gutem Grund: Elementor ist vollgepackt mit Funktionen, die das Erstellen von individuellen Websites einfacher denn je machen. In diesem Beitrag erfährst du alles, was du über Elementor wissen musst.

Wenn du neugierig bist, wie man Elementor benutzt, bist du hier genau richtig. Heute dreht sich alles um Elementor – inklusive Tipps zur Installation und den besten Themes & Add-Ons. Denn gerade zu Beginn kann der Umgang mit Elementor verwirrend sein. Wir schauen uns folgende Themen genauer an:

• Elementor: Was Elementor ist und wie der Page Builder funktioniert
• Vorteile der Verwendung von Elementor als WordPress Page Builder
• Unterschiede zwischen Elementor und Elementor Pro
• Wie du den Elementor Page Builder in WordPress installierst
• Wie du Elementor benutzt: Schritt für Schritt erklärt
• Die besten Elementor Themes und wie du sie verwendest
• Empfohlene Add-Ons für Elementor
• Fazit: Wie du Elementor nutzt – der umfassende Leitfaden

Elementor: Was es ist und wie es funktioniert

Elementor ist ein Plugin zur Erstellung von Websites, welches für WordPress entwickelt wurde. Elementor fügt eine ganze Reihe von Drag & Drop Funktionen hinzu. So erstellen auch Neulinge atemberaubende Websites, die professionell aussehen.

Der größte Vorteil von Elementor ist, dass du eine vollständige Liveansicht deiner Website erhältst – und das während du Änderungen vornimmst.

Elementor schafft ein intuitives Designerlebnis, besonders für Anfänger:innen. Um dies zu erreichen, verwendet das Plugin Dutzende von Widgets, eine vollständige Vorlagenbibliothek und eine Funktion für den Änderungsverlauf. 

Das Core Plugin Elementor ist kostenlos und mit vielen grundlegenden Elementen ausgestattet. Wenn du mehr fortgeschrittene Funktionen benötigst, ist Elementor Pro verfügbar. Diese Premium Version von Elementor hat mehrere Preisstufen, beginnend bei $49/Jahr für eine Website und bis zu $999/Jahr für 1.000 Websites.

Vorteile der Verwendung von Elementor als WordPress Page Builder

Wie du vielleicht schon vermutet hast, hat Elementor einige Vorteile. Lass uns ein paar erkunden, bevor wir uns dem eigentlichen Elementor Tutorial widmen. Einige der wichtigsten Vorteile sind: 

• Einfach zu bedienen. Visuelles Frontend Editing kombiniert mit Widgets macht die Arbeit mit dem Elementor Page Builder unglaublich einfach, selbst für Neulinge. 
• Flexibel und erweiterbar für Developer. Eine robuste Vorlagenbibliothek, ein Block Editor und die vollständige Kontrolle über die Ausgabe bedeuten, dass auch erfahrenere Entwickler:innen lernen können, wie man den Elementor Theme Builder verwendet und damit arbeiten kann. 
• Tonnenweise Optionen für Styling. Du kannst das Editor Panel mit Schiebereglern nutzen, um Einstellungen im Design innerhalb eines komfortablen Bearbeitungsrahmens anzupassen.  
• Globale Widgets, die Zeit sparen. Verändere, passe an, speichere und verwende Widgets über mehrere Websites hinweg. 
• Drag & Drop Theme Erstellung. Erstelle ein Elementor Theme von Grund auf mit den eingebauten Widgets – oder greife auf Elementor Pro Vorlagen zurück, die als Grundlage dienen. 
• E-Commerce Integration. Verwende das Widget Panel, um einen Onlineshop mit der vollen responsiven Kontrolle zu erstellen, die du von anderen Buildern mit WooCommerce Kompatibilität gewohnt bist.
• Eingebaute Marketing Tools. Besonders beim Einstieg in Elementor wirst du direkt folgendes merken: Du kannst Formularstile anpassen, eine Elementor Landingpage erstellen und Plugin Widgets nutzen, um deine Webpräsenz und Marketingstrategie gleichzeitig aufzubauen. 
• Große Drittanbieter Community und Marktplatz. Ein großer Vorteil von Elementor ist die große Developer Community dahinter. Du kannst Stunden damit verbringen, alle Elementor Seitenvorlagen, WordPress Themes und Add-ons zu durchstöbern, die die Kernfunktionen von Elementor erweitern. 

Unterschiede zwischen Elementor und Elementor Pro

Bevor wir weitermachen, ist es wichtig zu erwähnen, dass es eine Pro-Version von Elementor gibt. Mit der kostenlosen Version kommst du schon recht weit, doch wenn du nach noch mehr Funktionen suchst, solltest du Elementor Pro in Betracht ziehen. 

Die kostenlose Version von Elementor enthält alles, was du zum Erstellen einer Website brauchst, einschließlich Funktionen zum Bauen:

• Header 
• Textboxen 
• Bild Widgets 
• Video Widgets 
• Galerie Widgets
• Testimonials 
• Divider Widgets 
• Akkordeon Widgets 

Elementor Pro fügt mehrere Funktionen hinzu, die sich an Unternehmen richten, darunter:

• Formulare 
• Folien 
• Portfolios 
• Preistabellen 
• Bild Karussells 
• Zähler Widgets 
• Pop ups 
• Social Buttons Widgets
• Custom Footer und Header Builder 
• Call to Action

Du kannst auch benutzungsdefinierte Schriftarten und Breakpoints hinzufügen und zahlreiche Premium Widgets nutzen. Hier findest du eine Gegenüberstellung der kostenlosen Version von Elementor und Elementor Pro: 

So installierst du den Elementor Page Builder in WordPress

Um Elementor zu installieren, brauchst du ein installiertes WordPress mit einem Hostingtarif und einem Domain Namen. Wenn du im Dashboard deiner WordPress Website eingeloggt bist, gehe auf Plugins > Add New. 

Suche nach Elementor und installiere es. Klicke dann auf Aktivieren. 

Wenn du dich für Elementor Pro entscheidest (oder vom Basis Elementor Plugin upgraden möchtest), gehe auf der Elementor Website zu Mein Konto und klicke auf den Button Plugin herunterladen. Dies wird eine ZIP Datei auf deinem Computer speichern. 

Als nächstes loggst du dich in dein WordPress Dashboard ein und navigierst zu Plugins > Add New. Lade die ZIP Datei, die du gerade gespeichert hast, auf deinen Computer hoch, klicke auf Installieren und dann auf Aktivieren. Du musst die kostenlose Version des Elementor Plugins installiert und aktiviert haben, damit dies funktioniert. 

Von dort aus musst du deine Lizenz aktivieren. Gehe dazu auf Elementor > Lizenz und klicke dann auf Verbinden & Aktivieren. 

Auf dem nächsten Bildschirm klickst du auf Verbinden und loggst dich dann in dein Elementor Konto ein. 

Du wirst zurück zum Dashboard weitergeleitet. Die Nachricht am oberen Rand des Bildschirms, die dich auffordert, deine Lizenz zu aktivieren, sollte verschwunden sein. 

Wie du Elementor nutzt: Schritt für Schritt erklärt

Nachdem die Installation abgeschlossen ist, ist es nun an der Zeit, dich damit zu beschäftigen, wie du Elementor in der Praxis einsetzt. Elementor empfiehlt, das Envato Elements Plugin zu installieren, das dir eine Auswahl an Elementor Seitenvorlagen im Dashboard zur Verfügung stellt. Stelle sicher, dass du das Standard WordPress Theme installiert und aktiviert hast. 

Um zu beginnen, navigiere zu Elements im WordPress Dashboard. Du kannst zwischen kostenlosen und Premium Template Kits wählen. Entscheide dich für das, was du bevorzugst. Wähle dann ein Template, das zu dir passt.

Scrolle im Vorlagenmenü nach unten und wähle ein Homepage Design aus, das du importieren möchtest. Wiederhole dies für jede spezifische neue Seitenvorlage, die du erstellen möchtest. Viele entscheiden sich oft dafür, damit Seiten wie Über uns, Service und Kontakt zu erstellen – doch das bleibt dir überlassen.

Wenn du deine Seiten erstellt hast, kannst du sie mit Elementor bearbeiten. Gehe dazu auf Seiten > Alle, fahre mit der Maus über die Seite, die du bearbeiten möchtest und klicke auf Mit Elementor bearbeiten. 

Sobald die Seite geladen ist, solltest du den Elementor Editor in Aktion sehen. Auf der linken Seite des Bildschirms siehst du den aktivierten Editor Modus. Und auf der rechten Seite siehst du die Editor Vorschau. Dies ist im Grunde eine Liveansicht deiner Website, die du neu anordnen, umformatieren und direkt bearbeiten kannst. 

Der Inhalt ist im Bearbeitungsmodus in Sektionen unterteilt. Wenn du mit dem Mauszeiger über die Sektionen fährst, sollten sie hellblau hervorgehoben werden. 

Wenn du auf eine Sektion klickst, kannst du den Inhalt darin direkt bearbeiten. Wenn du mit der rechten Maustaste klickst, öffnet sich das Sektionsbedienfeld. Hier kannst du sehen, wie nach einem Klick auf ein Bild in der Vorlage das Bedienfeld für das Bild auf der linken Seite erscheint: 

Die Arbeit mit Widgets ist ein ähnlicher Prozess: Wenn es bereits in der Vorlage vorhanden ist, klicke einfach auf das graue Bleistift Symbol, um den Bearbeitungsmodus für dieses spezielle Widget zu öffnen. Dieser erscheint dann wieder auf der linken Seite.

Wenn du Änderungen an einem Bildkarussell Widget vornehmen möchtest, kannst du es in der vorgefertigten Vorlage anklicken und dann Änderungen an den Einstellungen vornehmen, indem du die Größe, den zugehörigen Text und die Bilder anpasst. 

Während du lernst, wie du Elementor Templates verwendest und dein Seitenlayout nach deinen Wünschen gestaltest, kannst du anfangen, über das Styling nachzudenken. Du kannst Farben anpassen, indem du sie auf globaler Ebene (für deine gesamte Website, wenn du Pro verwendest) und auch auf Widget Basis anpasst. 

Die Farbe des Textes in deinen Überschriften zu ändern ist ein Kinderspiel:

Du kannst die Schriftarten und -größen anpassen, ob der Text einen Schlagschatten hat oder nicht (und dessen Deckkraft), und verschiedene andere Stileinstellungen für Abstände, Ränder und Grenzen. Du kannst sogar die Zeilengröße des Divider Widgets und sein Muster anpassen. 

Du kannst Social Media Icons einfügen, ihre Farbe und Größe anpassen und ihre Platzierung bestimmen. Du kannst auch ihre Form ändern, Spalten hinzufügen und ihre Ausrichtung ändern. 

Der gesamte Arbeitsablauf mit Elementor ist benutzungsfreundlich. Wenn du einen Fehler machst, ist er leicht zu beheben, da du jederzeit deine Revisionshistorie einsehen und mit einem Klick zu einer älteren Version deiner Website zurückkehren kannst. 

Ebenso macht es der Navigator einfach, jeden Abschnitt, inneren Bereich und jedes Widget auf einmal zu sehen, sodass du nicht endlos hoch- oder runterscrollen musst. Die Manipulation jedes Teils deiner Website ist bei Elementor ähnlich. Wähle einen Bereich oder ein Widget aus, nimm Änderungen vor und speichere deine Arbeit. Und wenn du bereit bist, kannst du deine Website veröffentlichen. 

Wenn du mehr Funktionen hinzufügen möchtest oder dir ein noch robusteres Starter Theme wünschst, kannst du Elementor Themes und Add-ons verwenden – genau darauf gehen wir als nächstes ein. Nun, da du die Grundlagen der Nutzung von Elementor verstanden hast, lass uns einen Blick auf einige der beliebtesten Themes werfen, die für die Plattform verfügbar sind. 

Die besten Elementor Themes

• Hello: Hello ist ein kostenloses und einfach zu bedienendes Theme, das für Elementor entwickelt wurde. Hello ist ein echtes Theme für den Einstieg mit Elementor. Hello enthält kein Styling oder Skripte, ist jedoch mit den wichtigsten WordPress Plugins kompatibel. 
• Layers: Elementor hat Layers übernommen, so dass es nun mit dem Plugin kompatibel ist und eine Designauswahl bietet, die für Profis geeignet ist – komplett kostenlos. 
• Astra: Bekannt als das beliebteste WordPress Theme aller Zeiten, ist Astra leicht, schnell und einfach über Elementor anpassbar. Die kostenlose Version ist sehr funktionsreich, aber es gibt auch eine Pro Version, die eine größere Auswahl an vorgefertigten Widgets und Einstellungsmöglichkeiten bietet. Die Preise beginnen bei $47/Jahr.
• Hestia: Hestia ist ein weiteres Theme, das mit Elementor kompatibel ist. Es bietet dir kostenlos ein modernes Design. Du kannst aber auch auf die Pro Version upgraden, um mehr Optionen für Widgets und eine verbesserte Elementor Kompatibilität zu erhalten. Die Preise beginnen bei $69/Jahr.
• GeneratePress: Dieses kostenlose und Open Source WordPress Theme ist eine solide Wahl für die Erstellung jeder Art von Website. Es gibt auch eine Pro Version mit mehr Funktionen, die bei $44/Jahr beginnt. 
• OceanWP: Dieses Premium WordPress Theme bietet volle Elementor Kompatibilität, einschließlich mehrerer Demos, Erweiterungen und Widgets, ab $39/Jahr. 
• Customify: Dieses Theme ist kostenlos. Dank der Integration mit Elementor sowie dem Header & Footer Builder bietet es dir jede Menge Anpassungsmöglichkeiten. Du kannst auch auf die Pro Version upgraden, die ab $59/Jahr für zusätzliche Module, Updates und Support erhältlich ist.
• Neve: Dieses Theme hat ein Mobile First Design, das mit Elementor funktioniert und kostenlos genutzt werden kann. Es gibt eine Pro Version mit noch mehr Funktionen, die ab $59/Jahr erhältlich ist.
• Phlox Pro: Dieses Premium Theme ist auf ThemeForest für $49 erhältlich und beinhaltet über 150 Elementor Vorlagen. 
• Zakra: Dieses Theme ist auf Geschwindigkeit und SEO ausgelegt und enthält über 65 Startvorlagen. Die Pro Version enthält Premium Demos und ein breiteres Set an Features, beginnend bei $59/Jahr. 

Empfohlene Add-Ons für Elementor 

Elementor ist vollgepackt mit Funktionen. Du weißt nun, wie du Elementor Themes nutzen kannst. Du solltest aber auch die verschiedenen beliebten Add-Ons in Betracht ziehen, um die Funktionalität weiter zu erweitern. 

Während du lernst, wie du Elementor verwendest, schau dir gerne folgende Add-ons an:

• Ultimate Addons: Erweitert Elementor um weitere Add-ons, Widgets und Blöcke, ab 55$. 
• Essential Addons für Elementor: Dies ist die beliebteste Elementor Library für Elementor und kommt mit über 70 Optionen, beginnend bei $39.97 für eine einzelne Website. 
• Elementor Pack: Dieses Paket ist vollgepackt mit kostenlosen Elementor Widgets und Add-ons. Die Pro Version bietet noch mehr Widgets sowie Support und Updates, ab $29/Jahr.
• Prime Slider: Mit diesem Add-on kannst du einen Slider im Header und im Hero Bereich deiner Elementor Website erstellen. Du kannst das Plugin kostenlos herunterladen oder dich für die Pro Version entscheiden, die Support und Updates beinhaltet, ab 7,92 $/Jahr.
• ToolKit für Elementor: ToolKit zielt darauf ab, die Erstellung von Elementor Websites dank Leistungsverbesserungen und intuitiveren Admin Tools zu vereinfachen. Du kannst mit diesem Add-on für $49/Jahr auf bis zu drei Websites loslegen.
• Happy Addons: Zu guter Letzt gibt es Happy Addons. Das Add-on fügt neue Widgets, Sektionen und Presets zu Elementor hinzu. Es gibt eine kostenlose Version und eine Pro Version. Letztere kommt mit zusätzlichen Features wie Live Copy, 24/7 Support und Updates. Der Preis beginnt bei $29/Jahr. 

Fazit zum Elementor Page Builder

Elementor wird oft als das beste Page Builder Plugin für WordPress gefeiert. Das hat einen guten Grund: Das funktionsreiche Design, die robuste Community und die Verfügbarkeit von Themes und Add-ons machen Elementor zu einem flexiblen und zugänglichen Weg, eine Website zu erstellen. 

Wenn du lernen willst, wie man Elementor benutzt, musst du mit einem soliden Hosting Tarif beginnen. Wir bei Raidboxes bieten dir WordPress spezifisches Hosting, das eine Vielzahl von Bedürfnissen abdeckt. Wenn du Fragen zu unseren Tarifen hast, wende dich gerne an uns.