Beaver Builder vs Elementor - Ein ultimativer Leitfaden und Vergleich (2021)

Biberbauer gegen Elementor

Welches sind zwei der beliebtesten Seitenersteller für WordPress? Wenn Sie nach einem Vergleich zwischen Beaver Builder und Elementor suchen, wissen Sie bereits, dass dies zwei der besten Produkte auf dem Markt sind! Als Endbenutzer, der Ihre Website selbst gestalten möchte, wissen Sie sicher, dass diese Plugins unter den vielen verfügbaren Optionen zu Ihren besten Optionen gehören.

Es gibt jedoch einige Unterschiede was Sie wissen müssen, bevor Sie Ihre Wahl treffen. Beide Produkte haben ihre Nuancen, die Ihre Entscheidung beeinflussen können.

Denn wenn Sie einmal eine Entscheidung getroffen haben, sind Sie meistens auf lange Sicht dabei, es gibt (fast) kein Zurück mehr. Die richtige Wahl zu treffen ist entscheidend! 

Sie müssen sicherstellen, dass Sie den Seitenersteller auswählen, der Ihren Anforderungen und Vorlieben entspricht.

Wenn Sie beispielsweise Seiten mit einem Seitenersteller erstellen und dann zum anderen wechseln, bleibt Ihr Inhalt erhalten, aber Sie erhalten ein unübersichtliches Layout mit überall verstreuten Shortcodes. Es kann sehr mühsam und zeitaufwändig sein, alles wieder aufzubauen.

Wir werden die Funktionen beider Plugins durchgehen und sie vergleichen, damit Sie die richtige Entscheidung treffen können.

Aber vielleicht haben Sie gerade eine Frage im Kopf.

Wenn Sie Page Builder-Plugins verwenden, wird Ihre Site erstellt abhängig warum überhaupt eine verwenden? Lassen Sie uns das im nächsten Abschnitt schnell besprechen. Wenn Sie den Vergleich beschleunigen möchten, können Sie mit den Abschnitten Elementor vs Beaver Builder fortfahren.

Dieser Artikel zum Beaver Builder vs Elementor-Plugin wurde in aktualisiert Mai 2021 Hinzufügen relevanter und wichtiger Informationen und Aktualisierungen, wenn neue Funktionen entwickelt und für beide Produkte freigegeben werden. Sie können sicher sein, dass dieser Artikel die neuesten, unvoreingenommenen Informationen enthält.

Beaver Builder gegen Elementor

Elementor und Beaver Builder sind leistungsstarke Tools zum Entwerfen von Websites. Elementor hat eine kostenlose Version, aber die PRO-Version (49 US-Dollar) zeichnet sich durch einen umfangreichen Satz von Elementen und eine Vorlagenbibliothek aus. Beaver Builder ist aufgrund seiner Einfachheit und seines attraktiven Preises (99 US-Dollar) immer noch eine großartige Alternative.

  Elementor-Logo Biberbauer-Logo
Insgesamt  5 / 5  4.5 / 5
Erster Platz ????  
Preis $ 49 $ 99
Kostenlos Version Ja Ja
Echtzeit-Editor Ja Ja
Frontend / Backend Beide Beide
Zielgruppe Entwickler / Designer / Benutzer / Agentur Web Developer / Designer
Unterstützte Elemente Über 80  31 
Code bereinigen Ja Ja
Vorgefertigte Vorlagen / Layouts Über 300 Über 50
Coole Funktion Dynamischer Inhalt Biber Themer
Performance
Was uns gefallen hat  Sehr leistungsstarke Lösung für die Erstellung von Designs aller Art  Einfache Benutzeroberfläche
   Überlegene Layout-Management-Optionen  Der Inhalt bleibt auch nach Deaktivierung des Plugins erhalten
   Attraktive Preisgestaltung mit Zugang  Einzigartiger Editor-Modus für Kunden
   Der beliebteste Seitenersteller aus einem bestimmten Grund  Ermöglicht die Verwendung von WordPress-Widgets in den Layouts
Was uns nicht gefallen hat    Teurer als die anderen Seitenersteller
     Keine Option zum Rückgängigmachen, Wiederherstellen oder Verlauf
Webseite Besuchen Sie die Elementor-Website Besuchen Sie Beaver Builder 

Was ist ein Page Builder?

Seitenersteller versprechen, die Gestaltung Ihrer Website viel einfacher und unkomplizierter zu gestalten. Im Wesentlichen stellen diese Tools sicher, dass Sie keine technischen Kenntnisse benötigen, wenn es um Dinge wie HTML, CSS oder JavaScript geht.

Mit ihnen können Sie Seiten erstellen und entwerfen, die genau (oder zumindest so nah wie möglich) aussehen, wie Sie es sich vorgestellt haben, ohne mit Code herumspielen zu müssen.

Dies steht im Widerspruch zu dem, was bis vor einigen Jahren die Norm war, Programmierer zu sein oder zumindest gute Kenntnisse der Web-Technologie für die Entwicklung einer Website zu haben!

Mit dem Aufkommen dieser Produkte muss die Webentwickler einstellen scheint ein entfernter Gedanke geworden oder völlig unnötig geworden zu sein.

In Wirklichkeit ist dies nicht der Fall.

Webentwickler und -designer sind nach wie vor die beste Wahl für vollständig benutzerdefinierte Lösungen. Dies bedeutet nicht, dass kein Platz für Seitenersteller vorhanden ist. Beide haben ihre Anwendungsszenarien.

Seitenersteller können Webdesigner effizienter machen.

