Beaver Builder vs Elementor - Een ultieme gids en vergelijking (2021)

Beaver builder vs Elementor

Welke zijn twee van de meest populaire paginabuilders voor WordPress? Als u op zoek bent naar een Beaver Builder vs Elementor vergelijking, je weet het al, dit zijn twee van de beste producten die er zijn! Als eindgebruiker die uw website zelf wil kunnen ontwerpen, zijn we er zeker van dat u weet dat deze plug-ins tot uw beste keuzes behoren uit de vele beschikbare opties.

Er zijn er echter enkele verschillen die u moet weten voordat u uw keuze maakt. Beide producten hebben hun nuances die een verschil kunnen maken in uw beslissing.

Want als je eenmaal een beslissing hebt genomen, zit je er meestal voor de lange termijn in, er is (bijna) geen weg meer terug. De juiste keuze maken is cruciaal! 

U moet ervoor zorgen dat u de paginabuilder kiest die past bij uw behoeften en voorkeuren.

Als u bijvoorbeeld pagina's maakt met de ene paginabuilder en vervolgens besluit over te schakelen naar de andere, blijft uw inhoud behouden, maar krijgt u een rommelige lay-out samen met overal verspreide shortcodes. Het kan erg vervelend en tijdrovend zijn om alles weer opnieuw op te bouwen.

We gaan de functies van beide plug-ins doornemen en vergelijken, zodat u de juiste beslissing kunt nemen.

Maar misschien heb je nu een vraag in je hoofd.

Als het gebruik van plug-ins voor het maken van pagina's uw site maakt afhankelijk erop, waarom zou je er überhaupt een gebruiken? Laten we dat snel bespreken in de volgende sectie. Als je graag een vliegende start wilt maken met de vergelijking, kun je doorgaan naar de Elementor vs Beaver Builder secties.

Dit Beaver Builder vs Elementor plug-in artikel is bijgewerkt in september 2021 het toevoegen van relevante en belangrijke informatie en updates naarmate nieuwe functies worden ontwikkeld en vrijgegeven voor beide producten. U kunt er zeker van zijn dat dit artikel de nieuwste, onbevooroordeelde informatie bevat.

Beaver Builder vs Elementor

Elementor en Beaver Builder zijn beide krachtige tools voor het ontwerpen van sites. Elementor heeft een gratis versie, maar de PRO-versie ($ 49) blinkt uit met een uitgebreide set elementen en sjabloonbibliotheek. Beaver Builder is nog steeds een geweldig alternatief door zijn eenvoud en aantrekkelijke prijs ($ 99).

  elementor-logo beaver builder logo
globaal  5 / 5  4.5 / 5
Winnaar 🏆  
Prijs $ 49 $ 99
Gratis versie Ja Ja
Realtime editor Ja Ja
Frontend / Backend Te gebruiken zowel Te gebruiken zowel
Doelgroep Ontwikkelaar / ontwerper / gebruiker / bureau Webontwikkelaar / ontwerper
Elementen ondersteund 80+  31 
Schone code Ja Ja
Vooraf gemaakte sjablonen / lay-outs 300+ 50+
Coole functie Dynamische inhoud Bever Themer
Performance
Wat we leuk vonden  Zeer krachtige oplossing voor het maken van elk type ontwerp  Eenvoudige gebruikersinterface
   Superieure opties voor lay-outbeheer  De inhoud blijft intact, zelfs na het deactiveren van de plug-in
   Aantrekkelijke prijzen met toegang  Unieke bewerkingsmodus voor klanten
   Niet voor niets de meest populaire paginabuilder  Hiermee kunt u WordPress-widgets gebruiken in de lay-outs
Wat we niet leuk vonden    Duurder dan de andere pagebuilders
     Geen optie voor ongedaan maken, opnieuw uitvoeren of geschiedenis
Website Bezoek de website van Elementor Bezoek Beaver Builder 

Wat is een PageBuilder?

Paginabouwers beloven het ontwerpen van uw website een stuk eenvoudiger te maken en less ingewikkeld. In wezen zorgen deze tools ervoor dat je geen technische kennis nodig hebt als het gaat om zaken als HTML, CSS of JavaScript.

Ze stellen je in staat om pagina's te bouwen en te ontwerpen die er precies (of in ieder geval zo goed mogelijk) uitzien als wat je voor ogen had, zonder dat je met code hoeft te rommelen.

Dit in tegenstelling tot wat tot een paar jaar geleden de norm was, toen programmeur, of in ieder geval goede kennis van webtechnologie, essentieel was om een ​​website te ontwikkelen!

Met de komst van deze producten is de noodzaak om huur webontwikkelaars in lijkt een verre gedachte te zijn geworden of helemaal niet nodig.

In werkelijkheid is dit niet het geval.

Webontwikkelaars en ontwerpers zijn nog steeds de beste keuzes voor volledig op maat gemaakte oplossingen. Dit betekent niet dat er geen ruimte is voor pagebuilders. Beiden hebben hun gebruiksscenario's.

