1. WebsitePlanet
  2. >
  3. Blog
  4. >
  5. Elementor-Test 2021: Ist der Hype gerechtfertigt?

Elementor-Test 2021: Ist der Hype gerechtfertigt?

Andrea Schlottman Andrea Schlottman

Ich geb’s ja zu – als ich von der Redaktion gebeten wurde, diesen Elementor-Test zu schreiben, war ich nicht gerade hoch erfreut. In der Vergangenheit habe ich schon viele kostenlose WordPress-Builder ausprobiert. Mit keinem habe ich es lange ausgehalten. Ich hatte immer das Gefühl, dass sie mich als Webdesignerin einschränken.

Ich hatte natürlich gehört, dass Elementor ein toller WordPress Page und Site Builder sein soll, aber ich war trotzdem skeptisch. Wie gut kann so etwas wirklich sein? Nun – nachdem ich ein paar Wochen damit gearbeitet habe, kann ich Dir eins verraten: besser als erwartet. Sogar VIEL besser als erwartet.

Lies weiter und Du erfährst, warum ich meine Meinung geändert und beschlossen habe, Elementor langfristig eine Chance zu geben.

Was ist Elementor?

Elementor homepage

Elementor ist ein kostenloses Website Builder-Plugin für WordPress. Im Wesentlichen bekommst Du eine Drag-and-Drop-Oberfläche für WordPress, mit einem Arbeitsprozess, der demjenigen ähnelt, den beliebte Website Builder wie Wix oder Squarespace ermöglichen.

Du kannst eine vorgefertigte Vorlage wählen oder eine funktionsreiche Website selbst erstellen, mit Elementen, die Du an beliebiger Stelle platzieren kannst – Programmierkenntnisse benötigst Du dafür nicht.

Hast Du Elementor installiert,

  • kannst Du neue Seiten oder eine neue Website erstellen, wobei Du Stil, Layout und Funktionen nach Deinen Bedürfnissen frei wählen kannst. Du bist nicht auf das Angebot Deines aktuellen WordPress-Themes beschränkt;
  • kannst Du Dein aktuelles Theme behalten, da Elementor mit allen WordPress-Themes funktioniert (vorausgesetzt, Du hast die WordPress-Version 5.0 oder höher);
  • bekommst Du einen vollkommen separaten (und viel intuitiveren) Editor, mit dem Du arbeiten kannst: Du bist nicht gezwungen, die native Bearbeitungsoberfläche von WordPress zu verwenden;
  • bearbeitest Du Deine Seiten oder Deine Website vom Frontend aus. Das bedeutet: Du siehst genau das, was Deine Besucher in ihrem Browser sehen – Du musst nicht ständig Entwürfe und eine Vorschau speichern;

Natürlich gibt es andere Builder, die ähnliche Funktionen anbieten. Die haben aber in der Regel einen großen Nachteil: Entweder gibt es tolle Bearbeitungsfunktionen, aber kein kostenloses Abo oder es gibt ein kostenloses Abo, aber mit viel weniger Vorlagen (die auch noch weniger gut aussehen).

Elementor gibt Dir wirklich Freiheit – in mehr als einer Hinsicht. Sehen wir uns genauer an, was Du damit anstellen kannst.

über 300 vorgefertigte Templates

Als professionelle Designerin bin ich mit den Vorlagen von Elementor einverstanden! Auch wenn Du kein Auge für Design hast, kannst Du damit mühelos schöne, professionell aussehende Websites erstellen. Es gibt zwei Vorlagentypen: Seitenvorlagen in voller Länge (Seiten) und kleinere, einzelne Elemente (Blöcke).

Eine Seite verwenden

Am einfachsten beginnt man mit Elementor, indem man eine vorgefertigte Vorlage verwendet. Elementor hat mehr als 150, von denen 40 kostenlos erhältlich sind. (Leider kannst Du nicht nach „kostenlos“ filtern. Stattdessen musst Du manuell nach dem kleinen „Pro“-Tag in der Ecke einer Vorlage Ausschau halten.)