Das Fazit ist, dass Webdesigner und Seitenersteller auf absehbare Zeit weiterhin nebeneinander existieren werden. Viele Entwickler und Designer verwenden Seitenersteller, um Websites für ihre Kunden zu erstellen.

Es gibt viele Artikel, Diskussionen und Debatten online zu diesem Thema, wenn Sie sich eingehender mit den Unterschieden zwischen der Einstellung von Webdesignern und der Verwendung eines Page Builder-Plugins befassen möchten.

Aber jetzt schweifen wir ab.

Da der Schwerpunkt dieses Artikels auf Beaver Builder vs Elementor liegt, werden wir ein wenig darüber sprechen, warum Sie einen Page Builder verwenden möchten, anstatt einen professionellen Webdesigner einzustellen.

Warum überhaupt einen Page Builder verwenden?

Es gibt viele Gründe, warum Sie ein Page Builder-Plugin verwenden möchten:

Ein Komplettpaket

Zunächst einmal ist ein Seitenersteller wie ein All-in-One-Plugin. Sie haben Schaltflächen, Diashows, Kontaktformulare, Galerien, Inhaltsraster, Schaltflächen zum Teilen von Inhalten usw. in einem Paket. Wenn Sie keinen Seitenersteller verwenden, müssen Sie stattdessen mehrere Plugins installieren, eines für jeden spezifischen Bedarf.

Wenn Ihre Anforderungen steigen, müssen Sie möglicherweise viele verschiedene Plugins installieren. Und wenn Sie sich für Premium-Plugins entscheiden, summieren sich die Lizenzgebühren.

Und dann gibt es die Frage, welches Plugin das beste ist, zusammen mit den Wartungsarbeiten, die mit der Installation so vieler Plugins verbunden sind.

Einfach ausgedrückt, sind Seitenersteller bequem und insgesamt billiger.

Elemente

Vorlagen und Layouts

Der nächste Grund ist der offensichtlichste und auch der Hauptgrund, warum Sie einen WordPress-Seitenersteller installieren möchten: schöne benutzerdefinierte Vorlagen und Layouts.

Während wir Premium-Themen erhalten können, die uns viele Anpassungsfunktionen und -optionen bieten, gibt es meistens nicht viele Themen, die ALLE unsere Designanforderungen erfüllen.

Die meisten von ihnen werden "die meisten" unserer Bedürfnisse erfüllen.

Sie werden immer denken, dass etwas fehlt oder "Ich wünschte, ich könnte dies oder das tun."

Die Lösung? WordPress Page Builder wie Beaver Builder und Elementor Builder.

Es gibt keine Begrenzung für das, was Sie mit einem Seitenersteller erstellen können. Sie können Ihre Seiten beliebig anpassen und in einigen Fällen sogar Ihr gesamtes Thema.

Es gibt auch vorgefertigte Vorlagen, die Ihnen das Leben erleichtern. Diese sind voll entwickelte Websites und Seiten, die Sie NUR mit Ihren Inhalten anpassen müssen.

Layoutvorlagen

Sie müssen nicht wissen, wie man codiert

Obwohl Sie Seitenersteller noch besser machen können, indem Sie individuellere Designs erstellen, indem Sie wissen, wie HTML- und CSS-Codes geschrieben werden, ist dies NICHT erforderlich.

Die meisten Seitenersteller, wie das Elementor- und das Beaver Builder-Plugin, verfügen über eine Drag & Drop-Oberfläche, mit der Sie problemlos Seiten erstellen können, ohne ein einziges Wissen darüber zu haben, was a Tag tut.

Nun, das ist aus dem Weg, lassen Sie uns mit dem Vergleich der Seitenersteller von Beaver Builder und Elementor fortfahren.

Elementor vs Beaver Builder: Die Schnittstelle

Eines der wichtigsten Dinge, die bei der Auswahl einer Anwendung oder Software berücksichtigt werden müssen, ist die Benutzeroberfläche. Während es hauptsächlich um persönliche Vorlieben geht, kann es schwierig sein, eine Anwendung zu verwenden, deren Benutzeroberfläche nicht Ihren Vorstellungen entspricht oder nicht Ihren Wünschen entspricht.

Es muss einfach zu bedienen sein und Ihre Produktivität verbessern.

Wir werden uns also die „Gesichter“ beider Plugins bzw. die Schnittstellen ansehen.

Die Schnittstelle allein macht ein Plugin nicht großartig. Es gibt noch andere Dinge zu beachten, z. B. die Verfügbarkeit von Funktionen und Modulen. Lesen Sie diese daher unbedingt bis zum Ende durch, bevor Sie Ihre Entscheidung treffen.

Aber natürlich kann das Erscheinungsbild und die Benutzererfahrung beim Erstellen einer Website damit ein Produkt herstellen oder beschädigen.

Beginnen wir mit der Benutzeroberfläche von Elementor.

Elementors Schnittstelle

Die Benutzeroberfläche von Elementor ist in zwei Hauptabschnitte unterteilt. Die Seitenleiste links und die Live-Vorschau Ihrer Site / Seite.

Besuchen Sie, um die kostenlose Version von Elementor herunterzuladen

Es funktioniert mit dem Konzept der Blöcke, das Sie in diesem 1-minütigen Video in Aktion sehen können:

VRoPdyk97mg

 Elementor-Schnittstelle

Die Seitenleiste enthält WordPress widgets und Elemente, mit denen Sie Ihre Seiten zusammen mit den Einstellungen erstellen können, die Sie anpassen können.

Sie können Ihren Seiten Elemente hinzufügen, indem Sie sie in die Live-Vorschau ziehen und dort ablegen. Zum Beispiel haben wir auf unserer Beispielseite eine zusätzliche Überschrift hinzugefügt:

Drag & Drop Element oder

Das Bearbeiten von Text ist einfach. Klicken Sie einfach auf ein Textelement auf Ihrer Website und bearbeiten Sie es direkt.

Textbearbeitungselement oder

Sie können Text auch über die Seitenleiste bearbeiten.

Textbearbeitungselement oder Seitenleiste

Schließlich können Sie unten auf zusätzliche Einstellungen zugreifen.

Elementor mehr Schnittstelle

 

  • Allgemeine Einstellungen - Hier können Sie Informationen zur aktuellen WordPress-Seite anzeigen, z. B. den Titel der Seite, das ausgewählte Bild, den Veröffentlichungsstatus und andere.
  • Navigator - Wenn Sie darauf klicken, wird ein Popup-Fenster mit einem Navigationsbaum angezeigt, das die Navigation erleichtert.
  • Geschichte - Wenn Sie zu einer früheren Revision zurückkehren möchten, können Sie hier klicken. Beachten Sie, dass hier nur Änderungen angezeigt werden, die Sie in der aktuellen Sitzung vorgenommen haben.
  • Reaktionsmodus - Ermöglicht es Ihnen, einen Blick darauf zu werfen, wie Ihre Website auf verschiedenen Geräten / Bildschirmauflösungen aussehen wird.

Wenn Sie mit der Maus über ein Element fahren und mit der rechten Maustaste klicken, können Sie auf verschiedene Optionen zugreifen:

Rechtsklick Element oder

Über das Kontextmenü können Sie ein Element löschen, im Navigator anzeigen, als globales Element speichern (nur Pro-Version), duplizieren und vieles mehr.

Nachdem wir die Hauptoberfläche von Elementor gesehen haben, schauen wir uns als nächstes Beaver Builder an.

Beaver Builder-Oberfläche

Die Benutzeroberfläche von Beaver Builder ist minimalistischer als die des Elementor Builders. 

Klicken Sie hier für eine Live-Demo

Wenn Sie keine Zeit haben, sich die Demo anzusehen, zeigt Ihnen dieses 2-minütige Video, das vom Beaver Builder-Team erstellt wurde, schnell die Benutzeroberfläche und das Erstellen von Seiten:

tCNDDQ7Jrs8

Wie Sie im obigen Video gesehen haben, wenn Sie eine WordPress-Seite über Beaver Builder bearbeiten, sehen Sie Folgendes:

Biber-Schnittstelle

Oben in der Leiste von Beaver Builder werden minimale, aber wichtige Informationen zu Ihrer aktuellen Seite angezeigt. Um ein Element hinzuzufügen, klicken Sie auf „+”In der oberen rechten Ecke.

Bibermodule

Um ein Element oder ein „Modul“ gemäß der Terminologie von Beaver Builder hinzuzufügen, können Sie es einfach per Drag & Drop verschieben.

Biber Drag & Drop

Möglicherweise haben Sie bemerkt, dass sich der Texteditor von Beaver Builder geringfügig von dem von Elementor unterscheidet. Aus dem obigen GIF können wir ersehen, dass wir beim Bearbeiten von Texten einen Popup-Editor haben.

Sie können auch auf ein Textmodul klicken, um es zu bearbeiten Pop-up Texteditor.

Biber Texteditor

Wenn Ihnen diese Popup-Fensterfunktion nicht gefällt, können Sie den Texteditor links oder rechts vom Bildschirm ziehen, um ihn zu fixieren. Sobald Sie dies getan haben, können Sie auch eine Inline-Bearbeitung durchführen.

Biber Texteditor angepasst

Beachten Sie, dass durch das Anheften dieses Texteditors auch alles angeheftet wird, sodass es in Bezug auf das Layout wie der Elementor-Builder aussieht.

Biber-Schnittstelle angepasst

Wie Sie von oben sehen können, hat Beaver Builder jetzt das gleiche Layout wie Elementor. Wenn Sie möchten, können Sie es durch Ziehen und Fixieren auf die rechte Seite verschieben.

Schließlich haben wir zusätzliche Einstellungen, indem wir auf den Abwärtspfeil in der oberen linken Ecke des Bildschirms klicken.

Biber zusätzliche Einstellungen

Fazit Fazit

Einer der größten Unterschiede und vielleicht ein Deal-Breaker für andere ist das Fehlen des Bearbeitungsverlaufs von Beaver Builder, um das Rückgängigmachen von Änderungen zu vereinfachen.

Abgesehen von diesem einen Problem bieten beide Plugins identische Layouts und Bearbeitungsleistungen.

In Bezug auf das Aussehen hat Beaver Builder den Vorteil, dass es viel sauberer aussieht, obwohl dies möglicherweise nur eine persönliche Präferenz ist. Das Ziehen und Ablegen von Elementen ist in Beaver Builder auch etwas genauer und einfacher als im Elementor-Plugin.

Module und Widgets

Elementor nennt seine Elemente "Widgets", während Beaver Builder sie "Module" nennt.

Dies sind die Bausteine, mit denen WordPress-Seitenersteller den Inhalt Ihrer Seite erstellen können. Dies sind Texte, Überschriften, Schaltflächen, Galerien und andere Elemente. In den früheren Beispielen haben Sie die Text- und Überschriftenelemente gesehen.

Mal sehen, wie viele andere Elemente diese Plugins zu bieten haben.

Elemente des Elementors: Abschnitte, Spalten und Widgets

Der Elementor-Builder verfügt über drei Arten von Elementen:

  1. Abschnitte
  2. Spalten und
  3. Widgets.