Paginabuilders kunnen webontwerpers zelfs efficiënter maken.

Het komt erop neer dat webdesigners en pagebuilders in de nabije toekomst naast elkaar zullen blijven bestaan. Veel ontwikkelaars en ontwerpers maken gebruik van paginabuilders om websites voor hun klanten te bouwen.

Er zijn veel artikelen, discussies en debatten online over dit onderwerp als u dieper wilt ingaan op de verschillen tussen het inhuren van webdesigners en het gebruik van een plug-in voor het bouwen van pagina's.

Maar voor nu dwalen we af.

Omdat de focus van dit artikel gaat over: Beaver Builder vs Elementor, we gaan het hebben over waarom je een paginabuilder zou willen gebruiken in plaats van een professionele webdesigner in te huren.

Waarom überhaupt een Page Builder gebruiken?

Er zijn veel redenen waarom u een plug-in voor het maken van pagina's zou willen gebruiken:

Een compleet pakket

Allereerst is een paginabuilder als een "alles-in-één" plug-in. Ze hebben knoppen, diavoorstellingen, contactformulieren, galerijen, inhoudsrasters, knoppen voor sociaal delen, enz. Allemaal in één pakket. Als u geen paginabuilder gebruikt, moet u in plaats daarvan meerdere plug-ins installeren, één voor elke specifieke behoefte.

Naarmate uw vereisten toenemen, moet u mogelijk heel wat verschillende plug-ins installeren. En als u besluit om voor premium plug-ins te gaan, zullen de licentiekosten oplopen.

En dan is er nog de kwestie van het onderzoeken welke plug-in de beste is, samen met het onderhoudswerk dat gepaard gaat met het installeren van zoveel plug-ins.

Simpel gezegd, paginabuilders zijn: handig en goedkoper in het algemeen.

elementen

Sjablonen en lay-outs

De volgende reden ligt het meest voor de hand en is ook de belangrijkste reden waarom u een WordPress-paginabuilder wilt hebben geïnstalleerd: prachtige aangepaste sjablonen en lay-outs.

Hoewel we premium-thema's kunnen krijgen die ons veel aanpassingsfuncties en opties bieden, zijn er meestal niet veel thema's die aan AL onze ontwerpvereisten voldoen.

De meeste van hen zullen "de meeste" van onze behoeften raken.

Je zult altijd denken dat er iets ontbreekt of "Ik wou dat ik dit of dat kon doen."

De oplossing? WordPress Page Builders houden van Beaver Builder en Elementor-bouwer.

Er is geen limiet aan wat u kunt bouwen met een pagebuilder. U kunt uw pagina's op elke gewenste manier aanpassen en in sommige gevallen zelfs uw hele thema.

Er zijn ook vooraf gemaakte sjablonen die uw leven gemakkelijker zullen maken. Dit zijn volledig ontwikkelde sites en pagina's, die u ALLEEN hoeft aan te passen met uw inhoud.

Lay-outsjablonen

Geen noodzaak om te weten hoe te coderen

Hoewel u paginabuilders nog beter kunt maken door meer aangepaste ontwerpen te maken door te weten hoe u HTML- en CSS-codes moet schrijven, is dit NIET nodig.

De meeste paginabuilders, zoals Elementor en Beaver Builder plug-in, wordt geleverd met een interface voor slepen en neerzetten waarmee u eenvoudig pagina's kunt bouwen zonder enige kennis over wat een tag doet.

Nu dat is dit uit de weg, laten we doorgaan met de vergelijking van de Beaver Builder vs Elementor-paginabuilders.

Elementor versus Beaver Builder: De interface

Een van de belangrijkste dingen om te overwegen bij het kiezen van een applicatie of software is de gebruikersinterface. Hoewel het meestal om persoonlijke voorkeur gaat, kan het moeilijk zijn om een ​​applicatie te gebruiken waarvan de interface niet is wat je gewend bent of niet naar je zin hebt.

Het moet zowel gebruiksvriendelijk zijn als uw productiviteit verbeteren.

We gaan dus kijken naar de "gezichten" van beide plug-ins, of beter gezegd, interfaces.

De interface alleen maakt een plug-in niet geweldig. Er zijn nog andere dingen waarmee u rekening moet houden, zoals de beschikbaarheid van functies en modules, dus zorg ervoor dat u tot het einde leest voordat u een beslissing neemt.

Maar natuurlijk kan het uiterlijk en de gebruikerservaring van het bouwen van een site een product maken of breken.

Laten we beginnen met de interface van Elementor.

Elementor-interface

De interface van Elementor is verdeeld in twee hoofdsecties. De zijbalk, die zich aan de linkerkant bevindt, en de live preview van uw site/pagina.

Bezoek om de gratis versie van Elementor te downloaden download

Het werkt met het concept van blokken, dat je in actie kunt zien in deze video van 1 minuut:

VRoPdyk97mg

 elementor-interface

De zijbalk bevat de WordPress widgets en elementen die u kunt gebruiken om uw pagina's samen te stellen met de instellingen die u kunt aanpassen.