Wenn Du mehrere Seiten mit unterschiedlichen Layouts in einem einheitlichen Look erstellen möchtest, kannst Du Seiten aus einer Familie wählen. Die heißen bei Elementor „Kits“, aber es gibt keine Möglichkeit, in der eigentlichen Bibliothek nach „Kits“ zu suchen. Stattdessen suchst Du nach Vorlagen, die jeweils auf denselben Namen enden, wie Reisen oder Digitalagentur. Das Kit Travel hat zum Beispiel sieben Seiten inklusive „Über“, „Galerie“ und FAQ, die alle zusammen toll aussehen.

Noch mehr Vielfalt bekommst Du, wenn Du Elementor-Seitenvorlagen von Drittanbietern wie ThemeForest importierst.

Du hast lieber die volle Kontrolle über Dein Design? Dann kannst Du auf Vorlagen auch ganz verzichten und Deine Seite von Anfang an selbst erstellen.

Expertentipp: Standardmäßig werden Elementor-Vorlagen im Textkörper Deiner Seite platziert. Das bedeutet, die Kopf-, Fuß- und Seitenleistenelemente Deines Themes bleiben sichtbar. Je nachdem, welches Theme und welche spezifische Vorlage Du verwendest, kann diese Kombination ziemlich eigenartig aussehen.

Um die Elemente zu entfernen und mit einem vollständig leeren Blatt zu beginnen, wechselst Du zu den Einstellungen und schaltest die Seitenlayout-Einstellung auf „Elementor Canvas“ um.

Setting up a Blank Canvas page template on Elementor

Einen Block verwenden

Vorlagen kannst Du nicht nur für vollständige Seiten, sondern auch für kleinere, einzelne Elemente verwenden. Diese Elemente heißen Blöcke.

Bei Elementor gibt es über 200 vorgefertigte Blöcke für Preistabellen, Referenzen, „Meet the Team“-Layouts, Portfolios und mehr.

Elementor page templates

Wie bei den Vorlagen gibt es einige Contentblöcke gratis, während „Pro“-Blöcke kostenpflichtig sind.

Expertentipp: Wenn Du die gleichen Elemente auf verschiedenen Seiten wiederverwenden möchtest, kannst Du Deine eigenen Vorlagen erstellen:

Außerdem kannst Du Deine Vorlagen exportieren und auf anderen WordPress-Seiten verwenden. Diese Funktion ist vor allem dann hilfreich, wenn Du Websites für Kunden erstellst.

Ein Widget ziehen

Im Unterschied zu Blöcken sind Widgets kleinere, eher eigenständige Elemente wie Texte, Bilder, Titel und Karten. Du kannst beliebig viele Widgets auf eine Seite ziehen.

Bei Elementor gibt es 30 kostenlose Widgets (und über 50 weitere, für die Du zahlen musst). Von der gleichen Toolbar auf der linken Seite kannst Du auch die nativen Widgets von WordPress einfügen. Je nachdem, wie flexibel Dein WordPress-Theme ist, schaffst Du es vielleicht, den Dir vorschwebenden Look und Deine Wunschfunktionen ausschließlich mit kostenlosen Widgets von Elementor und WordPress zu erzeugen.

Den Drag-and-Drop-Editor verwenden

Hast Du Dich für eine Vorlage entschieden und alle gewünschten Inhaltsblöcke und Widgets hinzugefügt, kannst Du mit dem Editor in jedes beliebige Element auf der Seite klicken und lokale Änderungen daran vornehmen.