Der Abschnitt ist der höchste in der Builder-Hierarchie. Jede Spalte und jedes Widget ist in einem Abschnitt vorhanden.

Die Spalte ist die zweite in der Hierarchie. Jedes Widget befindet sich in einer Spalte. Die Widgets sind die niedrigsten in der Hierarchie.

Die Widgets sind Ihre Inhalte wie Schaltflächen, Text und Bilder. Die Abschnitte und Spalten dienen zum Erstellen verschiedener Layouts.

Elementor bietet Ihnen 30 Widgets für die kostenlose Version und über 52 WordPress-Widgets für die PRO-Version. Diese Zahlen nehmen ständig zu, wenn neue Versionen veröffentlicht werden. Klicken Sie hier, um die neuesten Zahlen zu überprüfen.

Im folgenden GIF können Sie sehen, wie wir einen Abschnitt hinzugefügt haben. Anschließend haben wir eine zweispaltige Spalte in den Abschnitt eingefügt und schließlich Widgets in die Spalten eingefügt. Sie können einer Spalte mehrere Widgets hinzufügen, die Sie im zweiten GIF sehen, das das Styling zeigt.

Widgets für Element- oder Abschnittsspalten

Das Anwenden von Stilen auf den Abschnitt wirkt sich auf alles darin aus.

Das Gleiche gilt für Spalten, hat jedoch keine Auswirkungen auf Spalten außerhalb und Spalten, die Sie auf ein Widget anwenden, bleiben für sich. Das folgende GIF zeigt dies in Aktion für den Elementor-Builder.

Abschnitte Spalten Widgets Hierarchie

 

 Möglicherweise haben Sie bemerkt, wie Sie mit der rechten Maustaste auf ein Element klicken können, um es zu bearbeiten, zu duplizieren oder zu löschen. Dies ist eine sehr bequeme Aktion.

Element oder Rechtsklick-Menü

Jetzt haben Sie einen guten Überblick über die Elemente von Elementor. Schauen wir uns den anderen an.

Elemente des Biberbauers: Zeilen, Spalten und Module

Wie das vorherige Plugin unterteilt Beaver Builder seine Elemente auch in drei Kategorien:

  1. Reihen,
  2. Spalten und
  3. Module.

Zeilen sind die höchsten in der Hierarchie. Spalten werden in Zeilen und Module in Spalten eingefügt. Module sind Ihr eigentlicher Inhalt, während Spalten und Zeilen wiederum für Layoutzwecke dienen.

Die kostenlose Version von Beaver Builder bietet Ihnen 6 Module, während die Pro-Version Ihnen 30 Module zum Spielen bietet. Es ist ratsam, die Website zu überprüfen, um die aktuellen Module zu bestätigen, die mit beiden Versionen verfügbar sind.

Im folgenden GIF verwenden wir den Builder, um eine Zeile mit drei Spalten hinzuzufügen und die Spalten mit verschiedenen Modulen zu füllen.

Zeilenspaltenmodul

Das Styling funktioniert genauso wie bei Elementor.

In Zeilen angewendete Stile werden auch in Spalten und Modulen angewendet. In Spalten angewendete Stile wirken sich auf Module aus, und Sie können Modulen individuell bestimmte Stile zuweisen.

Modulstil für Zeilenspalten

Im Gegensatz zu Elementor verfügt Beaver Builder nicht über benutzerdefinierte Rechtsklickoptionen. Sie müssen den Mauszeiger über ein Element bewegen, um Aktionen darauf ausführen zu können.

Rechtsklick Biber

Module und Widgets Fazit

Beide Plugins funktionieren ziemlich gleich.

Beide bieten einfache Möglichkeiten, ein Layout für Ihre Seiten zu erstellen. Elementor macht es jedoch ein bisschen einfacher, indem für jedes Element ein Rechtsklick-Menü angezeigt wird, mit dem Sie direkt in seine Einstellungen springen können.

In Bezug auf die Anzahl der verfügbaren Module scheint Elementor den Vorteil gegenüber Beaver Builder zu haben, insbesondere in der kostenlosen Version.

Styling

Wie Sie bereits gesehen haben, bieten sowohl Elementor als auch Beaver Builder eine differenzierte Kontrolle über die Stiloptionen. Sie können Stile auf Abschnitte oder Zeilen anwenden oder sie optimieren und einzelne Widgets oder Module haben ihren eigenen Stil.

Lassen Sie uns ein wenig mehr auf die Styling-Optionen eingehen.

Elementor-Styling-Optionen

Bevor wir uns die im Editor selbst verfügbaren Styling-Optionen ansehen, werfen wir einen Blick auf die Styling-Einstellungen von Elementor, die in zu finden sind Elementor> Einstellungen.

Elementor-Styling-Optionen

In den Allgemeines In den Einstellungen können Sie konfigurieren, ob die Standardfarben und -schriftarten von Elementor deaktiviert werden sollen. Es wird empfohlen, diese Kontrollkästchen zu aktivieren, um die Stilkonsistenz auf Ihrer Website zu gewährleisten.

Unter dem Stil Auf der Registerkarte können Sie verschiedene andere Designeinstellungen konfigurieren.

Elementor-Einstellungsstil

Wir werden nicht alle diese Punkte behandeln, aber wie Sie sehen können, können Sie auf dieser Seite viele Styling-Optionen optimieren. Kommen wir zu den Styling-Optionen des Editors.

Elementor Basic Style-Optionen

Die verfügbaren Gestaltungsoptionen bleiben für die meisten Elemente in Elementor ziemlich ähnlich. Unten sehen Sie die grundlegenden Stiloptionen für das Überschriftenelement.