U kunt elementen aan uw pagina's toevoegen door ze naar het live voorbeeld te slepen en neer te zetten. We hebben bijvoorbeeld een extra kop toegevoegd op onze voorbeeldsite:

slepen en neerzetten elementor

Tekst bewerken is eenvoudig. Klik gewoon op een tekstelement op uw site en bewerk het direct.

tekst bewerken element

U kunt ook tekst bewerken via de zijbalk.

tekstbewerk element of zijbalk

Ten slotte hebt u onderaan toegang tot aanvullende instellingen.

elementof meer interface

 

  • Algemene instellingen - hier kunt u informatie zien over de huidige WordPress-pagina, zoals de titel van de pagina, de uitgelichte afbeelding, de publicatiestatus en andere.
  • navigator - als u hierop klikt, verschijnt er een pop-up met een navigatiestructuurpaneel om de navigatie te vergemakkelijken.
  • Geschiedenis - als u terug wilt naar een eerdere revisie, kunt u hier klikken. Houd er rekening mee dat dit alleen wijzigingen weergeeft die u in de huidige sessie hebt aangebracht.
  • Responsieve modus - hiermee kunt u bekijken hoe uw website eruit zal zien op verschillende apparaten/schermresoluties.

Als u de muisaanwijzer op een element plaatst en met de rechtermuisknop klikt, krijgt u toegang tot verschillende opties:

rechtsklik elementor element

Met het rechtsklikmenu kunt u een element verwijderen, bekijken in de navigator, opslaan als een globaal element (alleen pro-versie), dupliceren en meer.

Nu we de hoofdinterface van Elementor hebben gezien, laten we eens kijken naar Beaver Builder volgende.

Beaver Builder's interface

Beaver Builder's interface is minimalistischer dan de Elementor-builder. 

Klik hier voor een live demo

Als je geen tijd hebt om de demo te bekijken, deze 2 minuten durende video gemaakt door de Beaver Builder team, kan u snel de interface laten zien en hoe u pagina's kunt bouwen:

tCNDDQ7Jrs8

Zoals je in de bovenstaande video hebt gezien wanneer je een WordPress-pagina bewerkt via Beaver Builder, dit is wat je ziet:

bever-interface

Bovenaan heb je Beaver Builder's balk met minimale maar essentiële informatie over uw huidige pagina. Om een ​​element toe te voegen, klikt u op de “+”-knop in de rechterbovenhoek.

bever modules

Om een ​​element, of een “module” toe te voegen volgens Beaver Builder's terminologie, kunt u deze eenvoudig slepen en neerzetten.

bever slepen en neerzetten

Je hebt dat misschien gemerkt Beaver Builder's teksteditor is iets anders dan die van Elementor. We kunnen aan de GIF hierboven zien dat we een pop-upeditor hebben bij het bewerken van teksten.

U kunt ook op een tekstmodule klikken om deze te bewerken, wat opnieuw de pop-up teksteditor.

bever teksteditor

Als u deze pop-upvensterfunctie niet leuk vindt, kunt u de teksteditor naar links of rechts van het scherm slepen om deze vast te zetten. Zodra u dat doet, kunt u ook in-line bewerkingen uitvoeren.

bever teksteditor aangepast

Merk op dat het vastzetten van die teksteditor ook alles vastzet, waardoor het qua lay-out op de Elementor-builder lijkt.

bever interface aangepast

Zoals je van bovenaf kunt zien, Beaver Builder heeft nu dezelfde lay-out als Elementor. Als je wilt, kun je het naar de rechterkant verplaatsen door het te slepen en vast te zetten.

Ten slotte hebben we extra instellingen door op de pijl-omlaag in de linkerbovenhoek van het scherm te klikken.

bever extra instellingen

Interface-conclusie

Een van de grootste verschillen en misschien een dealbreaker voor anderen is: Beaver Builder's gebrek aan bewerkingsgeschiedenis om het ongedaan maken van bewerkingen gemakkelijker te maken.

Afgezien van dit ene probleem, bieden beide plug-ins identieke lay-outs en bewerkingsprestaties.

Qua uiterlijk is Beaver Builder heeft het voordeel met zijn veel schonere uitstraling, hoewel dit misschien slechts een persoonlijke voorkeur is. Het slepen en neerzetten van items is ook iets nauwkeuriger en gemakkelijker in Beaver Builder dan in de Elementor-plug-in.

Modules en widgets

Elementor noemt zijn elementen "widgets" terwijl Beaver Builder noemt ze "modules".

Dit zijn de bouwstenen die WordPress-paginabouwers kunnen gebruiken om de inhoud van uw pagina te maken. Het zijn teksten, koppen, knoppen, galerijen en andere elementen. In de eerdere voorbeelden zag je de tekst- en kopelementen.

Laten we eens kijken hoeveel andere elementen deze plug-ins te bieden hebben.

Elementor-elementen: secties, kolommen en widgets