Elementor ist ein so gennantes WYSIWYG-Tool (What You See Is What You Get – was Du siehst, ist schon das Ergebnis). Du musst also nicht auf die Schaltfläche „Vorschau“ klicken oder den Modus wechseln, wenn Du Deine Bearbeitungen sehen möchtest. Du siehst die Änderungen, während Du sie vornimmst. Für die Besucher Deiner Website sind sie aber erst dann sichtbar, wenn Du auf die Schaltfläche „Publish“ (Veröffentlichen) klickst.

Expertentipp: Wartungsmodus

Wenn Du Deine Website gerade erstellst oder aktualisierst, kannst Du mit dem integrierten Wartungsmodus von Elementor eine temporäre Seite anzeigen und den für Dich korrekten HTTP-Statuscode setzen lassen. Auf diese Option kannst Du über Dein WordPress-Dashboard zugreifen.

Switching your WordPress site to Maintenance Mode using Elementor

Im Wartungsmodus musst Du Dir keine Sorgen darüber machen, dass Du versehentlich Änderungen veröffentlichst, bevor die Website fertig ist. Als temporäre Splash Page kannst Du Dir eine von über zehn Elementor-Vorlagen aussuchen.

Beim Bearbeiten verwendest Du die linke Toolbar zur Feinabstimmung von Farbe, Schriftart, Abständen, Layout und mehr:

Editing text on your webpage using Elementor

Mit dem Drag-and-Drop-Editor kannst Du jedes einzelne Element äußerst fein abstimmen – das gehört zu den Eigenschaften von Elementor, die ich am liebsten mag. Du kannst nahezu jedes Detail der Inhaltsblöcke, Widgets, Texte, Bilder, Spalten und Trennlinien Deiner Website anpassen.

Die (nachstehend dargestellte) Registerkarte mit den erweiterten Funktionen für einige richtig interessante Optionen solltest Du unbedingt ausprobieren:

  • Ränder und Textabstände pixel- oder prozentgenau einstellen
  • Die Breite von Elementen individuell festlegen und feste Seitenpositionen einstellen
  • Widgets, Text oder Bilder innerhalb von Spalten positionieren
  • Breite und Abstand zwischen den Spalten anpassen
  • Erweiterte Bewegungs- und Hover-Effekte hinzufügen
Editing margins and padding with Elementor

Noch ein paar Funktionen, die ich besonders nützlich fand:

  • Mit Rechtsklick in die obere rechte Ecke eines Elements kannst Du Dir alle Bearbeitungsmöglichkeiten anzeigen lassen
  • Du kannst Inhaltsblöcke mit einem Klick duplizieren
  • Mit Strg+Z und Shift+Strg+Z (Mac: Cmd+Z und Shift+Cmd+Z) ist es kein Problem, Änderungen rückgängig zu machen bzw. wiederherzustellen.

Elementor ist mit Übersetzungs-Plugins wie WPML oder Polylang kompatibel und unterstützt die Darstellung von Sprachen, die von rechts nach links gelesen werden (wie Arabisch).[1]

Expertentipp: Wenn Du auf Deiner Website an einer sehr langen oder komplexen Seite arbeitest (etwa an einer mit Elementen innerhalb von Elementen innerhalb von Elementen), kann es schwierig werden, genau die Teile zu finden, die du bearbeiten möchtest oder zu verstehen, wie die vielschichtigen Elemente ineinander greifen.

Die Funktion „Navigator“ wird bald Dein neuer bester Freund sein. Mit Rechtsklick auf ein Element kannst Du sie auswählen. Dadurch wird das Element, auf das Du gerade geklickt hast, im Kontext Deiner gesamten Website lokalisiert; zudem wird automatisch die Bearbeitungsleiste eingeblendet.

Elementor's Navigation feature helps you find the editing bar of each element you wish to edit

Änderungen an der mobilen Version Deiner Website vornehmen

Jede Elementor-Vorlage ist standardmäßig mobil responsiv. Bei Elementor dreht sich alles darum, Dir die Kontrolle über das Design zu geben. Mit der Funktion „Mobile Editing“ (Mobile Bearbeitung) kannst Du genauestens einstellen, wie Deine Website auf Smartphones und Tablets aussieht.