Elementor Stile

Übrigens haben Sie vielleicht bemerkt, dass sich der Schriftstil und die Farbe geändert haben - das liegt daran, dass wir gerade die aktiviert haben Deaktivieren Sie die Standardfarben und Deaktivieren Sie die Standardschriftarten in den Einstellungen von Elementor.

Jetzt erbt es die Farben und Schriftarten des Themas, anstatt die benutzerdefinierten zu verwenden (was Sie unseren früheren Beispielen entnehmen können).

Kehren wir zu den Stiloptionen zurück, die uns zur Verfügung stehen. Oben haben wir:

  • Textfarbe
  • Typografie
  • Text Shadow
  • Mischmodus

Erweiterte Stiloptionen für Elementor

Wenn Sie der Meinung sind, dass dies nicht ausreicht, können Sie auf der Registerkarte Erweitert weitere Optionen anzeigen.

Elementor erweiterte Stile

Hier können Sie alles konfigurieren, von benutzerdefinierten Rändern und Auffüllungen über Bildlaufeffekte bis hin zu Hintergrundeinstellungen usw. Sie können auch ein benutzerdefiniertes CSS anwenden, wenn Sie möchten (dies ist nur in der PRO-Version verfügbar).

Eine der einzigartigen Funktionen von Elementor ist die Möglichkeit, benutzerdefinierte Werte für verschiedene Bildschirmgrößen festzulegen.

Fortgeschrittene Reaktionsstile

Auf diese Weise können Sie genauer steuern, wie Ihre Inhalte auf verschiedenen Geräten und Bildschirmauflösungen angezeigt werden.

Styling-Optionen für Beaver Builder

Im Gegensatz zu Elementor erbt Beaver Builder standardmäßig die Schriftarten und Farben Ihres Themas. Dies ermöglicht eine sofort einsatzbereite Konsistenz.

Die Styling-Optionen von Beaver Builder variieren je nach Element, aber im Grunde haben Sie Stil, Trennzeichen, Typografie, und fortgeschritten Optionen.

Stile

Biberstile

Der Style Einstellungen werden angezeigt, wenn Sie eine Zeile bearbeiten, sowie andere Elemente wie Schaltflächen. Sie finden Optionen für:

  • Breite
  • Inhaltsbreite
  • Höhe
  • Farben wie Linkfarbe, Textfarbe, Linkhoverfarbe usw.
  • Hintergrundtyp, Farbe und Deckkraft
  • Grenze

Das Anwenden von Farben wie Text-, Link- und Hover-Farben wird auf jedes Element in der Zeile angewendet. Sie können diese Einstellungen jedoch überschreiben und benutzerdefinierte Werte pro Element festlegen.

Biber fortgeschrittene Stile

In den fortgeschritten Einstellungen, für die Sie Optionen finden können:

  • Abstand
  • Responsive Layout-
  • Sichtbarkeit
  • HTML-Element - Sie können eine benutzerdefinierte HTML-ID und Klasse für ein bestimmtes Element zur weiteren Anpassung festlegen

Sowohl mit Beaver Builder als auch mit Elementor können Sie die Anzeige Ihrer Inhalte auf verschiedenen Geräten optimieren, indem Sie auf das Gerätesymbol neben einer Einstellung klicken (die nur für Einstellungen sichtbar ist, die dies unterstützen).

Biber reagiert

Separator

Biber-Separator-Stile

The Separator ist eine weitere Styling-Option, mit der Sie Ihren Elementen ein verfeinertes Aussehen verleihen können.

Hier finden Sie Optionen für Ihr Trennzeichen. Wenn Sie sich fragen, wie ein Trennzeichen aussieht, sehen Sie sich ein Beispiel oben an - die rote Linie unter der Überschrift im Bild oben. Sie haben Optionen für:

  • Separator-Stil
  • Trennposition
  • Linienstil
  • Linienfarbe
  • Dicke und Breite

Typografie

Typografie im Biberstil

The Typografie Mit den Optionen können Sie steuern, wie Ihr Text angezeigt wird. Diese Einstellung wird normalerweise für die angezeigt Überschrift Modul. Hier haben Sie Optionen für:

  • HTML-Tag
  • Schriftstil, Größe und Gesicht
  • Textfarbe
  • Die Margen

Styling Fazit

Beide Plugins bieten eine Vielzahl von Styling-Optionen und -Konfigurationen. Sie ermöglichen endlose Anpassungen bis zu den kleinsten Details jedes Elements auf einer Seite. Wir sind der Meinung, dass beide Seitenersteller in dieser Hinsicht größtenteils gleichwertig sind.

Vorlagen

Bisher haben wir leistungsstarke Tools gesehen, mit denen wir benutzerdefinierte Seiten von Grund auf neu erstellen können. Aber wäre es nicht besser, wenn wir Vorlagen verwenden könnten? Vorlagen würden es ermöglichen, den Entwurfsprozess viel schneller zu gestalten.

Das Tolle ist, dass sowohl Elementor als auch Beaver Builder Vorlagenfunktionen bieten. 

In diesem Zusammenhang handelt es sich bei Vorlagen um vorgefertigte Designs, mit denen Sie das Design Ihrer Seiten beschleunigen können. Sowohl Elementor als auch Beaver Builder bieten uns zahlreiche Vorlagen zur Auswahl.

Als Webdesigner oder Entwickler möchten Sie wahrscheinlich die Möglichkeit haben, eigene Themen oder bestimmte Seitenvorlagen zu erstellen, die Sie im Rahmen Ihres Designprozesses wiederverwenden / optimieren können.

