Mit Elementor Webseiten erstellen und gestalten

Elementor free und pro

Elementor Pagebuilder

Elementor* ist ein Plugin fĂŒr WordPress. Es bietet unter anderem die Möglichkeit, durch „ziehen und ablegen“  Webelemente, wie z.B. Bilder, Listen, Texte, Videos und hervorgehobene Textboxen einzubauen.

Zudem bietet die Elementor auch vorgefertigte Layouts, die du einfach auf deine Seite importieren und anpassen kannst.

Elementor gibt es kostenlos und als kostenpflichtige Pro-Version*. Die Pro-Version bietet weitere tolle Funktionen, die die Gestaltung erleichtern.

Unterschied zwischen Free- und Pro-Version

FunktionFree-VersionPro-Version
Templates
Responsive Design
Theme-Builder
Schriften lokal einbinden
Popups gestalten
Scroll- und Mouse-Effekte
Formular-Builder

Eine komplette Übersicht der Funktionen, findest du auf dieser Seite: Elementor – Features*

Die Pro-Version kostet aktuell 49 $ pro Jahr fĂŒr eine Website.

Da die Begriffe in der Tabelle ziemlich fachspezifisch klingen, möchte ich diese kurz erlÀutern:

Templates

Templates sind vorgefertigte Seiten (z.B. Teamseite, Startseite) bzw. Bestandteile von Seiten (bspw. Kontaktformular, Info-Box).

Responsive Design

Dies beschreibt die FunktionalitÀt, dass die Website auf jedem GerÀt gut aussieht, sei es PC, Laptop, Smartphone oder Tablet. Und das ganz automatisch.

Elementor bietet auch die Möglichkeit, fĂŒr jedes GerĂ€t andere Elemente zu verwenden und den Aufbau einer Seite anders zu gestalten. So kann man bspw. fĂŒr das Smartphone eine andere Ansicht des Kursplans anzeigen lassen, als fĂŒr die Darstellung auf einem Laptop oder Tablet.

Beispieldarstellung der Tabelle im Elementor-Mobile-Bearbeitungsmodus

Theme-Builder

Einige Bereiche einer Website werden durch das Theme gestaltet. Mit dem Theme-Builder von Elementor hast du die Möglichkeit, dich frei zu entfalten. Als Beispiel:

Rufst du dir diese Seite mit einem PC oder Laptop auf, siehst du oben links das Logo, mittig befindet sich das NavigationsmenĂŒ und rechts siehst du einen „Kontakt“-Button. Mit der Pro-Version von Elementor kann ich den sogenannten Header komplett frei gestalten. Ich kann den Button ausblenden, ganz links darstellen, grĂŒn machen, etc. Ich kann das Logo auch mittig darstellen, es grĂ¶ĂŸer oder kleiner machen oder durch eine kleine Bildergalerie ersetzen.

Und so kann jeder Bereich der Website individuell angepasst werden. Es ist schon eine Art Baukasten – aber auf einem ganz hohen Niveau.

Schriften lokal einbinden

Meiner Meinung nach eine der wichtigsten Funktionen, ist die lokale Einbindung von Schriftarten. Das bedeutet, dass die Schriften nicht von einem fremden Server (bspw. Google) abgerufen werden, sondern lokal auf deiner Website liegen. Bei sehr vielen Websites ist dies nicht der Fall, was lt. aktueller Auslage der DSGVO nicht konform ist. Leider bietet die Free-Version dieses notwendige Feature nicht.

Scroll- und Mouse-Effekte

Diese Effekte bieten deiner Website einen modernen Look. Sorge z.B. dafĂŒr, dass ein eingebundenes Bild beim Scrollen grĂ¶ĂŸer wird oder sich beim „drĂŒberfahren“ mit der Mouse etwas bewegt.

Popups gestalten

Auch wenn Popups teilweise nerven – sparsam eingesetzt können sie den BesucherInnen deiner Website einen Mehrwert bieten, indem du bspw. mit einem Popup auf deinen Newsletter oder eine anstehende Veranstaltung aufmerksam machst. In Elementor Pro gibt es diverse Vorlagen, die man als Grundlage fĂŒr das eigene Popup nutzen kann. Bilder, Farben und Texte lassen sich anpassen und es lassen sich auch zusĂ€tzliche Elemente (bspw. Button) hinzufĂŒgen.

Formular-Baukasten

Hiermit kannst du, wie der Name es vermuten lĂ€sst, Formulare erstellen. Sei es Kontaktformulare oder ein Anmeldeformular fĂŒr deinen Newsletter. Ein Beispiel findest du auf meiner Kontaktseite. Es ist auch die Erstellung von mehreren „Schritten“ möglich, so dass nicht gleich das komplette Formular angezeigt wird, sondern nacheinander weitere Felder angezeigt werden. Besonders bei grĂ¶ĂŸeren Formularen sorgt das dafĂŒr, dass die BesucherInnen nicht von Feldern „erschlagen“ werden.

Video: Wie funktioniert Elementor?

Um dir einen ersten Eindruck ĂŒber die Art und Weise zu verschaffen, wie mit Elementor gearbeitet wird, empfehle ich dir das folgende Video:

YouTube

Mit dem Laden des Videos akzeptierst du die DatenschutzerklÀrung von YouTube.
Mehr erfahren

Video laden

Lohnt sich die Anschaffung?

Das muss man natĂŒrlich fĂŒr sich selbst entscheiden. Die Funktionen, die in der Pro-Version vorhanden sind, lassen sich auch mit verschiedenen kostenlosen Plugins umsetzen.

Ich arbeite sehr gerne mit Elementor Pro, da ich die Funktionen dann gebĂŒndelt an einer Stelle habe und nicht auf verschiedene Plugins angewiesen bin.

Auch finde ich den Preis von ca. 40,00 Euro pro Jahr angemessen. Ich hatte auf meinen Seiten bisher wenig mit Softwarefehlern zu kĂ€mpfen und fĂŒr Fragen gibt es auch deutschsprachige Communitys, u.a. diese Facebook-Gruppe.

Ich hatte auch bereits andere Pagebuilder, wie DIVI getestet, bin aufgrund des modernen Designs, der einfachen Bedienbarkeit und den vielen Möglichkeiten aber bei Elementor hÀngen geblieben.

Elementor installieren

Wenn du Elementor ausprobieren möchtest, kannst du das Plugin direkt ĂŒber die Plugin-Verwaltung von WordPress installieren. Möchtest du mehr Funktionen, so findest du die Pro-Version auf der Website von Elementor*.

WordPress & Elementor testen

Wenn du WordPress und Elementor einmal testen möchtest, ohne gleich deine eigene Website anzupassen, dann kontaktiere mich.

Ich stelle dir dann eine Testseite zur VerfĂŒgung, auf der du dich „austoben“ kannst. Mehr Informationen dazu findest du auch auf der Seite UnterstĂŒtzung benötigt?

Solltest du Fragen zu den Funktionen haben, schreibe einfach einen Kommentar.

Schreibe einen Kommentar

Abonnieren
Benachrichtige mich bei
0 Kommentare
Inline Feedbacks
View all comments

Die mit Sternchen (*) gekennzeichneten Verweise sind sogenannte Provision-Links. Wenn du auf so einen Verweislink klickst und ĂŒber diesen Link einkaufst, bekomme ich von deinem Einkauf eine Provision. FĂŒr dich verĂ€ndert sich der Preis nicht. 

0
Hast du Fragen? Dann schreibe einen Kommentar ;-)x
()
x
Newsletter abonnieren

Erhalte regelmĂ€ĂŸig Informationen zu neuen Tipps und Tutorials.