Du kannst die Einstellungen ändern und Elemente ein- oder ausblenden, die Spaltenreihenfolge und -einstellungen ändern und die Ränder je nach Bildschirmgröße ändern. Du kannst sogar unterschiedliche Schriftgrößen für verschiedene Geräte einstellen und dafür sorgen, dass der Text auf Deiner Website immer gut lesbar ist.

Hinweis: Wenn Du Deine Website von Anfang an selbst erstellst, ohne eine Vorlage zu verwenden, wird sie nicht mobil responsiv – mit der Funktion Mobile Editing kannst Du aber eine gesonderte mobile Version erstellen.

Expertentipp: Wenn Du Änderungen an den mobilen Versionen Deiner Website vornehmen möchtest, musst Du nicht zum Mobil-Editor wechseln. Klicke im regulären Desktop-Editor auf die Registerkarte mit dem erweiterten Inhalt eines Elements; dann kannst Du dieses Element in den verschiedenen Versionen ein- oder ausblenden.

Editing your site's mobile version from the Advanced tab in Elementor

Entspanntes Erstellen einer Seite: Versionsverlauf

Manchmal reichen ein, zwei oder sogar drei Rückgängigaktionen nicht aus, um eine Designkatastrophe ungeschehen zu machen. Mach Dir nichts draus, das kann jedem passieren!

Hier kommt das Verlaufspanel ins Spiel. Über dieses Bedienfeld kannst Du Dir entweder unter der Registerkarte „Action“ (Aktion) einzelne Änderungen oder unter der Registerkarte „Revisions“ (Bearbeitungen) ganze Versionen gespeicherter Seiten anzeigen lassen. Mit Klick auf die Schaltfläche für rückgängig machen kannst Du problemlos eine ältere Version Deiner Seite wiederherstellen.

In Kombination mit der automatischen Speicherung von Elementor sorgt das Bedienfeld „Revisions“ dafür, dass Deine Arbeit nie verloren geht.

Niemand ist perfekt: die Nachteile von Elementor

Dir ist wahrscheinlich nicht verborgen geblieben, dass ich Elementor sehr gern benutze. Es gibt aber doch das eine oder andere Problem, über das Du Dir im Klaren sein solltest:

  • Du kannst an jeder Seite nahezu unbegrenzt Änderungen vornehmen. Mehrere globale (für die ganze Website geltende) Styles kannst Du aber nur einstellen, wenn Du ein Premium-Abo abschließt. Einen einheitlichen Look auf allen Seiten herzustellen, kann dadurch für nicht zahlende Benutzer äußerst mühsam werden.
  • Schnell und toll wie er ist, kann der Editor mitunter auch fehleranfällig sein. Wenn er hängen bleibt, musst Du möglicherweise einen harten Neustart durchführen oder den Editor verlassen und erneut aufrufen.

Elementor Free oder Pro: Was ist besser für Dich?

Elementor Pro plans

Das bekommst Du gratis

Elementor zeichnet sich durch sein funktionsreiches kostenloses Abo aus. Für viele private und sogar geschäftliche Websites ist die kostenlose Version mehr als ausreichend. Du kannst benutzerdefinierte Websites und Seiten mit den Basisfunktionen erstellen und die meisten ausgefallenen Designfunktionen nutzen.

Die kostenlose Version von Elementor enthält:

  • Uneingeschränkte Nutzung der Builder-Plattform mit Live-Design, mobilem Bearbeiten, Versionsverlauf etc.
  • Über 30 Widgets für Bilder, Textfelder, Karten, Audiodateien und vieles mehr
  • Über 40 Seitenvorlagen (einschließlich lizenzfreier Stockfotos)
  • Über 100 Blockvorlagen für FAQs, Funktionen, Referenzen, „Meet the Team“ und vieles mehr