Lass uns einen Blick darauf werfen.

Elementor-Vorlagen

Wenn Sie in Elementor eine neue Seite erstellen, sehen Sie, dass Sie entweder einen Abschnitt hinzufügen oder eine Vorlage verwenden können.

In der kostenlosen Version stehen Ihnen rund 40 Vorlagen zur Auswahl. In der Pro-Version stehen über 300 verschiedene Seiten und Blockvorlagen zur Auswahl.

Besuchen Sie die Website, um alle Vorlagen zu überprüfen

Element oder neue Vorlage

Nach dem Klicken auf Vorlage hinzufügen Klicken Sie auf die Schaltfläche, um ein Menü mit den Vorlagen zur Auswahl zu erhalten.

Elementor Template-Auswahl

Elementor bietet zwei Arten von Vorlagen an: Block- und Seitenvorlagen.

Blockvorlagen sind Abschnittsvorlagen, mit denen Sie bestimmte Teile Ihrer Seite erstellen können. Ein Beispiel für eine Blockvorlage ist ein Kontaktformular oder ein CTA-Abschnitt.

Unten sehen Sie Beispiele für verfügbare CTA-Vorlagen.

Element- oder Blockvorlagen

Page Templates sind ganzseitige Vorlagen, die über das Builder-Plugin für bestimmte Seitentypen und / oder Zwecke entwickelt wurden.

Unten sehen Sie Vorlagen für eine Zielseite und eine Startseite. Darüber hinaus stehen verschiedene Geschmacksrichtungen zur Auswahl. Sie haben beispielsweise eine Homepage-Vorlage, die auf Restaurants und eine auf Agenturen zugeschnitten ist.

Elementor-Seitenvorlagen

Sie können auch Ihre benutzerdefinierten Seitenvorlagen erstellen und sogar vollständige Themen zur Wiederverwendung speichern. Klicken Sie dazu auf den kleinen Aufwärtspfeil neben der Schaltfläche "Veröffentlichen" und wählen Sie "Als Vorlage speichern".

Elementor benutzerdefinierte Vorlagen

Sie können sogar Vorlagen von Drittanbietern importieren, indem Sie sie auf Ihre Website hochladen. Dies ermöglicht endlose Anpassungsmöglichkeiten.

Element oder Importvorlage

Beaver Builder-Vorlagen

In Beaver Builder stehen drei Arten von Vorlagen zur Auswahl: Zielseiten, Inhaltsseiten und gespeicherte Vorlagen. Im Gegensatz zu Elementor verfügt Beaver Builder nicht über Vorlagen auf Blockebene, obwohl Sie Plugins verwenden können, um die gleiche Funktionalität zu erhalten.

Klicken Sie hier, um alle Vorlagen anzuzeigen

Beachten Sie, dass die kostenlose Version von Beaver Builder überhaupt keine Vorlagenoptionen bietet. Sie müssen also alles von Grund auf neu machen, wenn Sie die kostenlose Version verwenden möchten.

Biber Builder-Vorlagen

Zielseitenvorlagen dienen zum Erstellen aufwändiger Zielseiten. Zum jetzigen Zeitpunkt können Sie in Beaver Builder aus 30 verschiedenen Zielseitenvorlagen auswählen.

Biber Landing Page Vorlage

Inhaltsseitenvorlagen sind für Inhaltsseiten wie Informationen zu Seiten, Kontaktseiten, Startseiten usw. vorgesehen. Zum jetzigen Zeitpunkt stehen mit Beaver Builder 25 Inhaltsseitenvorlagen zur Auswahl.

Biber-Inhaltsseitenvorlage

 

Gespeicherte Vorlagen sind Ihre benutzerdefinierten gespeicherten Vorlagen. Wie in Elementor können Sie mit dem Builder eine Seite als Vorlage erstellen, um sie später wiederzuverwenden.

Das Importieren von Vorlagen ist auch in Beaver Builder möglich, jedoch nicht so intuitiv wie bei Elementor. Sie können überprüfen, wie dies funktioniert, indem Sie die Dokumentation lesen Kuyichi Signs Transparency Pledge. .

Vorlagen Fazit

Der Elementor Builder bietet mehr Vorlagen zur Auswahl und einfachere Optionen zum Importieren und Exportieren von Vorlagen als der Beaver Builder. Wie für die Design und Aussehen, beide Plugins bieten Ihnen eine Vielzahl von schönen Vorlagen, die für viele verschiedene Arten von Nischen geeignet sind.

Bei den kostenlosen Versionen gewinnt Elementor zweifellos gegen Beaver Builder. Mit Elementor können Sie immer noch aus über zwei Dutzend kostenlosen Vorlagen auswählen und diese sogar importieren und exportieren. In Beaver Builder müssen Sie auf die Premium-Version aktualisieren, um diese Funktion nutzen zu können.

Themenerstellung

Die Funktion zum Erstellen von Themen ist ein sehr leistungsfähiges Tool, das sowohl Elementor als auch Beaver Builder seinen Benutzern anbieten.

Für Elementor wird der Theme Builder automatisch entsperrt, sobald Sie auf die Premium-Version aktualisieren. Für Beaver Builder müssten Sie ein separates Plugin namens Beaver Themer installieren, bei dem es sich um einen separaten Kauf im Wert von 147 US-Dollar handelt.

Theme Builder von Elementor

Um auf den Theme Builder zuzugreifen, können Sie zu gehen Vorlagen> Theme Builder. Von dort aus können Sie Themenvorlagen erstellen oder bearbeiten. Sie können Vorlagen erstellen oder bearbeiten für:

  • Seite
  • Kopfzeile
  • Fußzeile
  • Single Post
  • Archiv
  • 404 Seiten
  • Usw.