De Elementor-builder heeft drie soorten elementen:

  1. secties,
  2. kolommen en
  3. widgets.

De sectie is de hoogste in de bouwerhiërarchie. Elke kolom en widget bestaat binnen een sectie.

De kolom is de tweede in de hiërarchie. Elke widget leeft in een kolom. De widgets zijn de laagste in de hiërarchie.

De widgets zijn uw inhoud, zoals knoppen, tekst en afbeeldingen. De secties en kolommen zijn voor het maken van verschillende lay-outs.

Elementor geeft je 30 widgets om te gebruiken in de gratis versie en 52+ WordPress widgets in de PRO-versie. Deze aantallen nemen steeds toe naarmate er nieuwe versies worden uitgebracht, dus klik hier om de laatste cijfers te bekijken.

In de onderstaande GIF kun je zien hoe we een sectie hebben toegevoegd, vervolgens hebben we een kolom met "twee kolommen" in de sectie geplaatst en ten slotte widgets in de kolommen toegevoegd. Je kunt meerdere widgets in een kolom toevoegen, die je ziet in de tweede GIF hieronder die de styling laat zien.

elementor secties kolommen widgets

Het toepassen van stijlen op de sectie heeft invloed op alles erin.

Hetzelfde geldt voor kolommen, maar het heeft geen invloed op iets daarbuiten en elke stijl die u op een widget toepast, blijft op zichzelf. De onderstaande GIF toont dit in actie voor de Elementor-bouwer.

secties kolommen widgets hiërarchie

 

 Het is je misschien opgevallen hoe je met de rechtermuisknop op een element kunt klikken om het te bewerken, te dupliceren of te verwijderen. Dit is een zeer handige actie.

elementor rechtsklikmenu

Nu je een goed overzicht hebt van de elementen van Elementor. Laten we de andere eens bekijken.

Beaver Builder's Elements: Rijen, Kolommen en Modules

Net als de vorige plug-in, Beaver Builder verdeelt ook de elementen in drie categorieën:

  1. rijen,
  2. kolommen en
  3. modules.

Rijen zijn de hoogste in de hiërarchie. Kolommen gaan binnen rijen en vervolgens gaan modules binnen kolommen. Modules zijn uw eigenlijke inhoud, terwijl kolommen en rijen, nogmaals, voor lay-outdoeleinden zijn.

Beaver Builder's gratis versie geeft je 6 modules, terwijl de pro-versie je 30 modules geeft om mee te spelen. Het is raadzaam om op de website te kijken welke modules momenteel beschikbaar zijn bij beide versies.

In de onderstaande GIF gebruiken we de builder om een ​​rij met drie kolommen toe te voegen en de kolommen te vullen met verschillende modules.

rij kolommen module

De styling werkt in dezelfde zin als Elementor.

Stijlen die in rijen worden toegepast, worden ook toegepast in kolommen en modules. Stijlen die in kolommen worden toegepast, zijn van invloed op modules en u kunt specifieke stijlen voor modules afzonderlijk instellen.

rij kolommen module stijl

In tegenstelling tot Elementor, Beaver Builder heeft geen aangepaste rechtsklikopties. Je moet over een element zweven om er acties op uit te kunnen voeren.

klik met de rechtermuisknop bever

Modules en widgets Conclusie

Beide plug-ins werken vrijwel op dezelfde manier.

Ze bieden allebei eenvoudige manieren om een ​​lay-out voor uw pagina's te maken. Elementor maakt het echter een beetje gemakkelijker door een rechtsklikmenu op elk element te hebben waarmee je direct naar de instellingen kunt springen.

Wat betreft het aantal beschikbare modules, het lijkt erop dat Elementor een voorsprong heeft Beaver Builder, vooral in de gratis versie.

Styling

Zoals je eerder hebt gezien, zijn zowel Elementor als Beaver Builder bieden fijnmazige controle over stylingopties. U kunt stijlen toepassen op secties of rijen of deze verfijnen en individuele widgets of modules hun eigen stijl laten hebben.

Laten we wat meer ingaan op stylingopties.

Elementor Styling-opties

Voordat we de stylingopties bekijken die beschikbaar zijn in de editor zelf, laten we eerst eens kijken naar de stylinginstellingen van Elementor die te vinden zijn in Elementor > Instellingen.

elementor stijlopties

In het Algemene vragen instellingen, kunt u configureren of u de standaardkleuren en lettertypen van Elementor wilt uitschakelen. Het wordt aanbevolen om deze vakjes aan te vinken om stijlconsistentie op uw hele site te behouden.

Onder de stijl tabblad kunt u verschillende andere ontwerpinstellingen configureren.

elementor instellingen stijl

We gaan deze niet allemaal bespreken, maar zoals je kunt zien, kun je op deze pagina veel stylingopties verfijnen. Laten we verder gaan met de stylingopties van de editor.

Elementor basisstijlopties

De beschikbare stijlopties blijven voor de meeste elementen in Elementor vrijwel gelijk. Hieronder ziet u de basisstijlopties voor het Heading-element.