Das bekommst Du für Geld

Elementor Pro hat drei kostenpflichtige Abos. Der einzige Unterschied zwischen den Abos Personal, Plus und Expert ist die Anzahl der Websites, die für Dich lizenziert sind.

Einige der attraktivsten Funktionen von Elementor Pro:

  • Über 300 Premium-Vorlagen
  • Über 100 Premium-Blockvorlagen
  • Globale Widgets – Du kannst auf mehreren Seiten Deiner Website immer wieder das gleiche Widget verwenden. Wenn eine Änderung an Deinem Widget nötig wird, musst Du es nur einmal bearbeiten. Es wird dann automatisch auf allen Seiten aktualisiert.
  • Elementor Theme Builder – Du kannst Dein eigenes Theme von Anfang an selbst erstellen und dabei Vorlagen von Elementor für Fußzeilen, Kopfzeilen und vieles mehr verwenden.
  • WooCommerce Builder – ermöglicht Dir, einen Online-Shop mit 18 WooCommerce-Widgets hinzuzufügen.
  • Frontend-Form Builder und Pop-up-Erstellung einschließlich Integration mit MailChimp.
  • Zugriff auf den CSS-Code Deiner Website
  • Premium-Kundensupport rund um die Uhr – Du genießt vorrangigen Support bei Hilfetickets und kannst zulassen, dass sich ein Elementor-Mitarbeiter zur Lösung eines Problems an Deinem Dashboard anmeldet.

Du hast mehrere Unternehmen oder erstellst Websites für Kunden? Mit einem Upgrade auf das Abo „Plus“ erwirbst Du eine Lizenz für drei Websites. Das Abo „Expert“ bietet unglaublich viel fürs Geld. Er kostet doppelt so viel wie das Plus-Abo, aber die jährlichen Kosten halten sich immer noch im Rahmen – und Du bekommst Lizenzen für bis zu 1.000 Websites.

Alle kostenpflichtigen Abos enthalten eine 30-tägige Geld-zurück-Garantie.

Ist der Hype um Elementor also gerechtfertigt?

Die Antwort lautet, kurz und knapp: Ja. Wenn Du die volle Kontrolle über das Aussehen Deiner WordPress-Seite haben möchtest, aber keine Lust hast, Dich lang und breit mit ihrem Code zu beschäftigen, liegst Du mit diesem Plugin goldrichtig. Auch wenn Du das technische Know-how hast, alles selbst zu programmieren, ist die die Gestaltung Deiner Website mit Elementor dermaßen einfach und intuitiv, dass es keinen Grund gibt, darauf zu verzichten.

Schon mit dem Gratis-Abo von Elementor stehen Dir fast alle Möglichkeiten offen. Wenn Du allerdings Websites für Kunden erstellst oder Deine Website der wichtigste Vermögenswert Deines Unternehmens ist, dann empfehle ich Dir ein Upgrade auf eines der Pro-Abos. Du kannst dann ein eigenes Theme erstellen und bekommst das globale Widget – schon deshalb lohnt sich die vergleichsweise geringfügige Investition.