Der Theme Builder von Elementor funktioniert fast genauso wie der Page Builder.

Sie haben alle normalen Elemente sowie neue und spezifische Elemente für die Art des Themenabschnitts, an dem Sie arbeiten. So sieht beispielsweise der Theme Builder aus Einzelne Post.

Elementor Single Post Editor

Wie Sie sehen können, haben Sie eine neue Reihe von WordPress-Widgets, die für einzelne Beiträge wie Post-Titel, ausgewähltes Bild, Post-Kommentare usw. spezifisch sind.

Wenn Sie nicht bei Null anfangen möchten, können Sie auch vorgefertigte Vorlagen verwenden, auf die Sie zugreifen können, indem Sie wie im normalen Seitenersteller auf das Ordnersymbol im Inhaltseditor klicken.

Sobald Sie mit dem Erstellen Ihrer benutzerdefinierten Designvorlage fertig sind, können Sie steuern, wann und wo sie angezeigt wird. Sie können beispielsweise festlegen, dass Ihre benutzerdefinierte einzelne Beitragsvorlage nur für einen bestimmten Beitragsautor angezeigt wird.

Theme Builder von Beaver Builder

Der Theme Builder von Beaver Builder funktioniert zwar anders aktiviert, funktioniert jedoch ähnlich wie der Theme Builder von Elementor. Dies ist ein großartiges Tool, wenn Ihre Kunden verlangen, dass Sie benutzerdefinierte Designs für sie erstellen.

Sie können erst auf den Theme Builder zugreifen, wenn Sie das Beaver Themer-Plugin installiert haben. Sobald Sie es aktiviert haben, können Sie darauf zugreifen Beaver Builder> Themenlayouts Von dort aus können Sie eine benutzerdefinierte Vorlage für Folgendes erstellen:

  • Kopfzeile
  • Fußzeile
  • Archiv
  • Einzelne Beiträge (Singular)
  • 404 Seiten
  • Teil

 

Biber Builder Theme Builder

Sobald Sie sich für das Layout entschieden haben, das Sie erstellen oder bearbeiten möchten, können Sie es weiter anpassen, indem Sie auswählen, wo und wann es angezeigt werden soll.

Beispielsweise können Sie für die benutzerdefinierte Fußzeile auswählen, ob sie auf Ihrer gesamten Site angezeigt wird und Ihre Standardfußzeile effektiv ersetzt, oder ob sie nur auf bestimmten Posts oder Seiten angezeigt werden soll.

Sie können es auch weiter anpassen, indem Sie es nur anzeigen, wenn ein Beitrag von einem bestimmten Autor verfasst wurde.

Diese regelbasierte Anpassung in Beaver Builder ist sehr leistungsfähig, da sie viele Flexibilität und Anpassungsmöglichkeiten bietet.

Biber Builder themer benutzerdefinierte Regeln

Für den Editor selbst haben Sie dieselbe Benutzeroberfläche wie für den Beaver Builder-Seitenersteller.

Unten sehen Sie den Themenlayout-Editor in Aktion, in dem wir die von uns erstellte benutzerdefinierte Fußzeile bearbeiten. Sie haben Zugriff auf die gleiche Anzahl von Modulen und anderen Elementen wie im regulären Seitenersteller.

Biber Builder Themer Editor

Fazit des Theme Builders

Beide Builder-Plugins bieten eine hervorragende Kontrolle und Anpassung über das Erstellen von Themen. Wenn wir jedoch über die Preisgestaltung sprechen möchten, ist das Elementor Builder-Plugin billiger als Beaver Builder, da sein Theme Builder in die Premium-Version integriert ist.

AnzeigenPreise

Wir haben die beiden Plugins bereits ziemlich oft verglichen und wir haben gesehen, was Sie in ihren kostenlosen und Pro-Versionen bekommen können. Aber wie viel kostet jeder Bauherr? Und welches gibt Ihnen den größten Wert?

Beide Premium Builder-Versionen sind in drei Preisstufen erhältlich.

Elementor Pricing

Beginnen wir mit Elementor. Es gibt persönliche, geschäftliche und unbegrenzte Preisoptionen.

  • Persönliches - 49 US-Dollar für eine einzelne Site.
  • Geschäft - 99 US-Dollar für drei Standorte.
  • Experte - 199 US-Dollar für 25 Websites
  • Studio - 499 US-Dollar für 100 Websites
  • Unbegrenzt - 999 US-Dollar für unbegrenzte Websites.

elementor Preisgestaltung

Alle Pläne verfügen über die gleiche Anzahl von Funktionen und werden 1 Jahr lang weiterhin Premium-Support und Updates erhalten. Sie werden mit dem Theme Builder geliefert.

Klicken Sie hier für den niedrigsten Preis für Elementor

Beaver Builder Preisgestaltung

Wie bei Elementor gibt es auch bei Beaver Builder drei Preisstufen.

  • Standard - 99 USD
  • Pro - $ 199
  • Agentur - 399 $

 

BB Preisgestaltung

The Standard Die Lizenz bietet keine Unterstützung für mehrere Standorte und kein Beaver Builder-Thema. Das PRO Die Lizenz kann mehrere Standorte unterstützen und wird mit dem Beaver Builder-Design geliefert, es gibt jedoch keine weiße Beschriftung.

Schließlich wird das Agentur Lizenz hat alle Standard- und Pro-Funktionen plus weiße Beschriftung. Alle Pläne gelten für unbegrenzte Websites.