elementaire stijlen

Trouwens, je hebt misschien gemerkt dat de letterstijl en kleur zijn veranderd - dit komt omdat we zojuist de just hebben ingeschakeld Standaardkleuren uitschakelen als Standaardlettertypen uitschakelen in de instellingen van Elementor.

Nu neemt het de kleuren en lettertypen van het thema over in plaats van de aangepaste kleuren (wat je kunt zien in onze eerdere voorbeelden).

Laten we teruggaan naar de stijlopties die voor ons beschikbaar zijn. Hierboven hebben we:

  • Tekstkleur
  • Typografie
  • Text Shadow
  • Mengmodus

Elementor geavanceerde stijlopties

Als je denkt dat dit niet genoeg is, kun je naar het tabblad Geavanceerd gaan voor meer opties.

elementor geavanceerde stijlen

Hier kun je alles configureren, van aangepaste marges en opvullingen, schuifeffecten, achtergrondinstellingen, enz. Je kunt ook een aangepaste CSS toepassen als je wilt (dit is alleen beschikbaar in de PRO-versie).

Een van de unieke kenmerken van Elementor is de mogelijkheid om aangepaste waarden in te stellen voor verschillende schermformaten, zoals hieronder te zien is:

geavanceerde responsieve stijlen

Dit geeft u meer controle over hoe uw inhoud wordt weergegeven op verschillende apparaten en schermresoluties.

Beaver Builder Styling opties

In tegenstelling tot Elementor, Beaver Builder neemt standaard de lettertypen en kleur van uw thema over. Dit zorgt voor consistentie out-of-the-box.

Beaver Builder's stylingopties variëren afhankelijk van het element, maar in principe heb je stijl, scheidingsteken, typografie, als vergevorderd opties.

Stijlen

bever stijlen

De stijl instellingen worden weergegeven wanneer u een rij bewerkt, evenals andere elementen zoals knoppen. U kunt opties vinden voor:

  • Breedte
  • Inhoudsbreedte
  • Lengte
  • Kleuren zoals linkkleur, tekstkleur, link-hoverkleur, enz.
  • Achtergrondtype, kleur en dekking
  • Grens

Het toepassen van kleuren, zoals tekst-, link- en hoverkleuren, wordt toegepast op elk element in de rij. U kunt deze instellingen echter overschrijven door aangepaste waarden per element in te stellen.

bever geavanceerde stijlen

In het vergevorderd instellingen vindt u opties voor:

  • Spacing
  • Verantwoorde lay-out
  • Zichtbaarheid
  • HTML-element - u kunt een aangepaste HTML-ID en -klasse instellen voor een specifiek element voor verdere aanpassing

Te gebruiken zowel Beaver Builder en Elementor stellen u in staat om te verfijnen hoe uw inhoud op verschillende apparaten wordt weergegeven door op het apparaatpictogram naast een instelling te klikken (die alleen zichtbaar is voor instellingen die dit ondersteunen).

bever reageert

Separator

bever scheidingsteken stijlen

Het afscheider is een andere stylingoptie waarmee u uw elementen een meer verfijnde uitstraling kunt geven.

Hier vindt u opties voor uw scheidingsteken. Als je je afvraagt ​​hoe een scheidingsteken eruitziet, bekijk dan een voorbeeld hierboven - de rode lijn onder de kop in de afbeelding hierboven. Je hebt opties voor:

  • Scheidingsstijl
  • Scheidingspositie
  • Lijnstijl
  • Lijnkleur
  • Dikte en breedte

Typografie

bever stijl typografie

Het typografie opties zijn om te bepalen hoe uw tekst wordt weergegeven. Deze instelling verschijnt meestal voor de rubriek module. Hier heb je opties voor:

  • HTML-tag
  • Lettertype, grootte en gezicht
  • Tekst kleur
  • Marges

Styling Conclusie

Beide plug-ins bieden een breed scala aan stylingopties en configuraties. Ze laten een einde toeless maatwerk tot in de kleinste details van elk element op een pagina. We zijn van mening dat beide pagebuilders in dit opzicht grotendeels gelijkwaardig zijn.

Sjablonen

Tot nu toe hebben we krachtige tools gezien waarmee we vanaf het begin aangepaste pagina's kunnen bouwen. Maar zou het niet beter zijn als we sjablonen hebben om te gebruiken? Sjablonen zouden het ontwerpproces veel sneller laten verlopen.

Het mooie is dat zowel Elementor als Beaver Builder bieden sjabloonfuncties. 

In deze context zijn sjablonen kant-en-klare ontwerpen die u kunt gebruiken om het ontwerp van uw pagina's een vliegende start te geven. Zowel Elementor als Beaver Builder biedt ons tal van sjablonen om uit te kiezen.

Als webdesigners of -ontwikkelaars wil je waarschijnlijk de mogelijkheid hebben om je eigen thema's of specifieke paginasjablonen te maken die je kunt hergebruiken/aanpassingen als onderdeel van je ontwerpproces.