Ist der Elementor Page Builder kostenlos?
Mit dem kostenlosen Abo von Elementor wird Dir viel geboten – es enthält umfangreiche Funktionen zum Erstellen einer Website. Für private Zwecke, ja selbst für viele geschäftliche Zwecke dürfte die kostenlose Version mehr als genug bieten. Du bekommst eine solide Auswahl an Vorlagen und Widgets und kannst den Website Builder mit allen Funktionen – Versionsverlauf, mobile Bearbeitung etc. – ohne Einschränkung nutzen. Sind die Elementor-Vorlagen kostenlos?
Wenn Du ein kostenloses Abo abgeschlossen hast, dann hast Du die Wahl zwischen über 40 kostenlosen, vollständigen Seitenvorlagen mit lizenzfreien Stockfotos und über 100 Gratis-Blockvorlagen für Deine Website wie Referenzen, FAQ, Preistabellen, Portfolios und vieles mehr. Solltest Du Dich für eines der kostenpflichtigen Elementor-Abos entscheiden, bekommst Du Zugriff auf über 300 Premium-Seitenvorlagen und über 100 Premium-Blockvorlagen. Ein kostenpflichtiges Abo dürfte dann das Beste sein, wenn Du mehrere Unternehmen besitzt. Möglicherweise kannst Du auch mit einem unserer aktuellen Rabatte oder Gutscheine noch etwas sparen. Kann ich eine eigene Vorlage auf Elementor hochladen?
Elemtor stellt nicht nur vorgefertigte Vorlagen zur Verfügung – Du kannst auch eine eigene Vorlage von Anfang an selbst gestalten. Das bringt vor allem dann etwas, wenn Du auf verschiedenen Seiten Deiner Website immer wieder die gleichen Elemente verwenden möchtest. Du kannst Deine Vorlage unter der Registerkarte My Templates (meine Vorlagen) speichern und zur Verwendung auf anderen WordPress-Sites exportieren. Das ist ziemlich praktisch, wenn Du Websites für Kunden erstellst. Du hast die WordPress-Version 5.0 oder höher? Dann funktioniert Elementor auch mit allen WordPress-Themes. Du kannst also Dein aktuelles WordPress-Theme behalten, wenn Du das möchtest. Expertentipp: Deine Website soll richtig was hermachen? Dann könntest Du auf Fiverr schon für 4 Euro einen Designer beauftragen. Ist Elementor der beste Website Builder?
Elementor ist ein Drag-and-Drop-Website Builder, der Dir mit einem kostenlosen Abo viel Flexibilität bei der Gestaltung einer Website bietet. Für WordPress-Nutzer, die nicht so auf den regulären Editor von WordPress stehen, ist er eine tolle Alternative. Wenn Du allerdings kein WordPress-Abo hast und Dir auch nicht sicher bist, ob Du eines abschließen solltest, kannst Du Dir andere Web Building-Optionen mit Drag-and-Drop-Funktionen ansehen, die ebenfalls ein Gratis-Abo anbieten. Einige dieser Optionen stehen auf unserer Liste der besten Website Builder für das Jahr 2021 weit oben. Du solltest unbedingt einen Blick darauf werfen.

Diesen Artikel bewerten
4.9 Bewertet von 10 Nutzern
Du hast schon abgestimmt! Rückgängig
Das Feld ist erforderlich Maximal length of comment is equal 80000 chars Die Minimallänge des Kommentars ist 10 Zeichen

Irgendwelche Kommentare?

Auf Review antworten
%s Antworten ansehen
View %s reply

Relevante Beiträge

Mehr relevante Beiträge anzeigen

Wir prüfen alle Nutzerkommentare innerhalb von 48 Stunden, um sicherzustellen, dass sie von einer realen Person stammen. Es freut uns, dass Du diesen Artikel hilfreich fandest. Wir wären Dir dankbar, wenn Du ihn anderen Personen empfehlen würdest.

Diesen Blog-Eintrag jetzt mit Freunden und Kollegen teilen:

Wir sind uns sicher, dass Du damit anderen Nutzern helfen wirst. Unser Team wird das Review prüfen und innerhalb von.

Einmal pro Monat bekommst Du interessante und nützliche Tipps, Tricks und Ratschläge, wie Du die Leistung Deiner Website verbesserst und Deine digitalen Marketing-Ziele erreichst!

Freut mich, dass es Dir gefallen hat!

Mit Deinen Freunden teilen!

369245
100
5000
86233
image#1 Webhoster im Oktober 2021

Tolles Hosting zum
TOLLEN Preis

Hoste Deine Website auf blitzschnellen Servern
und erhalte KOSTENLOS Domain-Namen
sowie E-Mail-Konten