Dus, je bent op zoek naar een nieuwe WordPress-paginabuilder-plugin. Hoe kies je tussen Beaver Builder of Divi, terwijl dit twee van de populairste producten zijn?
Mogelijk hebt u wat vooronderzoek gedaan en bent u tot de conclusie gekomen dat dit de twee meest aanbevolen keuzes zijn voor het bouwen van websites. Bovendien bieden ze vergelijkbare tools als andere toonaangevende paginabuilders.
Nu wil je weten welke van deze populaire plugins de beste is. En bovenal, wat je geld waard is?
{automatisch}
We gaan alle belangrijke functies van deze paginabuilder-plugins bekijken en ze rechtstreeks met elkaar vergelijken, zodat u de beste kunt vinden.
Lees verder om te ontdekken welke de beste pagebuilder-plugin voor WordPress is. Als je geïnteresseerd bent in WordPress-plugins in het algemeen, kun je ook onze andere reviews en samenvattingen op onze website bekijken. Collectiveray.
We hebben sites draaien waarop beide producten zijn geïnstalleerd, dus we hebben dit artikel opnieuw bekeken in Juni 2025 om alle relevante details indien nodig bij te werken.
Beaver Builder tegen Divi
Beaver Builder is erg gebruiksvriendelijk, maar Divi heeft meer aanpassingsmogelijkheden. Beide producten geven je toegang tot professioneel ogende lay-outs. Divi heeft meer dan 2,000 lay-outs, vergeleken met Beaver Builder's 50 sjablonen. Divi is iets goedkoper dan Beaver Builder voor $ 89 inclusief alle producten van ElegantThemes.
![]() |
![]() |
|
Prijs | $89 (inclusief alle ET-plugins en WordPress-thema's) | $ 99 + |
Gratis versie | Nee | Ja |
Realtime-editor | Ja | Ja |
Frontend / Backend | Beiden | Beiden |
Doelgroep | Ontwikkelaar / Ontwerper / Gebruiker | Webontwikkelaar / ontwerper |
Ondersteunde elementen | 200+ | 31 |
Schone code | Ja | Ja |
Vooraf gemaakte sjablonen / lay-outs | 2,000+ | 50+ |
Coole functie | A/B-testing | Bever Themer |
Prestatie | ⭐⭐⭐⭐⭐ | ⭐⭐⭐⭐ |
Wat we leuk vonden | Een zeer krachtige oplossing voor het maken van elk type lay-out | Eenvoudige gebruikersinterface |
Superieure lay-outbeheeropties | De inhoud blijft intact, zelfs na het deactiveren van de plugin | |
Aantrekkelijke prijzen met toegang tot veel andere WordPress-thema's en plug-ins | Unieke editormodus voor klanten | |
Nieuwe prestatieverbeteringen veranderen het spel | Hiermee kunt u WordPress-widgets in de lay-outs gebruiken | |
Wat we niet leuk vonden | Het kost wat tijd om eraan te wennen | Duurder dan de andere paginabuilders |
Het laden van de frontend-editor duurt even. | Niet zoveel hulpbronnen | |
globaal | ⭐⭐⭐⭐⭐ | ⭐⭐⭐⭐ |
Winnaar | 🏆 | |
Website | Bezoek Elegante thema's (10% KORTING) | Bezoek Beaver Builder |
Waarom een paginabuilder gebruiken?
Als je relatief nieuw bent in de wereld van WordPress, ken je mogelijk niet de volledige geschiedenis van page builders en hoe ze zijn ontstaan.
Tot een paar jaar geleden kon WordPress in principe zowel pagina's als berichten aanmaken. Beide contentitems lijken erg op elkaar.
Ze ondersteunden voornamelijk tekst en afbeeldingen en alledaagse websitecontent, zoals blogberichten.
Als je iets mooiers wilde, moest je indien nodig plugins en/of shortcodes gebruiken.
Shortcodes waren geweldig omdat je daarmee specifieke kenmerken en functies op elke gewenste plek op een pagina kon invoegen.
Maar ze hadden nog steeds hun beperkingen: je moest nog steeds een heleboel verschillende plug-ins installeren om meerdere verschillende elementen op een pagina te kunnen gebruiken.
Als je schuifregelaars, call-to-action-knoppen, video's, afbeeldingsgalerijen en andere dingen wilde, moest je steeds meer plug-ins toevoegen.
Dit bracht nog een ander probleem met zich mee: hoe meer producten u aan uw installatie toevoegde, hoe zwaarder uw website werd en hoe gevoeliger deze was voor beveiligingsproblemen die voortkwamen uit de verschillende items die u moest installeren.
Dit was een probleem.
Er was nog een probleem. Je kon geen pagina of bericht aanmaken. visueelJe moest een pagina ontwerpen met behulp van shortcodes en na een aantal iteraties van wijzigingen kwam je tot een resultaat dat dicht in de buurt kwam van wat je wilde.
Uiteindelijk kwamen ontwikkelaars en leveranciers erachter dat de meeste mensen hun eigen pagina's wilden kunnen ontwerpen en definiëren, zonder beperkingen. Ze wilden geen sjablonen gebruiken, waardoor alle websites er hetzelfde uitzagen.
En zo ontstond het concept van paginabouwers.
Dit is in essentie de kern van zo'n functie: de mogelijkheid om verschillende elementen te slepen en neer te zetten om een pagina of bericht te ontwerpen en te definiëren op de manier die JIJ wilt.
Lees verder: Assistent Pro - sla pagina-buildersjablonen op het web op
We weten niet zeker wie het eerste page builder-product heeft bedacht, maar Elegant Themes is ongetwijfeld een van de leveranciers die dit concept zeer succesvol heeft gemaakt.
Zodra mensen het potentieel zagen, sprongen alle grote leveranciers erop.
Tegenwoordig bundelen de meeste grote leveranciers een soort visuele paginabuilder in hun pakket. thema's - Als ze er zelf geen hebben, werken ze samen met iemand die deze functie in hun thema kan inbouwen/activeren.
Dus hoe zit het met Divi en Beaver Builder?
Divi
ElegantThemes zijn al zo lang in deze niche dat ze echt hebben begrepen wat mensen willen en hebben het hen gegeven - hun product is een van de populairste in de buurt, met meer dan 600,000, 880,000 verkopen.
Ze richten zich op gebruikers die een website willen maken, maar zich niet willen verdiepen in wat er onder de motorkap gebeurt. Ze willen gewoon dat alles werkt, zonder dat ze zich in de techniek hoeven te verdiepen of met code hoeven te rommelen.
Doelgroep van Elegant Themes:
Mensen die een website willen laten ontwerpen en operationeel willen hebben zonder een ontwikkelaar in te schakelen or veel kennis over code hebben.
Voorbeeldgebruikers:
- Eigenaren van kleine bedrijven
- Bloggers
- SEO
- Eigenaars van aangesloten websites
- Content schrijvers die websites maken
- Web ontwerpers
- Digitale marketingbureaus
Als je naar de onderstaande afbeelding kijkt, zie je dat Divi gericht is op de ontwerper. Sterker nog, misschien wil je er wel een paar bekijken. live Divi-themavoorbeelden hier. En deze jongens lopen altijd voorop in de technologie, omdat ze net zijn opgericht AI in Divi.
Beaver Builder
Beaver Builder heeft een ander soort gebruiker. Terwijl ElegantThemes richt zich op degenen die minder "technisch" zijn, Beaver Builder richt zich op gebruikers die in hart en nieren ontwerpers en ontwikkelaars zijn.
Divi heeft een aantal beperkingen die deze ontwikkelaars frustrerend vinden, en Beaver Builder identificeert en verhelpt deze problemen op een prettige manier.
Hierdoor is dit product populair geworden bij mensen die zich eerder identificeren als ontwikkelaars.
Als u geïnteresseerd bent in hoe Elegant Themes-producten zich verhouden tot andere populaire opties die er zijn, kunt u ook de volgende twee artikelen lezen die we hebben geschreven:
https://www.collectiveray.com/divi-vs-genesis
en
https://www.collectiveray.com/divi-vs-avada
Verdergaand op de afbeelding hierboven, Beaver Builder zou meer op zijn gemak zijn bij de ontwikkelaar.
Doelgroep van BeaverBulder:
Webontwikkelaars en ontwerpers die van naar knutselen aan de code, volledige controle hebben over wat er gebeurt, dingen kunnen aanpassen zodat ze werken op de manier waarop zij dat willen, en niet op de manier waarop de leverancier het heeft ontworpen.
Voorbeeldgebruikers:
- webontwikkelaars
- Webdesigners die willen sleutelen aan code
- Digitale bureaus
- Freelancers
Nu we de introductie gehad hebben, kunnen we dieper ingaan op elk product. Zo krijgen we een beeld van de kenmerken, functies, voor- en nadelen van deze twee producten.
Laten we beginnen met het bespreken van de gebruikersinterface van beide producten.
Beaver Builder vs Divi - WordPress Page Builder UI en UX
Omdat we doorgaans veel tijd besteden aan de back-end van onze paginabuilders, bekijken we eerst hoe elke builder eruitziet en welke gebruiksvriendelijkheid ze bieden.
De Divi Builder Interface
ElegantThemes Ze werken al jaren aan hun product en dat is te zien. Met een sterke community die hen steunt en veel goede feedback geeft, weten deze jongens precies hoe ze hun gebruikers moeten volgen.
Ze hebben een interface gebouwd die volledig gericht is op een geweldige gebruikerservaring.
Ze hebben niet voor niets massa's fans opgebouwd. Hun strikte focus op het ontwerp en de bruikbaarheid van hun product is een van de belangrijkste aspecten geweest die deze bouwer zo succesvol hebben gemaakt.
Bekijk deze korte introductievideo (2 minuten). Deze is van de allereerste versie van Divi (2015). Er is sindsdien veel veranderd, maar het is handig om een kort overzicht te krijgen van de mogelijkheden.
https://www.youtube.com/watch?v=zH0xUAb3Yws
Laten we eens kijken naar de gebruikersinterface in het echt.
Nadat u Divi hebt geïnstalleerd, kunt u de builder gebruiken door een nieuw bericht of een nieuwe pagina te maken.
Het eerste wat je ziet is dit:
Als u op de Gebruiken Divi Builder Met de knop wordt u doorgestuurd naar de nieuwe visuele editor.
Deze functie is een reactie op de introductie van de nieuwe WordPress-blokeditor, zoals u kunt zien op de afbeelding hierboven. De oude Divi back-end editor is nu niet beschikbaar voor gebruik met de nieuwe berichteneditor.
Daarom heeft Elegant Themes zich gericht op het verbeteren van de visuele front-end editor en ervoor gezorgd dat de back-end en front-end naadloos met elkaar zijn geïntegreerd.
U kunt er echter nog steeds voor kiezen om terug te gaan naar de klassieke Divi-backend-editor, maar ook naar de klassieke WordPress-berichteditor.
Het enige wat u hoeft te doen is naar Divi > Plugin-opties > Geavanceerd.
Schakel de "Klassieke editor inschakelen” om de originele WordPress-berichteditor terug te brengen.
Als u deze optie inschakelt, wordt ook de volledige back-end-editor van Divi teruggehaald. “Schakel de nieuwste Divi Builder Ervaring" Als u deze optie uitschakelt, komt de Divi backend builder van vóór Gutenberg terug (houd er echter wel rekening mee dat u een aantal van de nieuwste functies en verbeteringen van de moderne builder verliest).
Met de front-end real-time editor kunt u nu ontwerpen en visualiseren de pagina waar u on-the-fly aan werkt.
Dit is ronduit een geweldige functie, omdat u niet hoeft te "raden" of de front-end hoeft te vernieuwen om het resultaat van het ontwerp waaraan u werkt te zien.
Je kunt het zien terwijl je het ontwerpt.
Dit is wat ElegantThemes zijn aan het bellen "Een nieuwe visuele ervaring".
De nieuwe Divi visuele builder vervangt de oudere back-end/front-end editors.
Hieronder zie je hoe de nieuwe builder eruitziet. Merk op hoe je met één muisklik naadloos kunt schakelen tussen de backend (wireframe) en frontend.
Dit is een complete WYSIWYG-ervaring (What You See is What You Get).
Om toegang te krijgen tot de paginabuilder vanuit de backend, ga naar Berichten > Voeg een nieuwe.
Je ziet een nieuwe pagina met drie opties: Vanaf nul bouwen, Een kant-en-klare lay-out kiezen of een pagina klonen.
Nadat u uw keuze hebt gemaakt, ziet u de optie om een nieuwe pagina te maken, om te kiezen uit de lijst met sjablonen of om een pagina te selecteren die u wilt klonen.
We kiezen ervoor om de pagina helemaal opnieuw te maken, zodat u kunt zien wat er gebeurt.
Klik op de resulterende pagina op “Gebruik de Divi Builder"knop. Dit opent de interface, die er als volgt uitziet
Divi (die we hier al hebben besproken) Hiermee kunt u aparte secties maken voor verschillende delen van de pagina. Het ondersteunt drie typen secties: standaard, volledige breedte en speciale secties.
Voor de standaard- en volledige breedtesecties kunt u kiezen voor een kolomstructuur. Er zijn talloze combinaties mogelijk, waaronder twee, drie en vier kolommen in verschillende formaten.
De speciale sectie bevat negen speciaal ontwikkelde kolomstructuren. U kunt meerdere rijen binnen een sectie toevoegen om meerdere kolomstructuren te krijgen.
Nadat u een lay-out hebt gekozen, kunt u modules toevoegen aan de afzonderlijke kolommen. U vindt aparte opties om de module-inhoud aan te leveren, de ontwerpopties te configureren en aangepaste CSS te maken.
U kunt de modules, kolommen, rijen en secties verplaatsen door ze naar de gewenste locatie te slepen en neer te zetten. Er zijn speciale knoppen om de sectie met instellingen voor elk van deze items te verwijderen, dupliceren en openen.
U kunt ook de geschiedenisfunctie gebruiken om de laatste handelingen ongedaan te maken, opnieuw uit te voeren en terug te keren naar de vorige handelingen.
Zodra de frontend-paginabuilder geladen is, kunt u beginnen met het aanpassen van de pagina.
Net als bij de backendinterface kunt u een nieuwe sectie toevoegen, de kolomstructuur kiezen en hebt u volledige toegang tot alle module-instellingsopties.
Een ontwerper zonder drag and drop is natuurlijk kansloos, maar dit product kan dat heel goed.
Het is niet alleen een kwestie van slepen en neerzetten, maar het blijft ook responsief terwijl u ontwerpt.
Omdat u aan de daadwerkelijke blokken met inhoud en elementen gaat werken, zult u de daadwerkelijke stukken inhoud verslepen.
En uiteraard is alles nog steeds volledig responsief.
Bekijk de onderstaande korte demo van live, responsieve blokken.
U kunt de modules, rijen en kolommen slepen en neerzetten, maar ook kopiëren, plakken, verwijderen of bewerken, afhankelijk van uw wensen.
Krijg 10% KORTING op Divi tot Juni 2025
PS. Bovenstaande aanbieding is alleen geldig via CollectiveRay.
Dus hoe zit het met ElegantThemes concurrent? Doet Beaver Builder dezelfde flexibiliteit hebben? Werkt het realtime aan de front-end?
Lees de rest van dit artikel om het antwoord op deze vragen te vinden.
De Beaver Builder Interface
Omdat we niet achter willen blijven in de race om de dominantie van paginabouwers, Beaver Builder is met getrokken wapens tevoorschijn gekomen.
Of tandenknarsen, als we de Bever-analogie willen aanhouden. 😀
Beaver Builder biedt zowel bewerkingsmogelijkheden in de frontend als in de backend, dus op dat vlak loopt de site niet achter.
Het kan gebruikt worden op pagina's, berichten en de meeste andere aangepaste WordPress-typen, zolang deze zijn ingeschakeld.
Als u op het tabblad Beheerder voor het betreffende aangepaste type klikt, wordt de builder geladen, zodat u deze kunt gebruiken om uw content te ontwerpen.
Voordat we verdergaan, kunt u de volgende korte video (2 minuten) bekijken over het gebruik van Beaver Builder.
https://www.youtube.com/watch?v=tCNDDQ7Jrs8
In wezen gaat u bij de backendmethode, nadat u eerst bent ingelogd op uw dashboard, naar Berichten > Voeg een nieuween klik op de "Pagina Builder"Knop.
Hiermee open je de interface van de paginabuilder, die er ongeveer zo uitziet:
De eerste stap is het kiezen van een sjabloon voor de pagina. Je kunt een van de kant-en-klare sjablonen kiezen of met een blanco sjabloon aan de slag gaan om je eigen sjabloon te maken.
Nadat u de sjabloon hebt gekozen, kiest u de rijindeling.
U kunt de rijindeling kiezen in de linkerzijbalk. Open de zijbalk door op de knop "Content toevoegen"knop in het menu linksboven op de pagina.
Het menu bevat ook een aantal andere knoppen om de sjabloon te wijzigen, de hulpmiddelen en sectie te openen, de pagina te publiceren en een speciale helpknop.
Beaver Builder biedt verschillende kolomstructuren, waaronder één, twee, drie, vier, vijf of zes kolommen en rijen met linker-, rechter- of beide zijbalken.
Versleep de rijindeling eenvoudig naar de gewenste positie op de pagina.
De volgende stap is het toevoegen van modules aan de kolommen. Je vindt de modules in de linkerzijbalk.
Kies de module die u wilt gebruiken en sleep deze naar de gewenste kolom op de pagina. U krijgt nu het venster met module-instellingen te zien.
Er zijn verschillende secties waarmee u de inhoud en stijl van de module kunt beheren.
U kunt de rijen en modules slepen en neerzetten om hun positie te wijzigen. Er zijn aparte knoppen om de instellingen voor elke rij of module te verwijderen, dupliceren of openen.
Het is ook mogelijk om de kolomstructuur van een rij te wijzigen.
Om toegang te krijgen tot de paginabuilder vanuit de frontend, ga je naar de pagina die je wilt bewerken en klik je op de knop “Pagina Builder"-knop. Dit opent dezelfde interface als bij het aanmaken van de pagina vanuit de backend.
Je kunt met het bestaande ontwerp werken of een nieuwe lay-out kiezen. Alle andere opties, zoals het toevoegen van verschillende rijen, modules, widgets en het beheren ervan, zijn precies hetzelfde als in de backend.
Wilt u een gratis live demo zien van Beaver Builder Nu? Klik op de onderstaande knop. (Opent in een nieuw venster)
Probeer de BeaverBuilder demonstratie
Beaver Builder vs Divi - Modules
Gebruiksvriendelijkheid is slechts één aspect van een pagebuilder. Het aantal modules dat het biedt zonder dat je extra plugins hoeft te installeren, speelt ook een rol.
Divi Builder
Deze plugin wordt momenteel geleverd met meer dan 200 inhoudsmodules (Elementen in Divi-speak).
Over nieuwe releases gesproken: de nieuwe prestatie-update voor Divi die in augustus 2021 werd gelanceerd, heeft Divi bovenaan de wachtrij voor WordPress-thema's geplaatst.
Pagina's die zijn gebouwd met de nieuwe versie van Divi laden sneller dan ooit dankzij een reeks codeverbeteringen onder de motorkap.
Nieuwere versies van Divi, zoals 4.20 die in februari 2023 uitkwamen, hebben de werking en laadsnelheid drastisch verbeterd.
Deze verbeteringen omvatten:
- 94% kleinere CSS
- Intelligente CSS die alleen laadt wat nodig is
- Slimme stijlen verminderen duplicatie tussen stijlbladbladen voor sneller laden
- Dynamische PHP voor snellere verwerking
- JavaScript-optimalisatie
- Uitstel van Gutenberg-stijlblad
- jQuery-uitstel
Hieronder vindt u de meest voorkomende:
- Tekst
- Zoeken
- Accordeon
- Knop
- CTA
- Audio
- Video
- Aangepaste code
- verdeler
Geavanceerde keuzes voor elementen zijn onder meer:
- Counter
- Aanmelden
- Portfolio
- Inloggen
- Wereldmap
- Persoon
- prijstabel
- Testimonial
- Videoschuifregelaar
Natuurlijk zijn dit niet de enige beschikbare modules, maar als we ze zouden blijven opnoemen, aangezien er meer dan 200 elementen worden ondersteund, zouden we hier voor altijd blijven hangen.
Laten we zeggen dat u hoogstwaarschijnlijk een module kunt vinden die aan alle vereisten voldoet.
Daarnaast zijn er nog extra module-plugins voor de weinige die je nodig hebt, maar die Divi niet heeft.
Met versie 3.1 is een API ontwikkeld en vrijgegeven, dus u kunt verwachten dat er overal aangepaste elementen en modules opduiken.
Er komen leuke tijden aan!
Laten we eens kijken wat voor fantastische dingen andere ontwikkelaars gaan bedenken. Blijf op de hoogte.
Maar goed, genoeg daarover. Laten we eens kijken hoe je een module gebruikt:
Klik op de gewenste module om deze aan het bericht toe te voegen. Nu moet je de module-instellingen configureren.
De paginabuilder biedt u hiervoor drie secties:
- Beschrijving
- Design
- Geavanceerd
De Beschrijving In dit gedeelte vindt u alle opties met betrekking tot de inhoud van uw gekozen module.
Design Hiermee kunt u de kleur, het lettertype, de achtergrondstijl, de rand, de marge en de opvulling voor de module kiezen.
Tenslotte Geavanceerd bevat speciale velden voor het toevoegen van aangepaste CSS-ID's en -klassen en voor het toepassen van aangepaste CSS vóór of na de module of op de hoofdinhoud.
Wilt u nu meer informatie over deze plugin lezen? Klik op onderstaande knop om naar de ElegantThemes website.
Krijg 10% KORTING op Divi tot Juni 2025
PS. Deze aanbieding is alleen geldig via bovenstaande link.
Beaver Builder
Beaver Builder bevat in totaal 29 modules en verdeelt deze in drie categorieën:
- Standaard modules
- WordPress Widgets
- Opgeslagen modules
Standaardmodules omvatten:
- Tekst editor
- Titel
- HTML
- Knop
- Beeld
- Video
- audio
- Separator
De categorie WordPress bevat enkele bekende modules:
- Archief
- Agenda
- Categorieën
- meta
- RSS
- Navigatie menu
- En anderen
In het gedeelte Opgeslagen modules worden alle modules weergegeven die u hebt gemaakt en opgeslagen voor later gebruik.
De plugin biedt drie secties om een module te beheren:
- Snel naar
- Style
- Geavanceerd
Onder deze, de Snel naar In dit gedeelte kunt u de instellingen met betrekking tot het moduletype configureren.
De Style In dit gedeelte kunt u de kleur, uitlijning, het lettertype en andere stijlen voor de desktop- en mobiele versies kiezen.
Geavanceerd bevat opties om de zichtbaarheid en animatie in te stellen, samen met speciale velden voor het toevoegen van een CSS-klasse en ID.
U kunt een duidelijkere demo van de BeaverBuilder onderstaande kenmerken.
Bezoek de Beaver Builder Website
Het volgende deel van onze Beaver Builder vs Divi review gaat in op de beschikbare paginasjablonen of vooraf gedefinieerde lay-outs.
Dit zal uw leven eenvoudiger maken en u de mogelijkheid geven om binnen enkele uren of zelfs minuten, in plaats van weken, een compleet nieuwe website te ontwerpen.
Bekijk hieronder wat we bedoelen!
Beaver Builder vs Divi - Ingebouwde paginasjablonen
Ingebouwde paginasjablonen zijn er in wezen om je ontwerp- en ontwikkeltijd te verkorten. Door deze te gebruiken, hoef je de inhoud en het ontwerp slechts lichtjes aan te passen en je bent klaar!
Divi Builder Paginasjablonen (ook wel lay-outs genoemd)
Toen versie 3.0 uitkwam, werden er diverse (meer dan 100) kant-en-klare sjablonen meegeleverd, zodat u zo snel mogelijk aan de slag kunt.
Latere versies hebben er nog meer toegevoegd, waardoor het aantal inmiddels op ruim 2,000 staat!
U kunt een sjabloon gebruiken door op de optie 'Kies een vooraf gemaakte lay-out' te klikken wanneer u voor het eerst een nieuwe pagina of bericht laadt.
U vindt professionele lay-outs voor de landingspagina, binnenkort beschikbaar, over mij, contact, team, onderhoudspagina en verschillende variaties voor de homepage, blog, winkel en portfoliopagina's.
U kunt deze indelingen gebruiken zoals ze zijn, maar u kunt ze ook aanpassen aan uw wensen.
Natuurlijk kun je een groot aantal sjablonen (of zoals Divi ze noemt) voor pagina-indelingen hebben, maar de kern van de zaak is of ze ook daadwerkelijk goed en bruikbaar zijn om je eigen ontwerpen mee te maken.
Het idee is in essentie als volgt: u maakt een pagina in WordPress, laadt een vooraf gedefinieerde lay-out, vervolgens past u de tekst, afbeeldingen en andere inhoud aan zodat deze bij uw bedrijf past en voilà: u hebt een fantastische "ontworpen" website, zonder dat u daarvoor echte ontwerpkennis nodig hebt.
Dit is een enorme kracht voor mensen die snel aan de slag willen, maar niet zo vertrouwd zijn met code of ontwerp op zich.
Ter informatie: er zijn meer dan 2,000 lay-outs beschikbaar op het moment van schrijven van dit artikel.
Laten we eens snel kijken wat er allemaal beschikbaar is qua lay-outs.
Complete websitepakketten
Dit is een echte topper die volgens ons geweldig is voor de doelgroep waarop dit product gericht is. Aangezien we het hadden over mensen die snel iets van de grond willen krijgen, is de beschikbaarheid van complete websitepakketten echt een zegen.
In feite is dit een bundel van de 7 tot 8 essentiële, individueel ontworpen pagina's die iemand nodig heeft om binnen enkele minuten een volledige site te lanceren.
Kijk eens hoe Nick Roach van ET de waarde beschrijft die de lay-outs aan dit product toevoegen.Ja, je zult zien dat Nicks haar langer is. Er zit namelijk behoorlijk wat tijd tussen de twee video's!).
https://www.youtube.com/watch?v=Y31_8DPOqlY
De pagina's zijn toegespitst op de specifieke niche/branche en bevatten de essentiële elementen die voor dat specifieke soort bedrijf nodig zijn.
Het enige dat u als gebruiker hoeft te doen, is het ontwerp importeren en de inhoud aanpassen aan uw specifieke vereisten.
Hier zijn enkele niches die beschikbaar zijn als websitepakketten. Momenteel zijn er 31 layoutpakketten beschikbaar met in totaal 250 ontworpen pagina's.
- Restaurant landingspagina - dit is een pakket bestaande uit 8 pagina's met alles wat een restaurant of horecabedrijf nodig heeft om hun online aanwezigheid te lanceren, inclusief de openingstijden in de voettekst, zodat klanten er gemakkelijk toegang toe hebben.
- Ontwerpbureau - Het Design Agency Pack is een bundel van 9 pagina's met creatief en professioneel ontworpen pagina's voor een digitaal of designbureau. Uiteraard wordt er nadruk gelegd op werk en stijl, waarbij de vaardigheden van het bedrijf op een aantrekkelijke manier worden gepresenteerd.
- Mode-landingspagina - een branche die er online zeker goed uit moet zien, is een modeblog. Dit lay-outpakket van 8 pagina's is erop gericht om bloggers de mogelijkheid te bieden hun imago naar wens te promoten. Het is allemaal geweldig voor fotografen en andere visuele bedrijven.
- Reisbureau - het ontwerp is hier sterk gericht op de gebruiker die de site bezoekt en die overgaat tot actie. De huidige bezoeker wordt via aantrekkelijke Call To Action-knoppen aangespoord om te bellen of nu te boeken.
- Bruiloft Homepagina - een perfecte manier om snel een bruiloftsshowcase te lanceren. Natuurlijk ligt de focus hierbij vooral op de esthetiek en vele andere speciale kenmerken voor bruiloften.
- SaaS Company - een ander type bedrijf, meestal startups, die doorgaans weinig tijd te verliezen hebben en snel van start moeten gaan. Dit lay-outpakket biedt hen alles wat ze nodig hebben om van start te gaan en de benodigde informatie te verspreiden.
Er zijn nog veel meer indelingen beschikbaar, waaronder (maar niet beperkt tot):
- Learning Management System
- Coffeeshop
- Boerenmarkt
- Yoga- of fitnessstudio
- Foto Marktplaats
- Copywriting
- Bloemist
- Web Agency
- Interieurontwerpbedrijf
- Digitale betalingsactiviteiten
- Pottenbakkerij en ambachtsatelier
- SEO Agency
- Bedrijfsadvies
- Ontwerpconferentie
- Voedselrecepten
- Advocatenkantoor
- Auteur
- etc., etc.
Naarmate de tijd verstrijkt, blijft ET steeds meer lay-outs aan hun bibliotheek toevoegen om in specifieke niches te voorzien. Zelfs als uw specifieke branche momenteel niet wordt bediend, kunt u zeker een van de bestaande lay-outs aanpassen en naar uw wensen laten ontwerpen.
Beaver Builder Paginasjablonen
Beaver Builder Wordt ook geleverd met talloze professioneel ontworpen sjablonen. Bij het maken van een nieuw bericht wordt u gevraagd een sjabloon te kiezen.
U kunt ook de huidige sjabloon wijzigen door op de knop ‘Sjablonen’ te klikken.
Er zijn drie soorten lay-outs:
- Landingspagina's
- Inhoudspagina's
- Micropagina's
landing pagina's bevat sjablonen voor fysieke producten, apps, professionals, restaurants, technologie, mode, fotografie, mobiel, muziek, auto's, enzovoort.
Inhoudspagina's Inclusief sjablonen voor de benodigde webpaginapagina's, zoals over ons, diensten, portfolio, team, contact, FAQ, blog, enz. De meeste van deze sjablonen zijn beschikbaar in verschillende stijlen.
Micropagina's zijn kleine pagina's die op zichzelf kunnen staan of in een andere pagina kunnen worden opgenomen.
Omdat de sjablonen een afbeelding bevatten, kunt u eenvoudig de sjabloon kiezen die het beste bij uw wensen past.
Laten we eens wat dieper ingaan op wat er voor u als klant van Beaver Builder.
Landingspagina's
Beaver Builder heeft verschillende landingspagina-sjablonen ontworpen die direct te gebruiken zijn. Hieronder vindt u onder andere:
- Sjabloon voor kleine bedrijven - gebaseerd op het Probiz-sjabloon. Hiermee kunt u snel de aanwezigheid van een klein bedrijf creëren.
- Fitness-, sportschool- of sportsjabloon Fitness en sport zijn altijd een populaire niche en de template van The Body Factory is speciaal ontworpen voor klanten in deze branche. Yoga, de sportschool of andere fitnessbranches passen hier goed bij.
- Tijdschrift, Blogger, Modeblogger-sjabloon - Ook de Fashion Freaks-sjabloon is een populaire branche en heeft een hoogwaardige uitstraling die klasse, verfijning en luxe uitstraalt.
- Advocaat, advocatenkantoor sjabloon - een andere populaire niche: advocaten en advocatenkantoren zijn lucratieve klanten, die een aanwezigheid eisen die goedbetaalde klanten kan aantrekken. De professionele online aanwezigheid kan eenvoudig worden aangepast aan andere praktijkgerichte sectoren.
We zullen de rest van de sjablonen slechts kort vermelden - Fotografieportfolio sjabloon
- DJ / Muzikant / Band sjabloon
- Restaurant-/cafésjabloon
- Sjabloon voor volledig schermindeling
- Creatief webbureau sjabloon
- eBook-sjabloon
- Onderwijs- of universiteitssjabloon
- Auto's / Automobiel sjabloon
- Mobiele app-sjabloon
- Algemene zakelijke sjabloon
- Bouwsjabloon
- Binnenkort beschikbaar sjabloon
Wij raden u ten zeerste aan om de demo's van elk van deze sjablonen te bekijken, zodat u zelf kunt zien hoe eenvoudig u met deze sjablonen aan de slag kunt.
Inhoudspagina's
Hoewel sjablonen van volledige websites fantastisch zijn, willen we soms toch specifieke pagina's aanpassen of creëren. Om deze reden, Beaver Builder heeft ook veel inhoudspagina's die al zijn ontworpen en klaar voor gebruik.
Hieronder vindt u enkele pagina's die u kunt gebruiken:
- Over ons (meerdere versies)
- Onze diensten
- Fotoportfolio
- Ontwerpportfolio
- Ons team (meerdere versies)
- Contact (meerdere versies)
- Prijzen (meerdere versies)
- Blog (meerdere versies)
Uiteraard verwachten wij dat deze in de loop van de tijd alleen maar zullen toenemen.
Micropagina's bieden secties van een pagina of minimalistische pagina's, mocht u die ooit nodig hebben.
Klik op de onderstaande link om direct naar de sjablonenpagina te gaan.
Check Out Beaver Builder Templates
Beaver Builder vs Divi - Pagina Builder-instellingen
Nu u een idee heeft van welke modules en sjablonen elke paginabuilder biedt, gaan we wat dieper in op de instellingen.
Divi Builder Instellingen
Het installeren van deze plugin is heel eenvoudig.
Nadat u de plug-in hebt geïnstalleerd en geactiveerd, gaat u naar Plugin-optiesen geef uw gebruikersnaam en API-sleutel op in het gedeelte 'Updates' om automatische updates te ontvangen.
Hier kunt u aanvullende instellingen zien, zoals API-instellingen, Post Type Integration en Advanced.
De API-instellingen bevatten opties voor Google Fonts en Google Maps-integratie.
Onder Posttype-integratie kunt u de integratie van berichten in- of uitschakelen Divi builder op bepaalde berichttypen.
Onder het tabblad Geavanceerd vindt u opties voor minimalisatie, het genereren van statische CSS-bestanden, enz. en de opties om de klassieke WordPress-editor en de klassieke Divi back-end builder in te schakelen.
Het nieuwste item hier is de “Theme Builder”-pagina.
Hier vind je de sjablonen die je hebt gemaakt of geïmporteerd, inclusief opties om ze te importeren en exporteren, de bewerkingsgeschiedenis van de themabouwer te bekijken en meer. We zullen deze nieuwe functie later in dit artikel uitgebreider bespreken.
Een lijst met alle aangepaste lay-outs vindt u in de Divi-bibliotheek pagina. Er zijn aparte knoppen om de lay-outcategorie te beheren en de lay-outs te importeren of exporteren. Ga naar Divi Roleditor om te definiëren hoeveel toegang verschillende gebruikersrollen hebben.
Ten slotte kunt u in het Support Center de status van uw systeemserver controleren. Hier wordt belangrijke informatie over uw server weergegeven.
Als er opties zijn die niet op bepaalde aanbevolen waarden staan, zal Divi u hierover informeren zodat u ze kunt oplossen.
Hier kunt u ook 'externe toegang' configureren, zodat het ondersteuningsteam van Elegant Theme rechtstreeks toegang heeft tot uw beheerdersdashboard en u kan helpen eventuele fouten op te lossen.
Andere items zijn onder meer de veilige modus en logging.
Beaver Builder Instellingen
De instellingsopties voor Beaver Builder bevinden zich op de pagina Instellingen > Paginabuilder. Geef uw licentiesleutel op in het gedeelte Licentie om automatische updates voor de plugin in te schakelen.
In Modules kunt u de modules in- of uitschakelen. Met Berichttypen kunt u definiëren welke berichttypen u kunt gebruiken. BeaverBuilderOnder Sjablonen kunt u bepalen welke sjablonen beschikbaar zijn in de interface van de paginabuilder.
In het gedeelte Pictogrammen kunt u bepalen welke pictogrammen beschikbaar moeten zijn in de interface.
De beschikbare opties omvatten:
- LettertypeGeweldig,
- Stichting, en
- Dashiconen.
Dit is een voorbeeld van hoe Beaver Builder Hiermee kun je alle opties aanpassen en ermee experimenteren. Als je niet tevreden bent met FontAwesome, kies dan iets wat je wel bevalt.
Er zijn ook aparte secties om de cache te legen. Hiermee verwijdert u alle dynamisch gegenereerde CSS en Javascript.
Ten slotte vindt u een optie om het programma te verwijderen Beaver BuilderMet deze functies worden alle BB-gerelateerde gegevens uit uw WordPress-database verwijderd. Maak daarom een back-up voordat u de database gebruikt en zorg ervoor dat u weet wat u doet.
Aanbevolen literatuur: https://www.collectiveray.com/beaver-builder-vs-elementor
Beaver Builder vs Divi - Extra functies
Welke andere extraatjes bieden deze paginabuilders?
Divi Theme
De plugin van Elegant Themes biedt nog diverse andere interessante functies. Zo kun je met de PageBuilder Library aangepaste modules en lay-outs opslaan, zodat je ze later opnieuw kunt gebruiken.
Bovendien is het mogelijk om deze items te importeren en exporteren van en naar andere websites.
De superieure opties voor lay-outafstand verdienen ook speciale aandacht. Deze opties maken het veel gemakkelijker om de exacte gewenste afstand tussen de rijen, elementen en secties toe te passen.
Er zijn speciale opties om de marge, opvulling, verticale en horizontale afstand te definiëren. U kunt ook de rij- en kolombreedte instellen.
In sommige gevallen moet u dezelfde module op meerdere plaatsen gebruiken. U kunt elke module, rij of kolom eenvoudig kopiëren en plakken naar andere berichten of pagina's.
Bovendien kunt u deze markeren als globale items.
Hiermee kunt u de wijzigingen in één enkel globaal item aanbrengen. De wijzigingen worden dan automatisch ook op de andere plekken toegepast.
Divi Thema Builder
Een van de grootste updates die Elegant Themes de afgelopen jaren voor Divi heeft uitgebracht, is de Theme Builder.
Met deze functie kun je je hele website bouwen, ontwerpen en personaliseren. Het is niet langer alleen een paginabuilder, maar een complete themabuilder.
U kunt wereldwijde aangepaste kop- en voetteksten maken of deze definiëren voor afzonderlijke gedeelten van uw site.
U kunt ook aangepaste bodysjablonen definiëren waarmee u aangepaste productsjablonen, blogberichtsjablonen, 404-pagina's, pagina's met zoekresultaten en aangepaste archiefpagina's, zoals aangepaste categoriepagina's, aangepaste auteurspagina's en meer kunt maken.
Met de themabouwer kunt u de kracht van de paginabouwer uitbreiden naar uw gehele website.
Wanneer u een nieuwe sjabloon maakt, hebt u toegang tot alle hulpmiddelen en functies van de paginabuilder, zodat u deze op elke gewenste manier kunt bouwen en ontwerpen.
Dit betekent dat u desgewenst aangepaste ontwerpen voor kop- en voetteksten kunt maken. Als aanvulling hierop biedt de menumodule verbeteringen zoals extra lay-outopties en volledige controle over het ontwerp, zodat u prachtige kop- en voetteksten met een aangepast menu kunt maken.
Met de nieuwe aangepaste body-sjablonen kunt u het ontwerp en de structuur van al uw berichten, producten of pagina's in één keer wijzigen.
Voorheen moest je naar elk bericht, product of elke pagina gaan en deze bewerken met de paginabuilder om wijzigingen aan te brengen. Nu hoef je alleen nog maar een template te definiëren, deze toe te passen op de juiste delen van je site en je bent klaar.
Je kunt zelfs WooCommerce-modules gebruiken om aangepaste productsjablonen voor je webshop te maken. Er zijn ook dynamische contentmodules met een bijgewerkte berichtlus en filteropties waarmee je aangepaste archiefpagina's kunt maken.
Uiteraard heeft u ook de volledige controle over waar en hoe uw sjabloon wordt toegepast. U kunt bepaalde items eenvoudig toevoegen of uitsluiten van een sjabloon via selectievakjes, zoals hieronder te zien is:
Vanaf versie 4.0 is Divi geen paginabuilder meer, maar een themabuilder.
Krijg 10% KORTING op Divi tot Juni 2025
PS. Bovenstaand aanbod is alleen beschikbaar via bovenstaande link van CollectiveRay
Beaver Builder
Daarnaast is Beaver Builder heeft ook nog wat trucjes achter de hand.
Allereerst is de live frontend-bewerking indrukwekkend. Het biedt een intuïtieve ervaring waarbij je de pagina kunt bewerken en de exacte output krijgt zonder giswerk.
U kunt ook de standaard WordPress-widgets en aangepaste widgets in uw lay-outs gebruiken.
De editormodus is handig bij het leveren van een project aan de klant. In deze modus kunt u de mogelijkheden van de klant beperken om ervoor te zorgen dat deze geen ongewenste wijzigingen aanbrengt in de basislayout.
Een ander belangrijk kenmerk van Beaver Builder is dat de inhoud van de pagina intact blijft, zelfs nadat u de plugin deactiveert.
Je verliest de stijlen, maar de pagina toont nog steeds de inhoud. De meeste andere paginabuilders daarentegen laten je achter met een wirwar aan shortcodes wanneer je die plugin deactiveert.
Beaver Builder vs Divi - Voor- en nadelen
Elk product, hoe goed ontworpen of hoe volwassen ook, heeft zijn sterke en zwakke punten. Deze twee paginabuilders vormen daarop geen uitzondering.
Divi Theme
VOORDELEN
- Een zeer krachtige oplossing voor het creëren van elk type lay-out,
- Nieuwe prestatie-updates maken Divi sneller dan ooit,
- Aantrekkelijke prijzen met toegang tot veel andere WordPress-thema's en plug-ins - de aanschaf ervan is een no-brainer, uitstekende waarde
- Veel geweldige ontwerpen, met veel aanpassingsmogelijkheden,
- Krachtige themabouwer,
- Uitgebreide documentatie en geweldige, responsieve ondersteuning
NADELEN
- Neem even de tijd om eraan te wennen,
- De frontend-editor heeft wat tijd nodig om te laden en het toevoegen van modules aan pagina's gaat veel langzamer dan Beaver Builder
- U bent beperkt tot de modules die beschikbaar zijn en ontwikkeld zijn door ET (hoewel versie 3.1 nu een ontwikkelaars-API ondersteunt, wat betekent dat ontwikkelaars hun plug-ins hiermee kunnen integreren)
- Kan de gegevens die aan de database worden toegevoegd niet verwijderen, waardoor het overstappen van het Divi-thema een pijnpunt wordt
Beaver Builder
VOORDELEN
- Een eenvoudige gebruikersinterface,
- De inhoud blijft intact, zelfs na het deactiveren van de plugin,
- Unieke editormodus voor klanten,
- Hiermee kunt u WordPress-widgets in de lay-outs gebruiken.
- Snelle, vlotte en responsieve gebruikersinterface met een gemakkelijk te begrijpen interface
- Grote selectie professionele sjablonen om u te helpen aan de slag te gaan met uw ontwerp
- Ondersteunt WordPress-native widgets, zodat u alles kunt gebruiken
NADELEN
- Duurder dan de andere WordPress-paginabuilders
Divi versus Beaver Builder - Prijzen
Beiden Beaver Builder en Divi zijn GPL-vriendelijk, wat betekent dat u ze op zoveel websites kunt gebruiken als u wilt. producten, zodat u ze op zoveel websites kunt gebruiken als u wilt.
Er zijn drie verschillende plannen waar u voor kunt kiezen Beaver Builder vanaf $ 99 tot $ 546. Elk abonnement geeft u volledige toegang tot de Beaver Builder plugin en alle modules en sjablonen, waarbij de hogere niveaus u meer geavanceerde functies bieden, zoals Multisite, White labeling en Themer.
Met Divi heb je slechts twee opties: een jaarabonnement voor een standaardprijs van $ 89, waarvoor een jaarlijkse aankoop vereist is, of de levenslange optie voor $ 249. Beide bieden exact dezelfde toegang, maar je verliest uiteraard de toegang tot ondersteuning en upgrades na het verstrijken van het jaar.
Laten we er eens wat dieper op ingaan.
Divi Builder
U moet lid zijn van Elegant Themes om hun plug-ins te kunnen gebruiken. Hiervoor gelden de onderstaande tarieven.
Er zijn twee abonnementen beschikbaar: Jaarlijkse toegang en Levenslange toegang.
Het jaarabonnement kost $ 89 per jaar. Met levenslange toegang kunt u van al deze voordelen genieten voor een eenmalige betaling van $ 249.
Gelukkig, er is een EXCLUSIEVE CollectiveRay Aanbieding van 10% KORTING is nu geldig Dus sla vandaag nog je slag. En nu je toch bezig bent, kun je net zo goed profiteren van de levenslange toegang, gezien deze tijdelijke korting!
Beide abonnementen bieden onbeperkte toegang tot alle thema's en plug-ins die zijn ontwikkeld door ElegantThemes.
U ontvangt bovendien tijdige updates, eersteklas ondersteuning en een geld-terug-garantie van 30 dagen.
Krijg 10% KORTING op Divi tot Juni 2025
Beaver Builder
Beaver Builder biedt vier prijsopties. Het standaardabonnement kost $ 99. Hiermee kunt u de plugin op één website gebruiken, krijgt u een jaar lang ondersteuning en toegang tot premiummodules en sjablonen.
Pro kost $ 199 en omvat alle voordelen van het standaardabonnement, plus het thema en de compatibiliteit met meerdere sites.
Agency kost $ 399 en biedt alle functies van Pro, aangevuld met volledige white labeling-rechten.
Ultimate kost $ 546 per jaar en voegt Assistant Pro toe, een cloudgebaseerde opslagoptie voor ontwerpen en middelen.
Beaver Builder vs Divi - Veelgestelde vragen
Is Beaver Builder sneller dan Divi?
Beaver Builder is niet langer sneller dan Divi. Vroeger laadde de editor sneller en is het sneller te gebruiken en te leren. Een nieuwe prestatie-update van Divi heeft de werking echter radicaal veranderd. Het is nu een van de snelste WordPress-thema's die je kunt kopen.
Wat is beter, Divi of Elementor?
Divi is beter dan Elementor voor sommige dingen, terwijl Elementor sterker is in andere. Divi is beter vanwege de toegang tot plugins en functies, het agency-abonnement en de pure kracht van de paginabuilder. Elementor is beter omdat het gratis is, premium opties heeft en zeer gemakkelijk te gebruiken is.
Is Elementor de beste paginabuilder?
Elementor is de beste pagebuilder als je een toegankelijke, gratis pagebuilder zoekt. Als je op zoek bent naar een krachtige, zelfstandige builder voor het maken van één of twee websites, dan kun je Elementor niet beter vinden. Het is snel, gratis en gebruiksvriendelijk. Wat heb je nog meer nodig?
Is Beaver Builder goed voor seo?
Ja, Beaver Builder beschikt over alle functies die nodig zijn om de zoekmachineoptimalisatie van uw website te beheren, waaronder snelheid, controle over headers en titeltags en andere noodzakelijke functies.
Welke Page Builder moet u kiezen?
Nu komen we bij het (moeilijke) onderdeel, namelijk het maken van een keuze tussen deze paginabuilders.
Zoals je hebt gemerkt, bieden beide plugins een uitstekende prijs-kwaliteitverhouding. Ze bieden een uitstekende gebruikersinterface en maken het veel gemakkelijker om aangepaste lay-outs te maken.
Omdat beide plugins hun eigen use cases hebben, moet je uitzoeken welke het beste bij je past. Laat mij je daarbij helpen.
- Kies Divi Als je volledige controle over de lay-out wilt. Zodra je de beschikbare opties onder de knie hebt, is het een zeer krachtige tool waarmee je elk gewenst type lay-out kunt maken.
Eindresultaat: 5 uit 5. - Ga met Beaver Builder Als je snel aan de slag wilt. Omdat deze pagebuilder geen shortcodes gebruikt, kun je het huidige ontwerp gemakkelijk schrappen en met een paar muisklikken een nieuw ontwerp proberen.
Eindresultaat: 4.5 uit 5
Als u naar andere opties kijkt, wilt u misschien ook eens kijken naar Visual Composer or Elementor Pro, die we beide apart op deze site hebben behandeld. Zowel Elementor als Visual Composer zijn belangrijke spelers in de niche van paginabuilders.
Laatste woorden: Beaver Builder tegen Divi
Divi en Beaver Builder zijn momenteel twee van de populairste plugins voor pagebuilders. Tenzij je beide plugins uitgebreid hebt gebruikt, is het lastig om de ene boven de andere te kiezen. Deze vergelijking zou je moeten helpen bij het maken van die keuze.
Wij geloven dat Elegant Themes je over het algemeen meer waar voor je geld biedt, aangezien je toegang krijgt tot een heleboel WordPress-thema's en -plug-ins. Maar BB is ook een uitstekende keuze. Bovendien heeft die nieuwe prestatie-upgrade die ze hebben geïntroduceerd, de markt echt veranderd. Het is echt moeilijk om te kiezen. Beaver Builder nu over Divi.
Krijg 10% KORTING op Divi tot Juni 2025
Dus, welke heb jij gekozen? Laat het ons weten in de reacties hieronder.