Beachten Sie, dass Beaver Themer ein separater Kauf von Beaver Builder selbst ist, der 147 US-Dollar kostet.

Klicken Sie hier für den niedrigsten Preis für Beaver Builder

Kostenlos gegen Pro

Beide Plugins werden mit kostenlosen und Pro-Versionen geliefert, aber die kostenlose Version von Elementor ist hier der klare Gewinner.

Die kostenlose Version von Elementor enthält Dutzende von Modulen und Vorlagen kostenlos. Beaver Builder wird nur mit sehr einfachen Versionen geliefert, was es in seiner kostenlosen Version sehr eingeschränkt macht.

Preis Fazit

Wenn Sie eine kostenlose Version wünschen, ist Elementor Ihre klare Wahl.

Was die Premium-Versionen betrifft, so scheint Beaver Builder zwar teurer zu sein, die übergeordneten Pläne bieten jedoch entwicklerfreundlichere Funktionen, insbesondere die weiße Beschriftung.

Wenn Sie ein Entwickler sind, der Hosting weiterverkaufen möchte, sollten Sie sich dies ansehen Diskussion. Kurz gesagt, mit Elementor können Sie die Website eines Kunden nicht selbst hosten und ihm eine monatliche Gebühr berechnen, wenn Sie Elementor zum Erstellen oder Gestalten seiner Website verwendet haben.

Wir sind der Meinung, dass Elementor besser für Einzelbenutzer ist, während Beaver Builder besser für Entwickler ist - insbesondere aufgrund der White-Labeling- und Hosting-Optionen.

Wenn Sie noch nach anderen Optionen suchen, haben wir auch bewertete Elementor vs Divi hier, und auch Beaver Builder gegen Divioder endlich, wenn du willst Weitere Bewertungen, unsere Einstellung zu DiviWir sind jedoch der Meinung, dass Sie Ihre Auswahl an dieser Stelle einschränken und unsere Schlussfolgerung unten betrachten sollten.

Elementor vs Beaver Builder: Fazit

Insgesamt sind dies derzeit die beiden besten Plugins für den Seitenersteller für WordPress. 

Elementor bietet eine Vielzahl von Vorlagen und Elementen, während Beaver Builder versucht, es einfach zu halten und dennoch die Anforderungen jedes Webdesign-Benutzers zu erfüllen.

Beaver Builder ist entwicklerfreundlich. Es bietet White-Labeling-Optionen und unterliegt keinen Einschränkungen hinsichtlich des Verkaufs von Diensten oder Websites, die mit Entwicklern erstellt wurden.

Elementor ist nicht Open Source, während Beaver Builder es ist, aber Elementor ist insgesamt leistungsfähiger.

Aus Sicherheitsgründen hatte Elementor eine ernsthafte Sicherheitslücke In der Vergangenheit wurde dies jedoch behoben, und das Produkt entwickelt sich immer weiter. In letzter Zeit wurden 5 Millionen aktive Installationen durchgeführt, und es wurde eine starke Strategie verfolgt, um bald 10 Millionen zu erreichen!

Also ja, Sie kaufen definitiv ein gutes Produkt!

Wenn Sie als Einzelentwickler oder Benutzer nach einem hervorragenden Plugin mit unzähligen Funktionen und schnellen Updates suchen, wählen Sie das Elementor Page Builder-Plugin. Wenn Sie ein Entwickler oder Benutzer sind, der nicht von unzähligen Funktionen und schnellen Updates überwältigt werden möchte, wählen Sie Beaver Builder.

Aber am Ende liegt es ganz bei Ihnen, die endgültige Entscheidung zu treffen.

Da sich sowohl Beaver Builder als auch Elementor ständig weiterentwickeln, gibt es keinen klaren Gewinner, aber wir mögen Elementor immer noch ein bisschen besser, obwohl Sie auf der Grundlage der von uns beschriebenen Faktoren und Ihrer aktuellen Bedürfnisse leicht die richtige Entscheidung treffen können.

Besuchen Sie Elementor

 

Über den Autor
David Attard
Autor: David AttardWebsite: https://www.linkedin.com/in/dattard/
David arbeitet seit 18 Jahren in oder um die Online- / Digitalbranche. Er verfügt über umfangreiche Erfahrung in der Software- und Webdesignbranche mit WordPress, Joomla und den sie umgebenden Nischen. Als digitaler Berater konzentriert er sich darauf, Unternehmen durch die Kombination ihrer Website und der heute verfügbaren digitalen Plattformen einen Wettbewerbsvorteil zu verschaffen.

Eine Sache noch... Wussten Sie, dass Leute, die nützliche Dinge wie diesen Beitrag teilen, auch FANTASTISCH aussehen? ;-);
Sie können uns eine lass a nützlich Kommentieren Sie mit Ihren Gedanken und teilen Sie dies dann Ihren Facebook-Gruppen mit, die dies nützlich finden würden, und lassen Sie uns gemeinsam die Vorteile nutzen. Vielen Dank für das Teilen und nett zu sein!

Disclosure: Diese Seite enthält möglicherweise Links zu externen Websites für Produkte, die wir lieben und von ganzem Herzen empfehlen. Wenn Sie Produkte kaufen, die wir vorschlagen, können wir eine Empfehlungsgebühr verdienen. Solche Gebühren haben keinen Einfluss auf unsere Empfehlungen und wir akzeptieren keine Zahlungen für positive Bewertungen.

Autor (en) Empfohlen am:  Inc Magazin Logo   Sitepoint-Logo   CSS Tricks Logo    webdesignerdepot logo   WPMU DEV Logo   und viele mehr ...