Laten we kijken.

Elementor-sjablonen

Wanneer je in Elementor een nieuwe pagina aanmaakt, zul je zien dat je een optie hebt om een ​​sectie toe te voegen of een sjabloon te gebruiken.

In de gratis versie heb je ongeveer 40 sjablonen om uit te kiezen. In de Pro-versie heb je meer dan 300 verschillende pagina's en bloksjablonen om uit te kiezen.

Bezoek de website om alle sjablonen te bekijken

elementof nieuwe sjabloon

Na klikken op de Sjabloon toevoegen knop, wordt u begroet met een menu met de sjablonen waaruit u kunt kiezen.

elementor sjabloonkiezer

Elementor biedt twee soorten sjablonen: blok- en paginasjablonen.

Bloksjablonen zijn sectiesjablonen die u kunt gebruiken om specifieke delen van uw pagina te bouwen. Een voorbeeld van een bloksjabloon is een contactformulier of een CTA-sectie.

Hieronder ziet u voorbeelden van beschikbare CTA-sjablonen.

elementor blok sjablonen

Paginasjablonen zijn paginagrote sjablonen die zijn ontworpen voor specifieke soorten pagina's en/of doeleinden via de builder-plug-in.

Hieronder ziet u sjablonen voor een landingspagina en homepage. Verder zijn er verschillende smaken om uit te kiezen. U heeft bijvoorbeeld een homepage-sjabloon op maat gemaakt voor restaurants en een op maat gemaakt voor bureaus.

elementor paginasjablonen

U kunt ook uw aangepaste paginasjablonen maken en zelfs volledige thema's opslaan voor hergebruik. U kunt dat doen door op de kleine pijl omhoog naast de publicatieknop te klikken en Opslaan als sjabloon te kiezen.

elementor aangepaste sjablonen

U kunt zelfs sjablonen van derden importeren door ze naar uw site te uploaden. Dit zorgt voor eindeless maatwerk mogelijkheden.

elementor importsjabloon

Beaver Builder Sjablonen

In Beaver Builder, hebt u drie soorten sjablonen waaruit u kunt kiezen: bestemmingspagina's, inhoudspagina's en opgeslagen sjablonen. In tegenstelling tot Elementor, Beaver Builder heeft geen sjablonen op blokniveau, hoewel u plug-ins kunt gebruiken om dezelfde functionaliteit te krijgen.

Klik hier om alle sjablonen te zien

Merk op dat de gratis versie van Beaver Builder heeft helemaal geen sjabloonopties, dus je zult alles vanaf het begin moeten doen als je de gratis versie wilt gebruiken.

beaver builder templates

Bestemmingspagina-sjablonen zijn voor het maken van uitgebreide bestemmingspagina's. Op het moment van schrijven kun je binnen 30 verschillende sjablonen voor bestemmingspagina's kiezen Beaver Builder.

bever bestemmingspagina sjabloon

Sjablonen voor inhoudspagina's zijn voor inhoudspagina's zoals over pagina, contactpagina, startpagina, enz. Op het moment van schrijven zijn er 25 sjablonen voor inhoudspagina's om uit te kiezen Beaver Builder.

bever inhoud paginasjabloon

 

Opgeslagen sjablonen zijn uw aangepaste opgeslagen sjablonen. Net als in Elementor kun je met de builder een pagina als sjabloon maken, zodat je deze later opnieuw kunt gebruiken.

Sjablonen importeren is ook mogelijk op Beaver Builder, maar het is niet zo intuïtief als Elementor's. U kunt zien hoe het dit doet door hun documentatie te lezen CDL Super Session..

Sjablonen Conclusie

de Elementor-builder biedt meer sjablonen om uit te kiezen en eenvoudigere opties voor het importeren en exporteren van sjablonen dan Beaver Builder. Wat betreft de Design en uiterlijk, beide plug-ins bieden u een breed scala aan prachtige sjablonen die geschikt zijn voor veel verschillende soorten niches.

Wat betreft hun gratis versies, Elementor wint zonder twijfel tegen Beaver Builder. Met Elementor kun je nog steeds kiezen uit meer dan twee dozijn gratis sjablonen en zelfs de mogelijkheid om ze te importeren en exporteren. Op Beaver Builder, moet u upgraden naar hun premiumversie om van deze functie te profiteren.

Thema bouwen

De themabouwfunctie is een zeer krachtige tool die zowel Elementor als Beaver Builder haar gebruikers aanbiedt.

Voor Elementor wordt de themabouwer automatisch ontgrendeld zodra u een upgrade naar hun premiumversie uitvoert. Wat betreft Beaver Builder, moet u een afzonderlijke plug-in installeren met de naam Beaver Themer, wat een afzonderlijke aankoop van $ 147 is.

Themabouwer van ElementorBuild

Om toegang te krijgen tot de themabouwer, gaat u naar Sjablonen > Themabouwer. Van daaruit kunt u themasjablonen maken of bewerken. U kunt sjablonen maken of bewerken voor:

  • Pagina
  • Voorvoegsel
  • footer
  • Los bericht
  • Archief
  • 404 Pagina's
  • Enz.

De themabouwer van Elementor werkt vrijwel hetzelfde als de paginabuilder.

Je hebt alle normale elementen plus nieuwe en specifieke elementen voor het type themasectie waaraan je werkt. Zo ziet de themabouwer er bijvoorbeeld uit Enkele post.

elementor enkele post-editor

Zoals je kunt zien, heb je een nieuwe set WordPress-widgets die specifiek zijn voor afzonderlijke berichten, zoals de titel van het bericht, de aanbevolen afbeelding, het plaatsen van opmerkingen, enz.

Als u niet helemaal opnieuw wilt beginnen, zijn er ook vooraf gemaakte sjablonen die u kunt gebruiken, die u kunt openen door op het mappictogram in de inhoudeditor te drukken, net zoals u zou doen in de gewone paginabuilder.

Als u klaar bent met het maken van uw aangepaste themasjabloon, kunt u bepalen waar en wanneer deze wordt weergegeven. U kunt er bijvoorbeeld voor kiezen om uw aangepaste sjabloon voor één bericht alleen voor een bepaalde auteur van een bericht weer te geven.

Beaver Builder's Thema Bouwer

Beaver Builder's themabouwer, hoewel anders geactiveerd, werkt vergelijkbaar met die van Elementor's themabouwer. Dit is een geweldig hulpmiddel als uw klanten vereisen dat u aangepaste thema's voor hen maakt.

Je hebt alleen toegang tot de themabouwer als je de Beaver Themer-plug-in hebt geïnstalleerd. Zodra je het hebt geactiveerd, heb je toegang tot Beaver Builder > Thema-indelingen en van daaruit kunt u een aangepaste sjabloon maken voor het volgende:

  • Voorvoegsel
  • footer
  • Archief
  • Enkele berichten (enkelvoud)
  • 404 pagina's
  • Deel

 

beaver builder thema bouwer

Als je eenmaal hebt besloten welke lay-out je wilt maken of bewerken, kun je deze verder aanpassen door te kiezen waar en wanneer deze zou verschijnen.

Voor de aangepaste voettekst kunt u bijvoorbeeld kiezen of deze op uw hele site wordt weergegeven en uw standaardvoettekst vervangt, of dat deze alleen op bepaalde berichten of pagina's wordt weergegeven.

Je kunt het ook verder aanpassen door het alleen weer te geven wanneer een bericht door een bepaalde auteur is geschreven.

Deze op regels gebaseerde aanpassing in Beaver Builder is behoorlijk krachtig spul omdat het veel flexibiliteit en aanpassingsmogelijkheden met zich meebrengt.

beaver builder thema aangepaste regels

Wat betreft de editor zelf, je hebt dezelfde gebruikersinterface als de Beaver Builder pagina builder.

Hieronder kunt u de themalay-outeditor in actie zien, waar we de aangepaste voettekst bewerken die we hebben gemaakt. Je hebt toegang tot hetzelfde aantal modules en andere elementen als in de reguliere pagebuilder.

beaver builder thema-editor

Themabouwer Conclusie

Beide builder-plug-ins bieden uitstekende controle en aanpassing voor het bouwen van thema's. Als we het echter over prijzen hebben, is de Elementor-builder-plug-in goedkoper dan Beaver Builder omdat de themabouwer is geïntegreerd in de premium-versie.

Tarieven

We hebben de twee plug-ins al behoorlijk vergeleken en we hebben gezien wat je kunt krijgen in hun gratis en Pro-versies. Maar hoeveel kost elke bouwer? En welke geeft u de meeste waarde?

Beide premium builder-versies zijn verkrijgbaar in drie prijsniveaus.

Elementor-prijzen

Laten we beginnen met Elementor. Er zijn persoonlijke, zakelijke en onbeperkte prijsopties.

  • persoonlijk - $ 49 voor een enkele site.
  • Busines - $ 99 voor drie sites.
  • Expert - $199 voor 25 sites
  • studio - $499 voor 100 sites
  • Zo vaak als u wilt - $ 999 voor onbeperkte sites.

elementor prijsstelling

Alle abonnementen hebben hetzelfde aantal functies en blijven gedurende 1 jaar premium ondersteuning en updates ontvangen en worden geleverd met de themabouwer.

Klik hier voor de laagste prijs op Elementor

Beaver Builder Tarieven

Zoals Elementor, Beaver Builder prijsstelling komt ook in drie niveaus.

  • Standaard - $ 99
  • Pro - $ 199
  • Agentschap - $ 399

 

BB-prijzen

Het standaard licentie heeft geen ondersteuning voor meerdere locaties en Beaver Builder Thema. De voor licentie is geschikt voor multisite-ondersteuning en wordt geleverd met de Beaver Builder Thema maar er is geen white labeling.

Ten slotte agentschap licentie heeft alle standaard- en pro-functies plus witte etikettering. Alle abonnementen zijn voor onbeperkte sites.

Houd er rekening mee dat Beaver Themer een afzonderlijke aankoop is van Beaver Builder zelf dat $ 147 kost.

Klik hier voor de laagste prijs op Beaver Builder

Gratis versus Pro

Beide plug-ins worden geleverd met gratis en Pro-versies, maar de gratis versie van Elementor is hier de duidelijke winnaar.

De gratis versie van Elementor wordt geleverd met tientallen gratis modules en sjablonen. Beaver Builder komt alleen met zeer eenvoudige, waardoor het zeer beperkt is in de gratis versie.

Prijs conclusie:

Als u een gratis versie wilt, dan is Elementor uw duidelijke keuze.

Wat betreft de premium-versies, hoewel het misschien lijkt dat Beaver Builder is duurder, de hogere abonnementen bieden meer ontwikkelaarsvriendelijke functies, met name white labeling.

Bovendien, als u een ontwikkelaar bent die hosting wil doorverkopen, wilt u hier misschien eens naar kijken discussie. Kortom, Elementor staat u niet toe om de website van een klant zelf te hosten en hen een maandelijks bedrag in rekening te brengen als u Elementor gebruikt om hun website te bouwen of te ontwerpen.

We zijn van mening dat Elementor beter is voor solo-gebruikers, terwijl: Beaver Builder is beter voor ontwikkelaars - vooral vanwege de white labeling- en hostingopties.

Als u nog steeds op zoek bent naar andere opties, hebben we ook: beoordeeld Elementor vs Divi hier, en ook Beaver Builder vs Divi, of tot slot als je wilt meer beoordelingen, onze kijk op Divi, hoewel we denken dat u uw keuze op dit punt moet beperken en onze conclusie hieronder moet bekijken.

Elementor versus Beaver Builder: Gevolgtrekking

Over het algemeen zijn dit momenteel de twee beste plug-ins voor paginabuilder voor WordPress. 

Elementor biedt een enorme hoeveelheid sjablonen en elementen, terwijl Beaver Builder probeert het simpel te houden, maar voldoet toch aan de behoefte van elke webdesigner.

Beaver Builder is ontwikkelaarvriendelijk. Het biedt white label-opties en heeft geen beperkingen op hoe ontwikkelaars services of websites kunnen verkopen die ermee zijn gebouwd.

Elementor is niet open-source terwijl Beaver Builder is, maar Elementor is over het algemeen krachtiger.

Vanuit een beveiligingsperspectief heeft Elementor een serieuze beveiligingslek in het verleden, maar dat is opgelost en het product blijft groeien, met recentelijk 5 miljoen actieve installaties en met een sterke strategie om binnenkort 10 miljoen te bereiken!

Dus ja, je koopt zeker een goed product!

Als je een solo-ontwikkelaar of gebruiker bent die op zoek is naar een uitstekende plug-in met tal van functies en snelle updates, ga dan met de Elementor-plug-in voor paginabuilder. Als je een ontwikkelaar of een gebruiker bent die niet overweldigd wil worden door talloze functies en snelle updates, kies dan Beaver Builder.

Maar uiteindelijk is het allemaal aan jou om de uiteindelijke beslissing te nemen.

Als beide Beaver Builder en Elementor zijn beide voortdurend in ontwikkeling, er is geen duidelijke winnaar, maar we vinden Elementor nog steeds net iets beter, hoewel je gemakkelijk de juiste beslissing kunt nemen op basis van de factoren die we hebben geschetst en je huidige behoeften.

Bezoek Elementor

 

Over de auteur
David Attard
Auteur: David AttardWebsite: https://www.linkedin.com/in/dattard/
David heeft de afgelopen 18 jaar in of rond de online / digitale industrie gewerkt. Hij heeft uitgebreide ervaring in de software- en webdesign-industrie met WordPress, Joomla en niches eromheen. Als digitale consultant richt hij zich op het helpen van bedrijven om een ​​concurrentievoordeel te behalen door een combinatie van hun website en digitale platforms die vandaag beschikbaar zijn.

Nog een ding... Wist je dat mensen die nuttige dingen zoals dit bericht delen er ook GEWELDIG uitzien? ​
Alstublieft laat een nuttig geef commentaar met je mening, deel dit dan op je Facebook-groep (en) die dit nuttig zouden vinden en laten we samen de vruchten plukken. Bedankt voor het delen en aardig zijn!

Disclosure: Deze pagina kan links bevatten naar externe sites voor producten die we geweldig vinden en die we van harte aanbevelen. Als u producten koopt die we aanbevelen, kunnen we een verwijzingsvergoeding verdienen. Dergelijke vergoedingen hebben geen invloed op onze aanbevelingen en we accepteren geen betalingen voor positieve beoordelingen.

Auteur (s) Uitgelicht op:  Inc Magazine-logo   Sitepoint-logo   CSS Tricks-logo    webdesignerdepot-logo   WPMU DEV-logo   en nog veel meer ...