Categorie: Elementor

  • Elementor review

    Elementor review

    Elementor is met meer dan 5 miljoen gebruikers één van de populairste WordPress page builders. Dat is niet zo gek, want zowel de gratis versie als de pro versie zijn erg uitgebreid en gebruiksvriendelijk. In deze uitgebreide Elementor review lees je wat je allemaal kunt met deze page builder en of de pro versie zijn geld waard is.

    De gratis versie van Elementor

    Ik ben altijd al erg onder de indruk geweest van Elementor, want het is de meest uitgebreide gratis page builder die ik ken. Elementor is een plugin die je kunt gebruiken met vrijwel ieder thema, en geavanceerde functies die je normaal alleen zou verwachten bij betaalde page builders zitten bij Elementor gewoon in de gratis versie. Wat dacht je bijvoorbeeld van:

    • Animaties
    • Shape dividers
    • Filters, blend mode en overlay kleuren voor afbeeldingen
    • Tekst en box schaduw
    • Google Fonts en Font Awesome icons
    • Bibliotheek waarin je je pagina’s kunt opslaan voor hergebruik
    • Honderden professioneel ontworpen pagina- en sectie templates

    Elementor widgets

    In deze Elementor review mogen ook de basisfuncties van Elementor natuurlijk niet ontbreken. Zo is een pagina opgebouwd uit secties en kolommen waarin je widgets kunt slepen.
    Widgets is de – ietwat verwarrende – naam die Elementor gebruikt voor de modules. Vanzelfsprekend zijn alle standaard elementen aanwezig, zoals:

    • Tekstblok
    • Afbeelding
    • Video
    • Heading
    • Knop
    • Icoon
    • Google Maps kaart
    • Fotogalerij
    • Teller
    • Voortgangsbalk
    • Testimonial
    • Tabbladen
    • Accordeons
    • Social media iconen

    Je hebt de keuze uit zo’n 30 widgets van Elementor zelf… maar je kunt ook iedere widget van WordPress zelf of een widget die is aangemaakt door een plugin invoegen!

    Dat is echt een unieke en zeer bruikbare feature, die ik toch nog even wil belichten in deze Elementor review. WordPress heeft standaard 17 widgets aan boord, waarmee je bijvoorbeeld tekst, een afbeelding, een audio- of videofragment, een lijst met je meest recente berichten, een navigatiemenu of een zoekbalk kunt invoegen. Die widgets kun je normaal echter alleen toevoegen in speciale “widget areas”. Waar die widget areas zich bevinden verschilt per thema, maar bij de meeste thema’s kun je alleen widgets toevoegen in een sidebar en in de footer. Maar met Elementor kun je dus overal op de pagina een widget toevoegen!

    Dat geldt niet alleen voor de standaard WordPress widgets, maar ook voor widgets die worden toegevoegd door plugins of je thema! Zo voegt de populaire webshop plugin WooCommerce bijvoorbeeld prijs-, product- en categorie filter widgets toe, die je met Elementor dus overal op de pagina kunt plaatsen. Heel gaaf!

    Styling opties

    Iedere module biedt een prima aantal styling opties. Naast de eerder genoemde geavanceerde opties als animaties en tekst en box schaduw kun je uiteraard ook de achtergrond instellen, waarbij je kunt kiezen uit 1 kleur, een kleurverloop of een afbeelding – al dan niet met een kleur als overlay – en bij secties kun je ook een video als achtergrond gebruiken.

    Daarnaast kun je de breedte en hoogte van ieder element instellen, een rand toevoegen (indien gewenst met afgeronde hoeken), de marge en padding aanpassen, de kleur aanpassen en bepalen of een element links, rechts, gecentreerd of uitgevuld moet worden uitgelijnd. Als je handig bent met CSS kun je ook een CSS id of class toevoegen, evenals de z-index.

    Dit alles kun je niet alleen voor de standaard weergave instellen, maar ook voor de hover weergave (hoe het eruit ziet als je er met de muis overheen gaat) en dingen als uitlijning, padding, margin, afmetingen en lettergrootte kun je ook apart instellen voor tablet en smartphones. Uiteraard kun je ook bij ieder element kiezen op welke schermgroottes je dit wilt tonen of verbergen.

    Flexibele layout

    Zoals eerder in deze Elementor review vermeld wordt de layout van een pagina opgebouwd uit secties en kolommen, met daarin de widgets. Dit werkt lekker flexibel, want je kunt tot 10 kolommen toevoegen en binnen een kolom kun je ook werken met “nested columns”, kolommen binnen een andere kolom dus. Je kunt de breedte van een kolom eenvoudig aanpassen door deze simpelweg naar de gewenste breedte te slepen.

    Foutje? Bedankt!

    Heb je een foutje gemaakt? Dan mag je Elementor bedanken, want dankzij hen kun je het waarschijnlijk weer eenvoudig herstellen. Naast undo en redo mogelijkheden maakt Elementor gebruik van het standaard revisie systeem van WordPress waardoor je snel een eerdere versie kunt herstellen, en dankzij de autosave functie verlies je nooit teveel werk.

    Elementor Pro review

    Zoals je hierboven hebt gelezen is Elementor een hele uitgebreide en gebruiksvriendelijke page builder. En het mooiste is, alles wat ik hierboven behandeld heb zit in de gratis versie!
    Er is echter ook een betaalde versie, Elementor Pro. Wat kun je daar allemaal mee, en is de pro versie zijn geld waard? Je leest het in deze Elementor Pro review!

    Theme builder : pas elk onderdeel van je site aan

     
    De gratis versie van Elementor is een page builder. Daarmee kun je alleen de content van je pagina aanpassen: de teksten en afbeeldingen van je berichten en pagina’s dus. Maar niet de header, footer, blog pagina, 404 error pagina, de zoekresultaten pagina enzovoorts.

    Elementor Pro is echter een theme builder waarmee je wel al die elementen aan kunt passen. Wil je de zoekfunctie in je header of het menu op een andere plek hebben? Elementor Pro maakt het mogelijk! Wil je een uitgelichte afbeelding in je blog overzicht hebben? Of wil je de productafbeeldingen in WooCommerce onder de prijs weergeven? Met Elementor Pro kun je dat allemaal instellen!

    Je slaat al dit soort dingen op als templates zodat je ze later weer eenvoudig kunt bewerken. Bovendien laat Elementor je kiezen waar je die templates wilt weergeven: zo kun je bijvoorbeeld instellen dat een bepaalde header alleen weergegeven dient te worden op WooCommerce pagina’s, of alleen bij berichten in de categorie “nieuws”.

    Dynamic Content : laad gegevens uit de database

    In deze review van Elementor Pro kan een stukje over Dynamic Content niet ontbreken, want dat is onlosmakelijk verbonden met een theme builder. Als je bijvoorbeeld een blog template maakt stel je in waar de uitgelichte afbeelding moet verschijnen, waar de categorieën komen, en natuurlijk de bericht tekst zelf. Aangezien al die onderdelen verschillen per bericht moeten die dynamisch worden ingelezen uit de database, en daar zorgt dynamic content voor.

    Een ander voorbeeld is de productpagina van je webshop (woocommerce); je kunt in een template waar je dingen als de productafbeelding, prijs, voorraad, beschrijving en reviews wilt hebben, en vervolgens worden al die onderdelen per product automatisch ingelezen uit de database.

    Al die losse onderdelen zijn beschikbaar als aparte widgets die je op dezelfde manier kunt indelen als een normale pagina of bericht (dus met secties en kolommen).

    Global widgets

    In Elementor Pro heb je ook de beschikking over global widgets. In de gratis versie van Elementor kun je al een sectie of complete pagina opslaan in een bibliotheek, zodat je deze ergens anders op de site weer kunt hergebruiken. Als je bijvoorbeeld een sectie met een mooie call to action knop hebt gemaakt kun die opslaan in de bibliotheek, en deze vanuit daar gemakkelijk weer invoegen op een andere pagina zodat je diezelfde knop niet elke keer helemaal opnieuw hoeft te maken.

    Maar wat als je nu na een paar weken besluit dat je die call to action knop toch liever groen maakt in plaats van oranje? Of je wilt de tekst op die knop aanpassen? Dan zul je in de gratis versie van Elementor alle pagina’s langs moeten om dat bij iedere knop handmatig aan te passen.

    Bij Elementor Pro kun je een widget (de knop zelf) echter ook instellen als Global Widget. Heb je die call to action knop opgeslagen als global widget en verander je de kleur van oranje naar groen? Dan worden alle andere call to action knoppen automatisch mee aangepast. Dat scheelt een hoop tijd!

    Het is echter helaas (nog) niet mogelijk om een gehele sectie op te slaan als “global section”. Als je de achtergrond van de sectie wilt aanpassen moet je dus nog alle pagina’s langs.

    Formulieren widget

    In de gratis versie van Elementor is helaas geen formulier widget beschikbaar, en dat is iets wat vrijwel iedere site wel nodig heeft. Een contactformulier mag immers op geen enkele site ontbreken.

    Nu zijn er genoeg andere plugins waarmee je een contactformulier kunt toevoegen, maar het is natuurlijk wel zo handig om die functionaliteit gewoon als Elementor widget beschikbaar te hebben.

    De formulier widget van Elementor is behoorlijk uitgebreid. Als je de formulier widget invoegt is deze standaard al voorzien van een basis contactformulier. Hieraan kun eenvoudig velden toevoegen – of juist verwijderen.

    Bij ieder veld kun je aangeven of het verplicht is, een label (de tekst boven het veld) aanpassen of verwijderen, een placeholder (de tekst in het formulier) aanpassen en de breedte van het formulier aangeven.

    Hoewel je de breedte van de velden niet simpelweg kunt slepen naar de gewenste breedte zoals dat bij kolommen mogelijk is kun je wel kiezen uit 10 verschillende afmetingen, keuze genoeg dus.
    Ook qua soort velden heb je meer dan genoeg keuze; buiten een normaal tekstveld en e-mail veld heb je bijvoorbeeld ook selectieboxen, checkboxen, radio buttons, een datum en tijd veld (met kalender, waarbij je zelfs kunt bepalen uit welke periode gekozen kan worden), een file upload veld (waarbij je kunt aangeven welke bestandstypen zijn toegestaan, en de maximale grootte daarvan), een wachtwoord veld, een acceptance veld (voor voorwaarden of privacy statement) en verschillende anti-spam maatregelen zoals recaptcha en een honeypot veld.

    Indien gewenst kun je de styling van het label, de velden, de verzendbutton en de meldingen aanpassen, en je kunt zelfs de tekst van de meldingen aanpassen. Ook de e-mail template kun je aanpassen (maar dat is niet noodzakelijk in tegenstelling tot bijvoorbeeld Contact Form 7), en bepalen wat er gebeurt nadat het formulier verzonden wordt. Hiermee kun je bijvoorbeeld een autoresponder instellen of een gebruiker toevoegen aan je MailChimp nieuwsbrief.

    Popup builder

    Een nieuwe feature van Elementor Pro die niet mag ontbreken in deze Elementor review is de popup builder, waarmee je – zoals de naam al zegt – popup vensters kunt bouwen.
    Hierin kun je alle elementen gebruiken die je ook op een pagina kunt gebruiken, zoals afbeeldingen, teksten, buttons, formulieren enzovoorts. Vervolgens kun je diverse triggers instellen om je nieuwe popup te tonen, bijvoorbeeld als de gebruiker scrollt, als hij een bepaalde tijd op de pagina is of als hij de pagina wilt verlaten.

    Bovendien kun je die triggers combineren met diverse extra voorwaarden: zo kun je een popup bijvoorbeeld alleen tonen op de homepage of een productpagina, of alleen aan ingelogde klanten die je website minimaal 3 keer hebben bezocht, of alleen aan gebruikers die vanuit Google komen enzovoorts. Een hele krachtige tool dus!

    Social media widgets

    Elementor Pro bevat ook een aantal social media widgets, waaronder social share buttons (met keuze uit flink wat netwerken, zelfs whatsapp, en vierkante, afgeronde of ronde icoontjes), een facebook comment box, een facebook embed widget en een click to tweet box. Nice!

    En nog meer widgets, templates en instellingen

    Naast al het bovenstaande krijg je met Elementor Pro nog een aantal extra widgets, waaronder:

    • Een prijstabel widget
    • Een prijslijst widget
    • Een flipbox widget, waarmee je andere content met een effect kan weergeven bij mouse over
    • Een geanimeerde headline, waarbij je bepaalde woorden kunt vervangen of juist kunt accentueren met een aantal mooie effecten
    • Diverse sliders voor foto’s, posts en testimonials
    • Een filterbaar portfolio

    Ook beschikt Elementor Pro over een role manager, waarmee je kunt instellen of een bepaalde gebruikersrol geen toegang heeft tot Elementor of alleen tot het content gedeelte (dus niet tot de templates voor de header, footer enzovoorts) en de mogelijkheid voor het toevoegen van custom CSS bij ieder onderdeel.

    Alsof dat nog niet genoeg is krijg je ook nog tientallen extra professioneel ontworpen templates waarin de pro widgets verwerkt zijn zodat je nog sneller klaar bent met je nieuwe site.

    Wat kost Elementor Pro?

    Als je Elementor Pro alleen voor je eigen website nodig hebt betaal je $ 49,00 per jaar.

    Bouw je websites voor klanten? Dan kun je voor $ 199,00 Elementor Pro een jaar lang gebruiken op 25 websites, voor $ 499,00 mag je Elementor Pro op 100 websites installeren
    en voor $ 999,00 per jaar krijg je een licentie voor 1.000 websites.

    Elementor Cloud Website

    Begin 2022 introduceerde Elementor een nieuw product, Elementor Cloud Website. Daarmee krijg je alle features en templates van Elementor Pro, maar bij Elementor Cloud Website is ook de hosting inbegrepen! WordPress en Elementor Pro zijn al voor je geïnstalleerd, dus je kunt meteen beginnen met het bouwen van je website. Met een prijs van $ 99 per jaar is Elementor Cloud Website een zeer aantrekkelijke optie als je maar 1 of 2 websites beheert.

    Conclusie

    Elementor is niet voor niets één van de meest populaire page builders; heel veel features, veel styling opties en instellingen, en toch zeer gebruiksvriendelijk.

    Toen ik de gratis versie voor het eerst gebruikte dacht ik “waarom zou iemand nog de premium versie kopen als je al die features al in de gratis versie stopt?”
    Maar ik vergiste me, want toen ik een pro licentie kocht voor mijn Elementor Pro review kwam ik erachter dat deze versie nog enorm veel toegevoegde waarde biedt.
    Bekijk hier alle extra features van Elementor Pro.

    Als je genoeg hebt aan de gratis features of maar 1 website wilt bouwen met Elementor Pro raad ik Elementor dan ook zeker aan.

    Bouw je echter professioneel websites? Dan is Elementor Pro behoorlijk prijzig en kun je beter kijken naar Divi of Brizy (zie hieronder).
    Hun licentie is namelijk echt veel aantrekkelijker voor webbouwers.

    Zelf je website bouwen, maar dan wel met wat hulp van een expert?

    Kies dan voor Bobs Website in 1 dag pakket! Met dit pakket gaan we samen een hele dag achter de computer zitten (kan eventueel ook online via Zoom) en is aan het einde van de dag (de basis van) je nieuwe website klaar!

    Van tevoren regelt Bob alle technische zaken zoals het instellen van WordPress en het installeren van alle benodigde plugins, zodat we die dag meteen aan de slag kunnen met het leukste gedeelte; het ontwerpen en vullen van de website 🙂 .

    Doordat we de website samen bouwen leer je precies hoe WordPress werkt en hoe je alles kunt aanpassen.

    En kom je er toch even niet uit? Dan mag je Bob altijd even bellen of mailen, want je krijgt 3 maanden support!

    Bekijk alle details van Bobs Website in 1 dag pakket

    Welke alternatieven zijn er voor Elementor?

    Lees mijn uitgebreide WordPress page builder vergelijking : Elementor vs Divi, Brizy, Thrive Architect en Gutenberg

    Elementor vs Divi

    Divi is een premium WordPress theme, een compleet thema dus met een ingebouwde page builder.
    De Divi page builder is echter ook als losse plugin verkrijgbaar, net als Elementor dus. 

    Divi is waarschijnlijk de grootste concurrent van Elementor, en zit net als Elementor boordevol innovatieve features. Met sommige dingen is Divi wat eerder, zoals met kleurenfilters en blend modes, copy / paste styles en de nieuwe transform effects, maar Elementor was weer eerder met zeer populaire features zoals een header / footer / template builder en WooCommerce builder.

    Ik heb inmiddels al een behoorlijk aantal websites in Elementor gemaakt, en dat beviel prima… maar toch is Divi nog altijd mijn favoriete page builder. Dat komt waarschijnlijk doordat de interface veel visueler is ingesteld dan die van Elementor.  

    Als je bij Elementor bijvoorbeeld een shape divider toevoegt zie je de naam van die divider. Bij Divi zie je gewoon een voorbeeld van de betreffende vorm. Margins en paddings sleep je in Divi gewoon naar de gewenste breedte. Bij het instellen van een schaduw kun je kiezen uit 8 verschillende stijlen, die je vervolgens weer helemaal aan kunt passen aan je wensen.

    De color picker tool heeft – naast het standaard zelf in te stellen kleurenpallet – ook een kleurenpallet met de laatst gebruikte kleuren. Er wordt iedere week een nieuwe voorbeeldsite toegevoegd (elke voorbeeldsite bestaat uit een stuk of 8 pagina templates) enzovoorts. Allemaal geen wereldschokkende dingen, maar dat soort kleine dingen maakt wel dat ik Divi prettiger vind werken dan Elementor.

    En dan is er nog de prijs… Divi heeft geen gratis versie, en Elementor Pro is een stuk goedkoper dan Divi… als je maar 1 website hebt ten minste. Voor webbouwers en andere mensen die regelmatig websites maken is Divi veel aantrekkelijker geprijsd, want een lifetime unlimited licentie voor Divi (dus maar 1 keer betalen en daarna levenslange updates en support zonder jaarlijkse kosten) kost maar een paar tientjes meer dan de jaarlijkse unlimited licentie van Elementor. En met de knop hieronder krijg je daar ook nog eens 10% korting op 😉 
    Je kunt natuurlijk ook eerst mijn uitgebreide Divi review lezen.

    Elementor vs Brizy

    Brizy is, net als Elementor, een losse page builder die aan de voorkant van je website werkt, en net als Elementor heeft ook Brizy een hele uitgebreide gratis versie. Ook Brizy is volop in ontwikkeling, maar waar Divi en Elementor al echt volwassen page builders zijn staat Brizy nog echt in de kinderschoenen; Brizy werd namelijk pas in mei 2018 gelanceerd. Brizy is echter inmiddels al wel op zo’n 60.000 WordPress sites geinstalleerd, dus dat belooft wel wat… 

    Brizy onderscheidt zich door een gebruiksvriendelijke interface met een toolbar die verschijnt boven het element dat je wilt bewerken, zodat je de meeste instellingen direct op die plek kunt bewerken. Bij Divi en Elementor doe je alle instellingen in een popup of sidebar. Dat lijkt misschien minder gebruiksvriendelijk, maar ik vind het wel wat overzichtelijker. Al moet ik zeggen dat ik ook snel gewend was aan de Brizy manier. 

    Op het moment van schrijven bevat Brizy zo’n 20 “design elements” (widgets in Elementor). Dat is wat aan de magere kant, Divi heeft er bijvoorbeeld 37 en Elementor zelfs nog meer. Brizy beschikt natuurlijk wel over de standaard dingen zoals rijen, kolommen, tekst blokken, afbeeldingen, knoppen en zelfs een contactformulier, maar enkele geavanceerde modules zoals testimonials en prijstabellen ontbreken op dit moment nog.

    Er zijn echter wel een flink aantal voorbeeld blokken (secties in Elementor) beschikbaar, met o.a. 7 prijstabel templates en 9 testimonial templates. Deze kun je dus eenvoudig invoegen en aanpassen aan je eigen wensen. Een testimonial is immers ook niets meer dan een afbeelding, een tekst widget met de review en een tekst widget met een naam.

    Uiteraard moet er ook bij Brizy geld verdiend worden, en dus is er ook Brizy Pro. De pro versie bevat o.a. een theme builder (headers, footers en templates) die erg fijn werkt, een WooCommerce builder, een popup buider, mega menu, dynamic content, shape dividers, filters en premium designs, en ook A/B testing staat op de planning.

    Elementor vs Avada

    avada fusion builderAls je op zoek bent naar een “multi purpose” thema ben je ook Avada vast al eens tegengekomen.

    Ook Avada beschikt over een eigen page builder, de Fusion Builder. Deze werkt in de basis ongeveer hetzelfde als Elementor aan de voorkant van je site, en net als met Elementor Pro kun je ook met Avada zelf templates bouwen voor je pagina’s en berichten, header, footer, WooCommerce enz.

    Een van de beste onderdelen van Avada zijn de zeer uitgebreide thema opties, waar je letterlijk honderden dingen kunt instellen. Gelukkig beschikken die thema opties over een krachtige zoekfunctie waardoor je heel snel de gewenste optie vind. Sinds Avada 6.0 zijn ook die thema opties verplaatst naar de front-end zodat je direct het effect van je aanpassingen ziet.
     

    Net als bij Elementor Pro kun je ook bij Avada ieder element opslaan in een bibliotheek, zodat je die weer kan hergebruiken elders op de site of op een andere Avada site.
    En ook Avada wordt standaard geleverd met een stuk of 80 “demo sites”, 
    te vergelijken met Elementor’s website kits. 

    De design opties van Avada zijn wel (veel) minder uitgebreid dan die van Elementor; zo vind je in Avada geen kleurenfilters, shape dividers, transform opties enzovoorts,
    en hoewel je wel hover opties en animaties in kunt stellen zijn die wel behoorlijk beperkt.

    De documentatie van Avada is redelijk. De support is wel prima, maar beperkt tot 6 maanden na aankoop. 

    De prijs van Avada is wel een stuk aantrekkelijker dan die van Elementor: een licentie kost maar $ 60,00 inclusief levenslange updates. Je hebt echter wel voor iedere website een nieuwe licentie nodig. 

    Lees mijn Avada review

    Elementor vs WP Bakery Page Builder / Visual Composer

    WP Bakery page builderAls je wel eens op ThemeForest komt ken je de WP Bakery Page Builder ongetwijfeld, al dan niet onder zijn oude naam Visual Composer. Hoewel enkele populaire thema’s als Avada en Enfold een eigen page builder hebben ontwikkeld gebruiken de meeste thema’s van ThemeForest deze page builder.

    De WP Bakery page builder beschikt over zowel een backend als een frontend editor, en ook hier heb je enkele geavanceerde design opties zoals animaties, borders, (parallax) achtergronden en zelfs kleurenfilters. Dingen als schaduw effecten en shape dividers ontbreken hier echter, en de dingen die wel aanwezig zijn kun je een stuk minder customizen dan bij Elementor of Divi.

    Dat is op zich nog niet zo’n ramp, maar de manier waarop WP Bakery werkt is een stuk minder prettig dan hoe Elementor werkt. Als je bij Elementor iets aanpast zie je direct het effect van die aanpassing, dus als je bijvoorbeeld een achtergrondkleur aanpast zie je meteen – live op de pagina terwijl je het aanpast – hoe dat eruit ziet.

    Bij de WP Bakery page builder krijg je een popup waarin je je aanpassingen maakt, maar waar je bij Divi of Elementor direct het effect van een aanpassing ziet moet je bij WP Bakery de aanpassingen eerst opslaan en de popup sluiten voordat de wijzigingen zichtbaar worden op je site. Bevalt de gekozen kleur niet? Dan moet je de popup weer openen, een andere kleur kiezen, opslaan, sluiten…

    Dat is dus gewoon een backend editor die op de voorkant van je site opent, absoluut niet te vergelijken met de live frontend editors van Divi en Elementor. Ook dingen als padding en margin moet je hier op de gok instellen en hopen dat het goed is, omdat je anders weer naar die popup moet…

    De WP Bakery page builder heeft wel een flink aantal modules en er zijn veel (al dan niet betaalde) addons verkrijgbaar, en met een prijs van $ 45,00 voor 1 site, maar inclusief lifetime updates is de WP Bakery page builder niet heel duur. Maar ook niet heel goed dus, naar mijn mening.

    Elementor vs Beaver Builder

    Beaver builder is net als Elementor een gebruiksvriendelijke losse page builder plugin die je met vrijwel ieder WordPress thema kunt gebruiken. Net als Elementor werkt Beaver Builder op de voorkant van je site, en er is ook een gratis basisversie beschikbaar. Maar waar de gratis basisversie van Elementor zich kan meten met premium page builders als Divi en Avada is de gratis versie van Beaver builder zeer beperkt. De pro versie van Beaver builder is vrij prijzig en een stuk minder uitgebreid dan Elementor of Divi dus.

    Desondanks – of misschien wel juist daardoor – is Beaver Builder zeer populair onder WordPress ontwikkelaars. 

    Dit artikel bevat affiliate links. Dat wil zeggen dat ik een vergoeding krijg als je de pro versie van Elementor koopt via een link op deze pagina. Dat kost jou verder geen cent extra, maar zorgt er wel voor dat ik jou kan blijven helpen met dit soort gratis artikelen. Dus als je zelf Elementor Pro wilt aanschaffen stel ik het zeer op prijs als je dat via deze link doet 😉

    Ga je voor de gratis versie van Elementor? Dan kun je eventueel ook een kleine eenmalige donatie doen via de button hiernaast 🙂

  • WordPress page builders vergeleken : Divi vs Elementor vs Brizy vs Thrive vs Gutenberg

    WordPress page builders vergeleken : Divi vs Elementor vs Brizy vs Thrive vs Gutenberg

    Als je vroeger een WordPress site maakte had je een tekstvlak in de admin omgeving waarin je teksten kon invoeren. Je kon dan een tekst dik drukken, schuin zetten, een kleurtje geven en zelfs een afbeelding invoegen, maar daar hield het wel mee op. De rest van het uiterlijk van je site werd volledig bepaald door een thema, en je moest echt verstand van PHP, HTML en CSS hebben om daar invloed op te hebben.

    Rond 2012 / 2013 verschenen de eerste thema’s met een ingebouwde page builder op de markt, zoals Avada en Divi. Met deze WordPress page builders kon de gewone gebruiker ook zelf een pagina verdelen in meerdere rijen en kolommen, en beschikken over verschillende modules om bijvoorbeeld een afbeelding, tekst of een slider toe te voegen. Toen in 2016 Elementor gelanceerd werd, en later dat jaar Divi 3.0 met hun Visual Builder, werd het zelfs mogelijk om je aanpassingen live aan de voorkant van je website te doen, zodat je direct het effect van je aanpassingen ziet zoals je bezoekers dat zien!

    Op 6 december 2018 kregen alle WordPress gebruikers een cadeau van Sinterklaas in de vorm van Gutenberg, een visuele page builder die vanaf dan de standaard manier werd om pagina’s in WordPress aan te passen. Maar daar was – en is – niet iedereen even blij mee; de Classic Editor plugin waarmee je Gutenberg kunt uitschakelen is inmiddels meer dan
    5 miljoen keer geïnstalleerd.

    In dit artikel gaan we enkele populaire WordPress page builders vergelijken: Elementor, Divi, Thrive Theme Builder, new kid on the block Brizy en de standaard page builder van WordPress zelf, Gutenberg. We kijken alleen naar de features die in de page builder zelf zitten, dus niet naar wat er met plugins van externe partijen mogelijk is.

    Legenda

      
    Divi Divi
    Elementor page builder Elementor
    Brizy Brizy
    Thrive Theme Builder Thrive Theme Builder
    Gutenberg Gutenberg
    Inbegrepen in de gratis versie
    Inbegrepen in de premium (betaalde) versie
    Niet inbegrepen
    D Divi
    E Elementor
    B Brizy
    TThrive Architect
    G Gutenberg
    Basis Divi Elementor Page Builder Brizy WordPress Thrive Theme Builder Gutenberg
    Drag & drop editor
    Front-end editor (aanpassingen live aan de voorkant van je site doen)
    Layout Divi Elementor Page Builder Brizy WordPress Thrive Theme Builder Gutenberg
    Meerdere kolommen
    Kolommen slepen naar de gewenste breedte
    Padding en margin instellen
    Padding en margin instellen door te slepen
    Max-width, max-height en min-height instellen
    Styling Divi Elementor Page Builder Brizy WordPress Thrive Theme Builder Gutenberg
    Basis styling opties (kleuren, uitlijning, font grootte)
    Geavanceerde styling opties (randen, regelhoogte, schaduw)
    Achtergrond afbeeldingen en videos
    Shape dividers
    Animaties
    Filters / blend mode
    Hover effecten
    Transformatie effecten
    Scroll effects
    Google Fonts integratie
    Custom Fonts (eigen lettertypes uploaden)
    Font Awesome integratie (icons)
    Modules Divi Elementor Page Builder Brizy WordPress Thrive Theme Builder Gutenberg
    Slider module
    Contactformulier module
    Nieuwsbrief inschrijf module (voor MailChimp en andere providers)
    Social media knoppen die linken naar je profielen
    Social media deel knoppen
    Facebook berichten embedden
    Facebook comments
    Font Awesome integratie (icoontjes)
    Geavanceerde features Divi Elementor Page Builder Brizy WordPress Thrive Theme Builder Gutenberg
    Popup builder
    Conditionele weergave
    Mega menu
    A/B test mogelijkheid
    API (daarmee kunnen externe ontwikkelaars extra modules maken)
    Theme builder Divi Elementor Page Builder Brizy WordPress Thrive Theme Builder Gutenberg
    Header en footer builder
    Sticky header (header blijft in beeld als je scrollt)
    Templates maken voor pagina’s, berichten, archiefpagina’s, 404 pagina enzovoorts
    Dynamische content (teksten, afbeeldingen en andere data ophalen uit de database)
    Eigen WooCommerce pagina’s vormgeven
    Workflow Divi Elementor Page Builder Brizy WordPress Thrive Theme Builder Gutenberg
    Laatste wijziging(en) ongedaan maken of opnieuw doen
    Secties, rijen en modules / widgets kopieren en plakken
    Stijlen kopieren en plakken op dezelfde pagina
    Standaard stijl instellen voor een sectie, rij of module op de hele site
    Globale kleuren (als je een kleur op 1 plek aanpast wordt deze overal aangepast)
    Wireframe / layer view
    BibliotheekDivi Elementor Page Builder Brizy WordPress Thrive Theme Builder Gutenberg
    Bibliotheek met standaard designs
    Eigen designs opslaan in de bibliotheek voor hergebruik elders op de site
    Global designs (aanpassingen worden automatisch overal op de site doorgevoerd)
    Opgeslagen designs exporteren voor hergebruik op een andere site
    Responsive designDivi Elementor Page Builder Brizy WordPress Thrive Theme Builder Gutenberg
    Bekijken hoe je design eruit ziet op tablet en mobiel
    Onderdelen verbergen op desktop, tablet of mobiel
    Bepaalde eigenschappen aanpassen voor mobiel en tablet (padding, margin, font size)
    Andere content tonen op mobiel en tablet (andere teksten, afbeeldingen enzovoorts)
    PrijzenDivi Elementor Page Builder Brizy WordPress Thrive Theme Builder Gutenberg
    Gratis versie beschikbaar
    Premium versie voor 1 website (prijs per jaar) $ 89 $ 49 $ 45 $ 228
    Premium versie voor 25 websites (prijs per jaar) $ 89 $ 199 $ 89 $ 228
    Premium versie voor een ongelimiteerd aantal websites (prijs per jaar) $ 89 $ 999 $ 179
    Levenslange premium licentie voor een ongelimiteerd aantal websites $ 249 $ 349
      download download download download  

    Bob’s favoriet: Divi

    Divi is al jaren mijn persoonlijke favoriet. Zoals je kunt zien in de bovenstaande tabel is de Divi Builder één van de meest complete page builders voor WordPress, met enorm veel features. Divi is ook volop in ontwikkeling, waardoor er steeds weer nieuwe features bij komen. 

    Het grote aantal features in Divi zorgde er vroeger voor dat Divi behoorlijk zwaar was (en daardoor traag), maar sinds augustus 2021 wordt uitsluitend de code geladen voor modules en effecten die daadwerkelijk op een pagina gebruikt worden.

    Divi biedt ook heel veel styling opties, die bovendien voor elke module, rij en sectie beschikbaar zijn (dat is bij andere builders weleens anders).

    Daarnaast vind ik de user interface van Divi het meest gebruiksvriendelijk van allemaal. Dat komt door de visuele weergave van alles. Als je in Divi bijvoorbeeld een schaduw wilt instellen kun je eerst kiezen uit een aantal presets, die je daarna kunt fine-tunen.

    Andere builders zoals Elementor bieden geen presets, daar moet je de schaduw zelf naar wens zien te krijgen (zie het screenshot hiernaast). 

    Daarin zie je ook het verschil bij het toevoegen van shape dividers; waar je in Elementor en andere builders alleen de naam van de vorm ziet (bergen, golven, wolken) zie je in Divi gewoon een afbeelding van de betreffende shape divider zodat je direct ziet hoe het eruit ziet. Daarnaast wordt Divi geleverd met honderden voorbeeld sites, die allemaal bestaan uit meerdere pagina’s. Elke week wordt er weer een nieuwe voorbeeld site in een bepaalde niche toegevoegd, die je vervolgens gratis kunt downloaden.

    Ook Divi Presets is een ongeëvenaarde feature. Dit is een gebruiksvriendelijke versie van CSS classes. Hiermee kun je bijvoorbeeld een preset maken voor een knop met een blauwe achtergrond en witte letters, die je “knop blauw” noemt. Vervolgens kun je een nieuwe preset maken voor diezelfde knop, maar dan met een gele achtergrond en zwarte letters die je “knop geel” noemt. Je kunt dan de blauwe preset instellen als standaard voor alle nieuwe knoppen, maar ook eenvoudig een andere preset selecteren waardoor de betreffende knop alle styling kenmerken van de betreffende preset krijgt (niet alleen kleuren, maar ook padding, fonts, schaduws enzovoorts).

    Verder biedt Divi als enige responsive content. Bij de meeste builders kun je elementen verbergen op bepaalde apparaten, en meestal kun je ook wel dingen als de lettergrootte aanpassen per resolutie, maar alleen bij Divi kun je ook de content zelf aanpassen per resolutie. Je kunt dus een knop maken met “vraag direct een vrijblijvende offerte aan”, maar op mobiel de tekst aanpassen naar “offerte aanvragen”.

    Tenslotte is ook de licentie van Divi erg gunstig voor webbouwers: voor een eenmalige investering van $ 249 heb je een levenslange licentie, waarmee je zonder extra kosten levenslang recht hebt op updates en (uitstekende) support. Als je liever per jaar betaalt kan dat ook, de kosten bedragen in dat geval $ 89 per jaar.

    Als je maar 1 website hebt is Divi wat prijziger dan de andere builders in dit artikel, maar ook dan zeker de moeite waard!

    Elementor : Bobs keuze voor een gratis page builder

    Elementor is actief op meer dan 5 miljoen websites en is daarmee veruit de populairste page builder voor WordPress. Dat is ongetwijfeld te danken aan het feit dat Elementor de eerste gratis page builder was waarvan de gratis versie zich kan meten met de betaalde versie van andere pagebuilders.

    De gratis versie van Elementor biedt zelfs zoveel features dat ik me in het begin af vroeg wat de betaalde pro versie nog zou kunnen toevoegen, maar ook daar wist het Elementor team nog flink wat waarde toegevoegd te hebben.

    Zo kun je met de gratis versie van Elementor alleen de inhoud van de pagina zelf aanpassen, maar niet de header, footer, blog template, WooCommerce templates enzovoorts. Met de theme builder van Elementor Pro kun je al deze onderdelen wel aanpassen.

    Ook kun je in de gratis versie van Elementor alleen complete secties als globaal element opslaan in de bibliotheek. Als je een element als globaal opslaat worden wijzigingen overal op de website automatisch doorgevoerd. Dus als je bijvoorbeeld de achtergrondkleur van een knop aanpast wordt de achtergrondkleur van alle andere globale knoppen op de site ook automatisch aangepast.

    In de gratis versie van Elementor kun je echter geen losse knop opslaan in de bibliotheek, dat kan alleen in de pro versie.

    Verder bevat de pro versie onder andere een popup builder, een formulier widget, diverse social media widgets (social share buttons, een facebook comment box, een facebook embed widget en een click to tweet box), een prijstabel widget, een prijslijst widget, een flipbox widget, een animated headline widget, scroll effects enzovoorts. Daarnaast krijg je met de pro versie van Elementor toegang tot flink wat extra voorbeeld sites en secties (al zitten er ook al een aantal in de gratis versie).

    Elementor kan gebruikt worden met vrijwel ieder thema, en vanwege de populariteit wordt het ook vrijwel altijd ondersteund. Er zijn ook veel plugins van derden beschikbaar.

    Voor mensen die maar 1 website hebben is Elementor ook behoorlijk gunstig geprijsd: voor slechts $ 49 per jaar heb je toegang tot de volledige versie van Elementor Pro.
    Voor webbouwers en andere mensen die meerdere websites beheren loopt de prijs echter snel op, tot wel $ 999 per jaar als je meer dan 100 websites beheert.

    Als je gaat kijken naar de prijs per website valt dat natuurlijk best mee, maar toch… Divi doet echt niet onder voor Elementor en daar heb je een levenslange licentie voor een onbeperkt aantal websites voor slechts $ 249,00.

    Brizy

    Brizy is gelanceerd in 2018 en dus nog een vrij jonge page builder. Desondanks hebben ze inmiddels al zo’n 90.000 actieve installaties. Dat komt omdat de gratis versie van Brizy nóg uitgebreider is dan die van Elementor.

    Zo bevat de gratis versie van Brizy o.a. een contactformulier widget, diverse WooCommerce widgets, diverse social media widgets enzovoorts.

    Uiteraard heeft Brizy ook een pro versie, waarin features als een theme builder (voor het aanpassen van header, footer en andere templates), een WooCommerce builder en een popup builder te vinden zijn. 

    Brizy onderscheidt zich echter vooral door de manier waarop je de styling opties instelt. In plaats van het openen van deze opties in een sidebar zoals bij de meeste andere builders verschijnt er bij Brizy een subtiele toolbar boven het element wat je op dat moment wilt bewerken, met alleen de opties die je op dat moment nodig hebt.

    Dat zorgt er wel voor dat het allemaal vrij compact is, en er wordt dan ook veel gewerkt met icoontjes om ruimte te besparen. Dat is even wennen natuurlijk. Geavanceerdere opties openen overigens wel in een sidebar.

    Een andere leuke feature van Brizy is “block conditions”, waarmee je kunt instellen dat je een element wilt tonen of verbergen voor bepaalde gebruikersrollen (dat noemen ze “membership”) of op bepaalde pagina’s. Dat is echter een stuk minder uitgebreid dan de conditionele weergave van Divi, waarbij je er ook voor kunt kiezen een element alleen te tonen op bepaalde dagen, of als er bepaalde producten in de winkelwagen zitten, of als er een bepaalde pagina bezocht is enzovoorts.

    Ook voor andere features geldt vaak dat Brizy de betreffende feature wel heeft, maar dat de (instel) mogelijkheden vrij beperkt zijn. Aan de andere kant zijn er ook dingen die Brizy juist heel goed doet; zo kun je bijvoorbeeld elke gewenste module toevoegen aan een popup, het mega menu of de tabs module. Ook de kwaliteit van de designs van de voorbeeld sites is bovengemiddeld goed.

    De pro versie van Brizy kost ongeveer hetzelfde als die van Elementor, wat op zich prima is. Elementor biedt wel wat meer waarde in de pro versie, maar Brizy is natuurlijk nog een jonge builder. Dat zorgt er ook voor dat er nog vrijwel geen plugins van derden voor Brizy te vinden zijn.

    De prijzen voor webbouwers en andere mensen die meerdere websites beheren zijn een stuk gunstiger dan die van Elementor, maar wel wat hoger dan die van Divi. Divi biedt daarbij ook nog eens een stuk meer features, dus mijn keuze tussen die twee gaat voorlopig echt uit naar Divi.

    Desalniettemin is Brizy ook een erg leuke builder die je zeker moet proberen om te zien of het wat voor je is. En ook interessant: Brizy heeft ook een cloud versie, vergelijkbaar met Wix of Jimbo. Daarbij hoef je jezelf dus geen zorgen te maken over dingen als hosting en updates, want dat is bij Brizy Cloud allemaal inbegrepen.

    Thrive Theme Builder

    Thrive is een beetje een vreemde eend in de bijt. Thrive Themes, het bedrijf dat de Thrive Theme Builder maakt, heeft namelijk nog een aantal andere plugins.

    Eén daarvan is bijvoorbeeld Thrive Optimize, waarmee je hele uitgebreide A/B tests kunt doen. Een tweede is Thrive Leads, waarmee je inschrijvingen voor je nieuwsbrief kan verzamelen op allerlei manieren. 

    Ook een quiz builder en een learning management systeem (LMS) genaamd Thrive Apprentice maken onderdeel uit van het aanbod.

    En met hun nieuwste plugin, Thrive Automator, kun je processen automatiseren zoals het toevoegen van een gebruiker die net iets heeft gekocht in je webshop aan je mailinglist, of het starten van een countdown timer met een aanbod voor een cursus als een gebruiker een bepaald resultaat heeft behaald in een quiz.

    Met de producten van Thrive is weinig mis, maar de prijzen zijn echter wel aan de hoge kant. Vroeger viel dat reuze mee; een levenslange licentie voor 1 van hun producten kostte toen $ 59, en voor het dubbele had je 15 licenties. Maar sinds februari 2021 biedt Thrive alleen nog een lidmaatschap (Thrive Suite genaamd) aan waarmee je al hun producten op maximaal 25 sites mag gebruiken voor $ 228,00 per jaar ($ 19 per maand).

    Persoonlijk vind ik dat dus vrij prijzig, maar je krijgt er wel prima producten voor terug en ik ken geen andere aanbieder die zo’n uitgebreid productaanbod heeft in deze prijsklasse.

    Gutenberg

    Gutenberg is de standaard blok editor van WordPress zelf. En hoewel Gutenberg steeds beter wordt is het toch echt nog niet te vergelijken met de page builders hierboven, zoals ook wel blijkt uit het enorme aantal rode kruisjes.

    Er komen wel steeds meer blokken (= modules / widgets) bij, en vanaf 2022 wordt Gutenberg zelfs een heuse theme builder waarmee je ook je header, footer en templates kunt bouwen, maar met name het vrijwel totale gebrek aan styling mogelijkheden – je kunt nog net de kleuren aanpassen maar daar houdt het wel zo’n beetje mee op – maakt Gutenberg naar mijn mening leuk voor het schrijven van blog posts, maar zeker niet geschikt om echt een website mee te bouwen.

    Echter, juist omdat het de standaard page builder van WordPress is zijn er wel steeds meer plugins zoals Qubely, Kadence Blocks en Stackable die extra functionaliteit toevoegen aan Gutenberg. Bekijk hier mijn Gutenberg Blocks plugin vergelijking.

    Hoewel dit soort plugins enorm veel mogelijkheden toevoegen aan Gutenberg blijft het voorlopig toch een backend builder die geen goed beeld geeft van hoe de website er voor bezoekers uit ziet.

    Maar goed, het is wel de toekomst van WordPress… en met een goed thema kom je al een heel eind 😉

    Ben je benieuwd naar een eigenschap die nog niet in de tabel hierboven staan? Laat dan gerust een reactie achter hieronder, dan zoek ik het voor je uit!

    Hulp nodig met je website?

    Dit artikel is geschreven door Bob de webbouwer, een allround website expert die regelmatig blogt over allerlei onderwerpen die je helpen bij (het bouwen van) jouw website. Heb je hulp nodig? Huur Bob de webbouwer dan in om een website voor je te bouwen, jouw website te verbeteren of een training over dit onderwerp te verzorgen.

    Vraag direct een vrijblijvende offerte aan

    Dit artikel bevat affiliate links. Dat wil zeggen dat ik een vergoeding krijg als je een betaalde page builder koopt via een link op deze pagina. Dat kost jou verder niets extra’s, maar zorgt er wel voor dat ik jou kan blijven helpen met dit soort gratis artikelen. Dus als je zelf een page builder wilt aanschaffen stel ik het zeer op prijs als je dat via deze pagina doet 😉

    Ga je voor Gutenberg of de gratis versie van Elementor of Brizy? Dan kun je eventueel ook een kleine eenmalige donatie doen via de button hiernaast 🙂

     

  • Bricks Builder review – een betaalbaar Elementor Pro alternatief

    Bricks Builder review – een betaalbaar Elementor Pro alternatief

    Bricks Builder is alweer een gloednieuwe WordPress page builder, waarvan de eerste versie is gelanceerd op 16 maart 2021. Het was eigenlijk de bedoeling dat Bricks al een jaar eerder werd uitgebracht, maar zoals ze zelf zeggen: excellence takes time. Laten we eens kijken of Bricks Builder excellent genoeg is om de concurrentie met gevestigde page builders als Divi en Elementor aan te kunnen…

    Over Elementor gesproken…

    Komt de user interface in het screenshot hiernaast jou ook zo bekend voor? 
    Als ik niet beter zou weten zou ik denken dat Bricks Builder gewoon een Elementor add-on met een andere skin was, zoals 10Web builder

    Dat is echter niet het geval – Bricks is niet eens een plugin, maar een thema.
    Een enorm snel thema, al helemaal als je kijkt naar alle features die Bricks biedt.
    Hun eigen homepage (ook gebouwd met Bricks) scoort 94/100 op mobiel in
    Google’s Pagespeed test.

    Dat is echt een uitstekende score, zeker aangezien er geen optimalisatie plugins zijn gebruikt om die score te behalen. Dat komt omdat Bricks Builder is gebouwd met Vue, een nieuwe Javascript bibliotheek die de browser het meeste werk laat doen.

    Bij de meeste WordPress sites doet de server waarop de website gehost wordt het meeste werk, maar zo’n server moet honderden bezoekers tegelijk bedienen. Jouw computer of telefoon hoeft dat alleen voor jou te doen, waardoor die een stuk sneller klaar is dan een server. 

    Elementor was overigens niet de enige inspiratiebron voor de ontwikkelaars van Bricks. Het canvas met gekleurde containers en elementen (modules in Divi en widgets in Elementor) lijkt weer heel erg op Divi, wat ook geldt voor de manier waarop je de rand van elk onderdeel kunt slepen om de gewenste padding in te stellen. 

    Het instellingen paneel lijkt juist weer erg op dat van Oxygen. Nu ben ik persoonlijk niet zo’n fan van Oxygen, en net als Oxygen gebruikt ook Bricks Builder vrij veel CSS terminologie,
    maar om een of andere reden voelt de interface van Bricks toch meer intuïtief. Ik ga hier zo nog wat dieper op in.

    Bricks Builder is dus een thema met een ingebouwde page builder, net als Divi en Avada. Of eigenlijk is het een thema met een ingebouwde theme builder, want je kunt ook je eigen header, footer, archief pagina’s, berichten template enzovoorts maken met Bricks. Maar goed, dat kan met alle andere premium page builders ook… Biedt Bricks Builder ook nog iets wat ik nog niet eerder heb gezien? 

    Bricks Builder features – wat maakt het anders dan anderen?

    Nou, ten eerste dus de snelheid. Zoals ik eerder al schreef is Bricks Builder extreem snel, zowel voor de bezoeker als tijdens het bouwen zelf. De builder laadt in een paar seconden en alles voelt erg snel en intuitief aan. Er zijn ook enkele instellingen waarmee je overbodige code in WordPress zelf kunt uitschakelen, zoals emojis en embeds.

    Thema stijlen

    Bricks beschikt ook over een uitgebreid thema stijl systeem, waarmee je een standaard waarde kunt instellen voor dingen als kleuren, typografie, margin en padding voor alle elementen. Nu is dat op zich niet zo bijzonder, er zijn meer thema’s die deze mogelijkheid bieden. Maar in Bricks kun je ook standaard stijlen instellen voor ieder element (widget of module dus). Dat is iets minder uitgebreid dan Divi’s Presets systeem, maar nog steeds erg bruikbaar. Je kunt zelfs meerdere thema stijlen instellen, en die conditioneel gebruiken voor bepaalde pagina’s, berichten enzovoorts. Je kunt deze thema stijlen zelfs exporteren naar een andere Bricks site.

    Pagina instellingen

    In de pagina instellingen kun je de header en footer uitschakelen, een punt navigatie toevoegen, de permalink, titel en meta description aanpassen, en zelfs instellen welke titel, omschrijving en afbeelding gebruikt worden wanneer de pagina gedeeld wordt op social media.

    Templates

    Net als iedere theme builder heeft ook Bricks een template bibliotheek waarin je templates voor je header, footer, archiefpagina, blogberichten enzovoorts kunt opslaan.
    Je kunt meerdere templates in 1 bundel stoppen zodat je gemakkelijk kunt vinden welke templates bij elkaar horen. Op die manier kun je meerdere headers, footers en andere templates ontwerpen in verschillende stijlen, en alle templates met dezelfde stijl bundelen. 

    Maar waarom zou je templates in meerdere stijlen ontwerpen? Nou, omdat je templates kunt delen met andere Bricks gebruikers, bijvoorbeeld met je klanten, waardoor jouw templates ook in hun template bibliotheek verschijnen. Je kunt templates ook gewoon exporteren als json file.

    Je kunt niet alleen complete pagina’s, maar ook containers opslaan als template. Individuele elementen kun je opslaan als globaal element. Dat wil zeggen dat als je op 1 plek iets aanpast aan een element, die aanpassingen ook automatisch wordt doorgevoerd op alle andere plekken waar dat globale element gebruikt wordt. 

    Bricks wordt geleverd met zo’n 70 standaard templates in 3 verschillende stijlen (bundles). Dat is wat weinig in vergelijking met de concurrentie maar dat aantal zal ongetwijfeld groeien in de toekomst.

    Containers en elementen

    Ik heb al een paar keer het woord “containers” gebruikt, maar wat zijn containers in Bricks Builder eigenlijk?

    Containers zijn te vergelijken met secties in andere page builders, maar waar je bij andere page builders rijen en kolommen toevoegt om de gewenste layout te bouwen voeg je bij Bricks gewoon meer containers toe. Containers zijn eigenlijk gewoon CSS flex elementen (en binnenkort kun je ook kiezen voor CSS grid). Dat zegt je wellicht helemaal niets, dus laat ik het even uitleggen 🙂

    Containers kunnen zowel verticaal (onder elkaar) als horizontaal (naast elkaar) worden weergeven. Wil je dus een layout met 3 rijen? Dan voeg je gewoon 3 containers in en stel je in dat deze verticaal moeten worden weergegeven. Wil je juist een layout met drie kolommen? Dan voeg je diezelfde 3 containers in, maar stel je in dat die horizontaal moeten worden weergegeven. 

    Je kunt ook containers invoegen in andere containers, waardoor je dus bijvoorbeeld 3 containers onder elkaar kunt hebben (3 rijen dus), waarvan 1 rij 3 kolommen heeft.
    Dat heb ik in het screenshot hieronder gedaan: container 1, 2 en 3 zijn verticaal uitgelijnd en staan dus onder elkaar, en container 3 bevat weer drie containers die horizontaal zijn uitgelijnd. Deze drie containers (3a, 3b en 3c) vormen dus 3 kolommen.  

    In elke container kun je ook elementen plaatsen. Zo bevat container 1 een heading element en container 2 bevat twee knoppen. Ook hiervoor kun je weer instellen of die elementen naast elkaar (zoals de knoppen) of onder elkaar moeten komen, en of ze links, rechts, boven, onder of in het midden moeten komen.

    De Bricks manier is even wennen, zeker als je al ervaring hebt met een andere page builder die met de traditionele rijen en kolommen structuur werkt.
    Maar deze manier geeft wel zeer veel flexibiliteit omdat je iedere layout kunt maken die je maar wilt.

    Die flexibiliteit vind je ook bij andere dingen; zo kun je bijvoorbeeld een ongelimiteerd aantal verloopkleuren toevoegen aan een overlay, achtergrond of tekst (inderdaad, je kunt (kop)teksten maken die bestaan uit meerdere kleuren 😮 ).

    Je kunt ook een onbeperkt aantal shape dividers gebruiken, en voor ieder element – zowel horizontaal als verticaal (nog eens 😮 ).

    Bricks Builder bevat zo’n 50 elementen, wat een prima aantal is. Alle basiselementen zijn aanwezig, zoals elementen voor het toevoegen van tekst, afbeelding (ook galerij of carousel), knop, slider, accordeon, referentie, prijstabel, een eenvoudig contactformulier, tabbladen, teller, Google Maps enzovoorts. Een leuke extra is dat je elementen die je vaak gebruikt bovenaan kunt vastzetten zodat je ze niet steeds hoeft te zoeken.

    Er zijn ook enkele meer geavanceerde elementen, zoals het post element waarmee je niet alleen berichten kunt weergeven, maar ook pagina’s of custom post types. Hierbij kun je ook bepaalde posts uitsluiten (of juist alleen bepaalde posts weergeven), en je kunt kiezen uit een lijst, raster, masonry of metro (remember Windows 8?) layout. Verder kun je kiezen welke onderdelen je wilt tonen (titel, samenvatting, afbeelding, meta) en in welke volgorde, en je kunt de afbeeldingen in een lijstweergave afwisselend links en rechts tonen. Wederom flink wat flexibiliteit om je layout aan te passen aan je wensen dus.

    Voor de single post pagina is er ook een element voor gerelateerde berichten, en een element waarmee je een navigatie naar het vorige en volgende bericht kunt  toevoegen.

    Bricks Builder biedt veel mogelijkheden dynamic data te gebruiken, zelfs inline (oké, nog 1 keer… 😮 ) Je kunt dus een tekstblok maken en de post titel, auteur of een ACF veld op elke gewenste plek in die tekst verwerken. Dat is iets wat ik nog niet ben tegengekomen in een andere page builder.

    CSS filters, animaties and transform

    De meeste page builders bieden wel CSS filters zoals brightness, contrast, blur, sepia enzovoorts. Maar de meeste builders bieden die filters alleen voor afbeeldingen (Elementor),
    of de filters worden toegepast op alle onderdelen in een sectie, rij of element (Divi). Dit terwijl die effecten juist heel handig zijn voor achtergrond afbeeldingen, maar de meeste builders bieden geen mogelijkheid om het effect alleen toe te passen voor achtergrondafbeeldingen.

    Als ik in Divi bijvoorbeeld de achtergrondafbeelding van een sectie wazig wil maken (met de blur filter) worden ook de tekst en alle andere onderdelen in die sectie wazig.
    Bricks Builder past het filter juist wel alleen toe op de (achtergrond) afbeelding, naar mijn mening een veel nuttigere benadering.

    Naast filters biedt Bricks Builder ook een flink aantal animaties en transform effecten zoals het schuintrekken, roteren of schalen van ieder element (maar nog niet on scroll helaas).

    Unsplash integratie

    Over nuttige dingen gesproken, Bricks biedt ook Unsplash integratie 🙂 Overal waar je een (achtergrond) afbeelding kunt toevoegen vind je ook een “browse unsplash” knop. 
    Als je daarop klikt opent er een popup venster waarmee je de volledige Unsplash catalogus kunt doorzoeken, die meer dan 1 miljoen rechtenvrije stockfoto’s bevat die je gratis op je website mag gebruiken.

    Developer vriendelijk, maar iets minder eindgebruikersvriendelijk

    Bricks Builder bevat dus flink wat features voor gebruikers die geen code kunnen schrijven, maar ook voor gebruikers die wel zelf kunnen coderen.

    Zo kun je aan elk onderdeel custom CSS, of een CSS class of ID toevoegen. 
    Dat is echter iets wat de meeste page builders bieden.

    Wat de meest page builders niet bieden is een JS blok om scripts toe te voegen aan de header, body en footer van de website. Je kunt scripts toevoegen voor de hele website (bijvoorbeeld Google Analytics code) maar ook per pagina. Je kunt zelfs je eigen elementen programmeren voor Bricks Builder!

    Er is ook een structure paneel aanwezig, waarmee je eenvoudig de structuur van een pagina kunt inzien (zie screenshot containers). Als je over een onderdeel gaat met de muis verschijnt er een rand omheen in de builder, zodat je direct ziet welk onderdeel het betreft.

    Zoals ik in het begin al schreef gebruikt Bricks veel CSS termen, zoals display (wat je op “none” moet zetten om bijvoorbeeld een onderdeel te verbergen op mobiel), positioning (relative, fixed of absolute), justify en direction (row of column, met reverse om de volgorde om te keren op mobiel) enzovoorts.

    Dat maakt Bricks wat minder gebruiksvriendelijk voor normale gebruikers dan een page builder als Divi, maar dat geldt eigenlijk voor vrijwel iedere page builder.
    Dat komt omdat Divi veel visuele elementen gebruikt in plaats van tekst,
    zoals Bricks (maar ook Elementor en andere builders).

    Om dat te illustreren heb ik hiernaast een screenshot geplaatst van de schaduw instelling in Divi (links) en Bricks (rechts). In Divi kies je eerst 1 van de 8 afbeeldingen bovenaan, waarna de andere opties verschijnen om de schaduw te fine-tunen. 

    In Bricks Builder zie je alleen een paar inputs waar je handmatig de waardes voor x, y, blur en spread moet invoeren. Dat geldt ook dingen als shape dividers, animaties, transformatie effecten enzovoorts. Als je bijvoorbeeld een shape divider wil instellen zie je in Divi gewoon een aantal afbeeldingen van de verschillende vormen, terwijl je in Bricks (en Elementor) alleen een lijst ziet met de namen van de verschillende vormen (golven, wolken, druppels enzovoorts). 

    Prijzen

    Omdat Bricks Builder pas net gelanceerd is hebben ze een zeer verleidelijke lifetime deal voor “early adapters”. Voor slechts $ 59,00 heb je een licentie voor 1 site met levenslange updates en support, en voor $ 149,00 mag je Bricks gebruiken op 1.000 websites.

    Conclusie

    Als je mij een beetje kent hoef ik je vast niet te vertellen dat ik direct een licentie voor 1.000 websites heb gekocht 😉  Bricks is dan wel wat minder gebruiksvriendelijk dan Divi,
    maar ze bieden wel een aantal zeer interessante en soms zelfs unieke features. Om er een paar uit te lichten:

    • De snelheid, zowel front-end als in de builder zelf – wat een belangrijke ranking factor in Google is.
    • Meerdere standaard stijlen instellen, ook voor elementen.
    • Zeer flexibel door het gebruik van containers in plaats van een vaste rij/kolom structuur.
    • Een ongelimiteerd aantal verloopkleuren.
    • Een ongelimiteerd aantal shape dividers, zowel horizontaal als verticaal, voor ieder onderdeel.
    • Lijst, raster, masonry of metro layouts voor berichten, galerijen enzovoorts.
    • Dynamic data, zelfs inline.
    • CSS filters voor (achtergrond) afbeeldingen.
    • Unsplash integratie.

    Naar mijn mening is Bricks Builder een prima keuze als je op zoek bent naar een betaalbaar alternatief voor Elementor Pro. Tuurlijk, op dit moment missen er nog wat populaire Elementor Pro features zoals een popup builder, WooCommerce builder (die als het goed is eind april wordt gereleased) en scroll animaties, maar Bricks is pas net uitgebracht and biedt nu al een aantal interessante features die Elementor niet heeft.

    Zoals bij alle nieuwe producten is het natuurlijk de vraag of het over 5 jaar nog bestaat en actief ontwikkeld wordt, maar met deze features voor die prijs ben ik zeker bereid die gok te wagen. En jij?

    Video overview van Bricks Builder

    Zelf je website bouwen, maar dan wel met wat hulp van een expert?

    Kies dan voor Bobs Website in 1 dag pakket! Met dit pakket gaan we samen een hele dag achter de computer zitten (kan eventueel ook online via Zoom) en is aan het einde van de dag (de basis van) je nieuwe website klaar!

    Van tevoren regelt Bob alle technische zaken zoals het instellen van WordPress en het installeren van alle benodigde plugins, zodat we die dag meteen aan de slag kunnen met het leukste gedeelte; het ontwerpen en vullen van de website 🙂 .

    Doordat we de website samen bouwen leer je precies hoe WordPress werkt en hoe je alles kunt aanpassen.

    En kom je er toch even niet uit? Dan mag je Bob altijd even bellen of mailen, want je krijgt 3 maanden support!

    Bekijk alle details van Bobs Website in 1 dag pakket

    Dit artikel bevat affiliate links. Dat wil zeggen dat ik een vergoeding krijg als je Bricks Builder koopt via een link op deze pagina. Dat kost jou verder niets extra’s, maar zorgt er wel voor dat ik jou kan blijven helpen met dit soort gratis artikelen. Dus als je Bricks wilt aanschaffen stel ik het zeer op prijs als je dat via deze link doet 😉

    Ga je voor Elementor of een andere gratis oplossing? Dan kun je eventueel ook een
    kleine eenmalige donatie doen via de button hiernaast 🙂

     

  • Elementor verhoogt prijzen voor webbouwers

    Elementor verhoogt prijzen voor webbouwers

    Elementor heeft vandaag aangekondigd de prijzen van Elementor Pro voor webbouwers flink te verhogen. Of althans, de limiet voor het huidige Expert plan wordt verlaagd van 1.000 naar slechts 25 websites voor $ 199,00 per jaar. Als je Elementor Pro wilt gebruiken op meer dan 25 websites kun je kiezen tussen het Studio plan, waarbij je $ 499,00 betaalt voor 100 websites, of het Agency plan, waarbij je $ 999,00 gaat betalen voor dezelfde 1.000 websites die je met het huidige Expert plan kunt toevoegen.

    VIP Support

    Dat is dus een fikse prijsverhoging. Krijg je daar dan helemaal niets voor terug? Nou, niet veel, maar wel VIP support. Dat houdt in dat je gebruik kunt maken van live chat support, of een ticket kunt aanmaken waarop je gegarandeerd binnen 30 minuten een reactie krijgt. 24 uur per dag, 7 dagen per week. Bij de andere betaalde Elementor Pro abonnementen krijg je nog steeds de huidige premium support, waarbij je binnen een dag een reactie mag verwachten. 

    Website kits

    Daarnaast krijg je vanaf het Expert plan toegang tot 100+ website kits. Elementor kits zijn complete standaard websites, met templates voor meerdere pagina’s (homepage, over ons pagina, product pagina, contact pagina enzovoorts) compleet met een header, footer, 404 pagina enzovoorts.

    Elementor Experts Network profiel

    Ook krijg je vanaf het Expert plan een eigen profiel op het nieuwe Elementor Experts platform, waar klanten een Elementor expert kunnen vinden om hun website te bouwen.

    Nieuwe Elementor prijzen vanaf 9 maart 2021

    Deze prijswijziging gaat in vanaf 9 maart 2021. Als je voor die tijd een Expert account hebt blijft dit actief onder de huidige voorwaarden: $ 199,00 per jaar voor 1.000 websites.

    Elementor alternatieven

    Ben je op zoek naar een betaalbaarder alternatief voor Elementor Pro? Mijn persoonlijke favoriet is altijd al Divi geweest, waar je voor $ 249,00 een levenslange licentie voor een onbeperkt aantal websites hebt. Ook Brizy is een erg leuke builder met zeer betaalbare prijzen.

    Hulp nodig met je website?

    Dit artikel is geschreven door Bob de webbouwer, een allround website expert die regelmatig blogt over allerlei onderwerpen die je helpen bij (het bouwen van) jouw website. Heb je hulp nodig? Huur Bob de webbouwer dan in om een website voor je te bouwen, jouw website te verbeteren of een training over dit onderwerp te verzorgen.

    Vraag direct een vrijblijvende offerte aan

  • 10Web AI Builder – een betaalbaar Elementor Pro alternatief

    10Web AI Builder – een betaalbaar Elementor Pro alternatief

    Ik zag laatst op Facebook een advertentie voorbij komen van 10Web, een hostingbedrijf dat ook een aantal premium plugins aanbiedt. De nieuwste plugin heet 10Web AI Builder,
    een page builder die gebaseerd is op Elementor, uitgebreid met een flink aantal widgets en andere functies (waaronder een header/footer builder) die normaal alleen in
    Elementor Pro beschikbaar zijn.

    Het unieke van de 10Web AI Builder is echter de belofte dat hun builder een bestaande website automatisch kan nabouwen, waarna je deze kunt bewerken met de 10Web Builder – met Elementor dus. Je voert de URL in van een bestaande website, en de 10Web AI builder bouwt deze voor je na in Elementor. Dat klinkt bijna te mooi om waar te zijn… laten we eens kijken of dat ook zo is 😉

    10Web AI Builder

    Ik heb enkele van mijn eigen websites laten nabouwen in de 10Web AI Builder en moet eerlijk zeggen dat ik wat teleurgesteld ben in het resultaat.

    Ten eerste wordt niet de hele website gekopieerd, maar alleen de pagina’s die je opgeeft. Je kopieert in principe de homepage, en nog maximaal 4 andere pagina’s.

    Ook gaan dingen als uitlijning, de breedte en hoogte van elementen, font grootte enzovoorts niet helemaal goed, zelfs niet als de site die je kopieert ook al in Elementor was gemaakt. 

    Daarnaast worden de originele URLs niet aangehouden, waardoor je hele rare URLs krijgt met daarin de URL van de originele website en de datum en tijd dat de kopie is gemaakt. Bij menu items waarvan de pagina niet is mee gekopieerd wordt de URL vervangen door een willekeurige tekenreeks waardoor ze niet meer werken.

    Hiernaast heb ik mijn eigen homepage laten namaken door de 10Web AI Builder. 
    Links zie je de originele versie (gemaakt met WordPress en Divi), rechts de kopie die gemaakt is door de 10Web AI Builder.

    Zoals je ziet klopt het grote geheel vrij aardig, en alle teksten en afbeeldingen zijn netjes omgezet naar standaard Elementor widgets. Mijn header is ook opgeslagen als header template, en er is zelfs een nieuw contactformulier aangemaakt op mijn contactpagina met dezelfde velden als in het origineel.

    Er zijn echter ook een flink aantal dingen die niet kloppen; zo loopt de gele balk bovenaan op de originele website helemaal door, de zoekbalk is een stuk kleiner geworden en niet goed uitgelijnd, alle icoontjes zijn verdwenen, de knoppen staat niet meer naast elkaar, de eerste knop heeft opeens afgeronde hoeken, de rand bij de tweede knop is foetsie, de ruimte tussen de bovenste 2 kolommen is veel te smal en zo kan ik nog wel even doorgaan…

    Het idee achter de 10Web AI Builder is geweldig, maar de uitvoering laat dus duidelijk nog het een en ander te wensen over.
    Maar goed, de AI Builder is pas net uit en dit is dus pas de allereerste versie. Die is dus nog niet perfect, maar zeker wel veelbelovend 🙂 

    Elementor Pro features

    De 10Web AI Builder viel dus een beetje tegen… en toch heb ik meteen een licentie aangeschaft. Dat heeft niet eens zoveel te maken met de AI Builder, al heeft die absoluut potentie.

    De reden dat ik direct een licentie heb aangeschaft is de 10Web Builder zelf; de builder waarmee je de kopie bewerkt dus. Die kun je namelijk ook gebruiken zonder eerst een kopie van een andere website te maken, op elke willekeurige WordPress site.

    Wat de 10Web Builder zo bijzonder maakt is dat ze de meeste Elementor Pro features hebben nagebouwd, waardoor je met de 10Web Builder toegang hebt tot allerlei dingen waarvoor je normaal Elementor Pro nodig hebt.

    Met de gratis versie van Elementor in combinatie met de 10Web Builder heb je bijvoorbeeld een header & footer builder en kun je templates maken voor pagina’s, berichten, je blogarchief, je 404 pagina enzovoorts.

    Uiteraard bouw je al deze templates met de standaard Elementor widgets en kun je gebruik maken van dynamic content. En net als bij Elementor Pro kun je ook nu condities instellen, waardoor je bijvoorbeeld een andere header kunt instellen voor berichten in een bepaalde categorie.

    Naast de standaard Elementor widgets beschik je met de 10Web Builder ook over (een goed gelukte kopie van) vrijwel alle Elementor Pro widgets, zoals de prijstabel en prijslijst, de posts widget, de flipbox, de animated headline, de countdown, diverse carousels enzovoorts. Voor sommige dingen zoals een contactformulier, fotogalerij of Facebook feed dien je nu nog een aparte plugin van 10Web te installeren (die uiteraard bij de prijs zijn inbegrepen), maar ook daarvoor zijn reeds Elementor widgets in ontwikkeling. Alle widgets kun je ook opslaan als globale widget.

    Ook een WooCommerce builder ontbreekt niet in de 10Web Builder plugin, waarmee je zelf je productpagina’s en andere WooCommerce pagina’s naar wens kunt vormgeven. 
    Sommige Elementor Pro features zijn nog niet beschikbaar in de 10Web Builder plugin, zoals een popup builder, motion effects en TypeKit integratie, maar ook dit staat op de roadmap.

    Waarom 10Web Builder in plaats van Elementor Pro?

    Maar als 10Web Builder net wat minder features bevat dan Elementor Pro, waarom zou je dan toch voor 10Web Builder kiezen?
    De belangrijkste reden daarvoor is simpel: de prijs is veel aantrekkelijker voor webbouwers.

    Als je de Elementor Pro features wilt gebruiken op maximaal 25 websites raad ik je absoluut de officiële Elementor Pro plugin aan.

    Maar wil je Elementor Pro gebruiken op meer dan 25 websites? Dan biedt 10Web een prima alternatief met een prijs van $ 199 per jaar voor een ongelimiteerd aantal websites.

    Als bonus krijg je ook toegang tot een aantal premium plugins van 10Web, waaronder hun Photo Gallery plugin, een MailChimp plugin, een slider plugin, en een Facebook en Instagram Feed plugin. Het is echter de bedoeling dat deze plugins op korte termijn vervangen worden door Elementor widgets.

    Ten slotte beschikt de 10Web Builder nog over enkele andere handige features zoals een image optimizer tool en een security tool.

    Conclusie

    De 10Web AI Builder is een veelbelovend product, maar werkt nog niet 100%. Maar hoewel het resultaat nog niet perfect is scheelt het natuurlijk toch een hoop werk dan wanneer je helemaal vanaf 0 moet beginnen. 

    De echte waarde zit ‘m wat mij betreft echter in de premium Elementor functies van de 10Web Builder, die verrassend veel lijken op de officiële Elementor Pro versie. De widgets, de header / footer en template builder, de woocommerce builder… het werkt allemaal ongeveer hetzelfde als het origineel. 

    Dus bouw je professioneel websites en werk je graag met Elementor Pro, maar heb je geen zin in de hoge kosten voor webbouwers?
    Dan is 10Web Builder misschien precies het betaalbare alternatief wat je zocht!

    Website laten bouwen met Elementor en 10Web Builder?

    Dit artikel is geschreven door Bob de webbouwer, een allround website expert die regelmatig blogt over allerlei onderwerpen die je helpen bij (het bouwen van) jouw website. Heb je hulp nodig? Huur Bob de webbouwer dan in om een website voor je te bouwen, jouw website te verbeteren of een training over dit onderwerp te verzorgen.

    Vraag direct een vrijblijvende offerte aan

    Dit artikel bevat affiliate links. Dat wil zeggen dat ik een vergoeding krijg als je de 10Web builder koopt via een link op deze pagina. Dat kost jou verder niets extra’s, maar zorgt er wel voor dat ik jou kan blijven helpen met dit soort gratis artikelen.
    Dus als je zelf een page builder wilt aanschaffen stel ik het zeer op prijs als je dat via deze link doet 😉

    Ga je voor de gratis versie van Elementor of een andere gratis oplossing, maar wil je me toch bedanken voor dit artikel? Dan kun je eventueel ook een kleine eenmalige donatie doen via de button hiernaast 🙂

     

  • Wix, Squarespace, Jimdo of WordPress – Wat is de beste manier om een website te bouwen?

    Wix, Squarespace, Jimdo of WordPress – Wat is de beste manier om een website te bouwen?

    Als je zelf een website wilt bouwen heb je een enorme keuze uit gratis of betaalde software om dat te doen. Maar welke is nu het meest gebruiksvriendelijk, welke biedt de meeste mogelijkheden en wat kost dat allemaal? In dit artikel bespreekt website expert Bob de webbouwer de 4 populairste mogelijkheden:

    Wix

    Wanneer je een Wix website gaat maken heb je 2 keuzes; je kunt Wix automatisch een website voor je laten bouwen door een aantal vragen te beantwoorden, of je kunt zelf aan de slag met de Wix editor.

    Automatisch je website laten maken met Wix ADI

    In het eerste geval vraagt Wix o.a. voor wat voor bedrijf je een website wilt bouwen, welke functies die website moet bevatten (bijvoorbeeld een webshop, live chat, reserverings module, Instagram feed enzovoorts. Je kunt zelfs de website al (deels) automatisch vullen door je bestaande website en/of Google Places profiel op te geven. Vervolgens kun je je logo uploaden en je contactgegevens en social media accounts toevoegen.

    Daarna kies je voor een bepaald thema, en kun je indien gewenst een standaard kleurenpalet laten creëren op basis van je logo. Bij elke stap word je gerustgesteld; je kunt het later allemaal nog aanpassen. In de laatste stap zie je 3 verschillende ontwerpen op basis van je keuzes. Zodra je een ontwerp hebt gekozen wordt je website door Wix in elkaar gezet, en na een paar minuten kun je aan de slag met het bewerken van je site. 
    Dat bewerken doe je met een gebruiksvriendelijke editor. Als je op een onderdeel klikt openen de instellingen daarvoor in de linker sidebar. Je kunt hier bijvoorbeeld een ander ontwerp voor het betreffende onderdeel kiezen, teksten en afbeeldingen aanpassen enzovoorts.

    Links bovenin de editor vind je een kopje “toevoegen”, waarmee je een nieuwe pagina kunt toevoegen, maar ook nieuwe onderdelen aan de huidige pagina kunt toevoegen.

    Je kunt kiezen uit honderden professioneel ontworpen secties; blokken met inhoud die bij elkaar hoort. Zo is het navigatiemenu een sectie, het “over ons” gedeelte een sectie, de referenties een sectie, het contactformulier een sectie, het nieuwsbrief inschrijfformulier een sectie enzovoorts.

    De bewerkingsmogelijkheden zijn relatief beperkt; je kunt bijvoorbeeld niet alle achtergronden aanpassen, geen elementen toevoegen aan bestaande secties
    (wel erboven of eronder, maar je kunt dus geen “offerte aanvragen” knop toevoegen aan je sectie met diensten), de witruimte niet aanpassen enzovoorts.
    Aan de andere kant bestaan de standaard secties uit een aantal elementen; zo kan een hero sectie bijvoorbeeld een koptekst, een achtergrondafbeelding en 2 knoppen bevatten, en een recensies sectie kan een foto, titel en knop bevatten. Je kunt voor ieder element instellen of je het betreffende element wel of niet zichtbaar wilt hebben. Verder kun je de kleuren van teksten en knoppen aanpassen, maar wel alleen met kleuren binnen het kleurenpalet. Dat is op zich prima, want zo blijft het design lekker consistent, en je kunt kiezen uit meerdere kleurenpalets (gebaseerd op 1 hoofdkleur).

    Zelf je website maken met de Wix editor

    Wil je toch liever alles zelf bepalen? Kies dan voor de Wix editor. Ook nu begin je met een standaard template, waarbij je de keuze hebt uit meer dan 1.000 professioneel ontworpen designs. Deze zijn netjes onderverdeeld in categorieën zoals “restaurant”, “fotografie”, “muziek”, “gezondheid en wellness” enzovoorts. De meeste categorieën zijn op hun beurt weer onderverdeeld in subcategorieën; zo is de categorie “webshop” bijvoorbeeld onderverdeeld in “Mode en kleding”, “Juwelen”, “Thuis en decor” etc. Hierdoor vind je snel een template die goed aansluit bij jouw activiteiten. 
    Elke template bestaat uit meerdere pagina’s, zodat je met 1 klik een complete website installeert die je vervolgens kunt bewerken. Ook nu heb je een editor tot je beschikking, maar deze is wel wat minder gebruiksvriendelijk dan die van Wix ADI.

    Aan de andere kant biedt deze Wix Editor wel veel meer mogelijkheden; hiermee kun je wel alle achtergronden aanpassen, kleuren, lettertypes en uitlijning van elke tekst individueel aanpassen en elementen toevoegen op iedere gewenste plek.

    Elk element is in een flink aantal variaties beschikbaar: zo zijn er bijvoorbeeld meer dan 100 verschillende knoppen (waarvan je dingen als het lettertype en de kleur nog helemaal naar wens kunt aanpassen), enkele tientallen fotogalerij en contactformulier stijlen, 5 verschillende social media share knoppen enzovoorts.

    Daarnaast kun je allerlei functionaliteit toevoegen aan je website, zoals een webshop, reserveringsmodule of blog.

    Naast de functionaliteiten die standaard vanuit Wix zelf beschikbaar zijn kun je ook nog honderden gratis en betaalde apps installeren vanuit de Wix appmarkt.

     

    Wix prijzen

    Wix heeft een gratis versie, maar daarmee kun je niet je eigen domeinnaam gebruiken en staat er reclame van Wix op je site. Dat staat natuurlijk niet erg professioneel.
    Voor € 8,50 per maand kun je wel je eigen domeinnaam gebruiken, en vanaf € 12,50 per maand is ook de Wix reclame verdwenen.

    Als je een webshop of reserveringsmodule op je site wilt zul je wat dieper in de buidel moeten tasten; dat kost je minimaal € 17,00 per maand.

    Squarespace

    Wanneer je een account hebt aangemaakt bij SquareSpace begin je met een korte introductie zodat je weet waar je de belangrijkste functies vindt.

    Vervolgens vertelt een assistant je wat de belangrijkste vervolgstappen zijn, zoals het toevoegen van je logo en extra pagina’s, het aanpassen van het design en het lanceren van je site.

    Persoonlijk spreekt de interactieve assistent van Jimdo mij meer aan; deze opent direct het betreffende onderdeel, terwijl Squarespace alleen wat informatie erover geeft en verwijst naar een help artikel.

    Alle instellingen vind je bij Squarespace in de linker sidebar. Daar kun je bijvoorbeeld pagina’s toevoegen, typografie instellen (je kunt aparte lettertypes instellen voor titels, knoppen, tekst enzovoorts, en kiezen uit honderden lettertypes van Google Fonts), kleuren (je kunt kiezen uit een aantal voorgedefinieerde kleurenpaletten, maar ook een eigen kleurenpalet samenstellen), animaties enzovoorts. Verder kun je hier je contactgegevens toevoegen (e-mail adres, telefoonnummer, adres, openingstijden), evenals je social media profielen.

    Daarnaast kun je hier een webshop toevoegen, en vervolgens je bestellingen, klanten, producten, betaalmethodes enzovoorts hier vinden. Onder het kopje “marketing” vind je een ingebouwd nieuwsbrief systeem (maar je kunt ook MailChimp of Zapier gebruiken), een popup builder en tools om je marketing te integreren met Facebook en Instagram. Ook kun je diverse statistieken bekijken.

    Net als bij Wix is ook een Squarespace pagina opgebouwd uit meerdere secties. Squarespace biedt de keuze uit meer dan 200 verschillende sectie templates, netjes onderverdeeld in categorieën als “Headlines”, “Gallery”, “Quote”, “Contact” en “Newsletter”.

    De designs zijn erg basic vormgegeven, met weinig gebruik van kleuren of afbeeldingen. Je kunt echter zelf eenvoudig een achtergrond instellen, waarbij je kunt kiezen uit een achtergrondkleur, afbeelding of video. Je kunt per sectie een aangepast kleurenpalet gebruiken.

    Bovendien kun je bij Squarespace zelf elementen toevoegen aan een sectie template. Als je dus bijvoorbeeld een “neem contact op” knop wilt toevoegen is dat gewoon mogelijk, evenals een afbeelding, galerij, contactformulier, nieuwsbrief inschrijf veld enzovoorts.

    Ik merkte bij Squarespace wel een lichte vertraging – als je iets aanpast duurt het 1 a 2 seconden voordat deze aanpassing zichtbaar wordt op de website. Dat voelt dus niet echt vloeiend aan. Verder is de interface van Squarespace als enige niet in het Nederlands beschikbaar.

    Squarespace prijzen

    Squarespace heeft geen gratis versie, maar je kunt het wel 14 dagen gratis uitproberen. Daarna moet je 1 van de betaalde pakketten kiezen, waarvan de goedkoopste
    € 11,00 per maand kost als je per jaar betaalt (€ 132,00 per jaar dus). Als je ook een webshop wilt betaal je minimaal € 17,00 per maand.

    Jimdo

    Net als WIx is ook Jimdo beschikbaar in 2 versies: Jimdo Dolphin, een eenvoudige versie voor mensen die zonder enige kennis van programmeren en websites bouwen binnen een paar uurtjes een eigen website online willen zetten, en Jimdo Creator, een versie voor ervaren webbouwers waarbij je zelf elementen en code kunt toevoegen.

    De eenvoudige versie: Jimdo Dolphin

    Als je voor de eenvoudige versie kiest word je verwelkomd met een gebruiksvriendelijke set-up wizard die bestaat uit verschillende stappen.

    Zo word je o.a. gevraagd waarvoor je een website wilt maken (hobby, beginnend bedrijf, bestaand bedrijf), wat voor soort website je wilt maken (een bedrijfswebsite, een webshop, een portfolio website), in welke branche je actief bent, welke stijl je het meest aanspreekt (minimalistisch, donker, modern, licht) en je kunt kiezen uit enkele kleurenschema’s.

    Verder kun je ook 3 pagina’s kiezen die – naast de homepage – standaard alvast geïnstalleerd worden.  Je kunt zelf later meerdere pagina’s toevoegen, maar hoeveel pagina’s je kunt toevoegen is afhankelijk van het pakket dat je kiest. 

    Aan het einde van deze wizard kun je kiezen uit enkele standaard templates. Als je een template hebt gekozen verschijnt een assistant die je verder helpt met bijvoorbeeld het kiezen van lettertypes, het aanpassen van de layout van de blokken, het toevoegen van extra blokken, het aanpassen van het navigatiemenu en zelfs het ontwerpen van een eenvoudig logo.

    Als je klaar bent met de wizard en de assistent heb je eigenlijk al een complete website gemaakt, waarvan je alleen nog de teksten en foto’s hoeft aan te passen. Teksten aanpassen is eenvoudig en een kwestie van klikken en typen. Ook andere onderdelen kun je aanpassen door erop te (dubbel)klikken. 

    Een Jimdo website is opgebouwd uit blokken. Dit werkt hetzelfde als de secties van Wix en Squarespace. Jimdo biedt de keuze uit ongeveer 100 blokken, onderverdeeld in diverse categorieën als “tekst”, “afbeelding”, “slideshow”, “over” en “contact”. Zo’n blok bestaat uit diverse elementen; zo kan een cover blok bijvoorbeeld een koptekst, een achtergrondafbeelding en 2 knoppen bevatten, en een contactblok kan naast de titel ook een kaart en contactformulier bevatten.

    Je kunt die individuele elementen in of uitschakelen, maar het is niet mogelijk zelf elementen toe te voegen. Als ik bijvoorbeeld een kaart wil toevoegen aan mijn cover blok kan dat helaas niet, en ook als ik een “neem contact op” knop wil toevoegen onder mijn dienstenoverzicht is dat niet mogelijk; je kunt echt alleen de elementen gebruiken die in de standaard blok templates aanwezig zijn.

    Verder zijn er ook geen styling mogelijkheden per element. Je kunt dus bijvoorbeeld niet de kleur van een individuele knop of koptekst aanpassen, of de hover stijl van het menu item.
    Je kunt wel kiezen uit meerdere globale stijlen / kleurenschema’s, maar die zijn van toepassing op de gehele website. Aan de ene kant zorgt dit natuurlijk wel voor een consistent design, maar het beperkt je creativiteit wel flink. 

    De uitgebreide versie: Jimdo Creator

    Wil jij je creativiteit wat meer de vrije loop laten, en heb je “een goed oog voor design”? Dan is Jimdo Creator waarschijnlijk een betere keuze.

    Je begint met het kiezen uit 1 van de 40 standaard design pakketten. Binnen zo’n design pakket vind je een stuk of 20 pagina layouts; 4 verschillende homepage layouts, 3 diensten layouts, 6 fotogalerij layouts enzovoorts.

    Bij Jimdo Creator vind je verder geen standaard blokken, maar in plaats daarvan kun je hier zelf ieder element toevoegen dat je wilt. Daarbij heb je de keuze uit zo’n 40 elementen; naast de standaard dingen als (kop)teksten, afbeeldingen, fotogalerij, kolommen en video vind je hier ook dingen als: 

    • Een “gastenboek” waarmee bezoekers een reactie kunnen plaatsen
    • Social media deel en volg knoppen
    • Facebook en Instagram feeds
    • MailChimp inschrijfformulier
    • Agenda functie
    • En nog zo’n 60 extra elementen via powr.io (een externe script bibliotheek).

    Ook bij Jimdo Creator kun je niet de styling per individueel element aanpassen, maar je kunt wel een heel stuk meer aanpassen dan bij Dolphin. Zo kun je bijvoorbeeld 3 standaard stijlen voor knoppen maken, waarbij je zelf de kleuren, lettertypes en randen in kunt stellen. Bij een individuele knop kun je weliswaar niet een aparte kleur instellen, maar je kunt wel kiezen welke van de 3 stijlen je wilt gebruiken.

    Je kunt ook code toevoegen aan het <head> gedeelte van de site, of eigen HTML code. Ik kon helaas geen optie vinden om eigen CSS toe te voegen in de Jimdo editor.

    Jimdo prijzen

    Je kunt gratis beginnen bij Jimdo met het Play pakket, maar als je een eigen domeinnaam wilt en de Jimdo reclame wilt verwijderen heb je minimaal het Start pakket nodig (dat bij Jimdo Creator het Pro pakket heet). De prijs daarvoor bedraagt € 9,00 per maand (€ 108,00 per jaar gefactureerd), en als je ook een webshop wilt beginnen de prijzen bij € 15,00 p/ maand.

    WordPress

    Persoonlijk werk ik altijd met WordPress. Dit is veruit de meest populaire software om een website mee te bouwen; inmiddels draait meer dan 30% van alle websites wereldwijd op WordPress (!).

    Ook WordPress is er in 2 smaken: via WordPress.com hoef je zelf niets meer te installeren, en via WordPress.org kun je de software gratis downloaden om deze op je eigen hosting te installeren.

    Hoewel WordPress.com in eerste instantie aantrekkelijker klinkt raad ik je met klem aan om voor de tweede optie te gaan. WordPress is namelijk zo populair omdat er duizenden thema’s (templates) en plugins (vergelijkbaar met apps op je telefoon) beschikbaar zijn, maar bij WordPress.com kun je die pas gebruiken vanaf het business abonnement van € 25,00 per maand.

    Als je de zelf gehoste versie van WordPress gebruikt moet je een abonnement afsluiten bij een hostingbedrijf, bijvoorbeeld Hostgator of Siteground waar je voor een paar euro per maand een hostingpakket hebt. Het handmatig installeren van WordPress op je eigen hosting is best lastig, maar gelukkig installeren Hostgator en de meeste andere hostingbedrijven WordPress automatisch voor je zodat je daar geen omkijken naar hebt.

    WordPress thema’s

    Net als bij de andere website bouwers werkt ook WordPress met thema’s / templates. Je hebt de keuze uit bijna 8.000 gratis thema’s, en nog veel meer betaalde (premium) thema’s.

    De meeste premium thema’s zoals Divi (waarmee deze website en de meeste andere websites uit mijn portfolio gebouwd zijn) en Avada worden geleverd met tientallen tot honderden demo templates die je eenvoudig kunt installeren en aanpassen.

    Deze thema’s zijn ook voorzien van een geavanceerde editor met dezelfde gebruiksvriendelijkheid als die van Wix en Jimdo, maar dan zonder de beperkingen;
    bij deze editors kun je wel alles aanpassen wat je maar wilt, en daarnaast kun je ook geavanceerde animaties en andere effecten toepassen.

    De gratis thema’s maken meestal gebruik van de standaard editor van WordPress zelf, die een stuk minder mogelijkheden biedt maar daardoor wel lekker overzichtelijk en gebruiksvriendelijk is.

    WordPress plugins

    Wil je (beginnen met) een gratis thema, maar wel geavanceerde bewerkingsmogelijkheden hebben? Dat kan met plugins. Plugins zijn vergelijkbaar met apps op je telefoon;
    stukjes software die meer functionaliteiten toevoegen aan je website
    . Dat kan dus bijvoorbeeld een geavanceerde gratis editor zoals Elementor of Brizy zijn, maar ook een complete webshop, reserveringssysteem, contactformulier, Google Maps kaart, nieuwsbriefsysteem, social media integratie enzovoorts.

    Net als bij thema’s zijn er ook duizenden gratis en betaalde plugins verkrijgbaar. Hoewel er voor vrijwel alles wat je bedenkt wel een gratis plugin te vinden is krijg je bij de betaalde plugins vaak meer functionaliteiten en betere support.

    Onderhoud & updates

    Het grootste nadeel van WordPress (de zelf gehoste versie althans) is dat je zelf verantwoordelijk bent voor het onderhoud en updates van je site.
    Maar WordPress biedt ook de mogelijkheid om alles automatisch up-to-date te houden, of je kunt het onderhoud van je site uitbesteden.

    WordPress prijzen

    WordPress zelf is 100% gratis, en er zijn ook duizenden gratis thema’s en plugins beschikbaar. De enige kosten die je moet maken zijn een paar euro per maand voor een hostingpakket en een domeinnaam.

    Wix, Squarespace, Jimdo of WordPress?

    Zoals ik al schreef gebruik ik zelf altijd WordPress om mijn websites te bouwen, meestal in combinatie met het betaalde Divi thema. Starten met WordPress is wel wat ingewikkelder dan bij Wix ADI en Jimdo Dolphin, maar als je er even de tijd voor neemt biedt WordPress wel veel meer mogelijkheden en het is nog veruit de goedkoopste optie ook.

    Ik vind de WordPress editors van Divi, Elementor of Brizy wel een stuk gebruiksvriendelijker dan de geavanceerde editors van Wix en Jimdo Creator. Squarespace vind het minst gebruiksvriendelijk en zou ik dan ook niet aanraden.

    Vind je WordPress te ingewikkeld en wil je gewoon binnen een paar uurtjes een mooie site online hebben? Dan raad ik Wix ADI aan. Jimdo Dolphin is ook zeer gebruiksvriendelijk,
    maar wel heel erg beperkt terwijl Wix ADI het ook heel simpel houdt maar toch net wat meer mogelijkheden biedt.

    Hulp nodig met je website?

    Dit artikel is geschreven door Bob de webbouwer. Heb je hulp nodig met het bouwen van je WordPress, Wix of Jimdo website? Laat Bob je website bouwen of volg een training om het zelf te kunnen!

    Vraag direct een vrijblijvende offerte aan

    Dit artikel bevat affiliate links. Dat wil zeggen dat ik een vergoeding krijg als je een betaald abonnement koopt via een link op deze pagina. Dat kost jou verder niets extra’s, maar zorgt er wel voor dat ik jou kan blijven helpen met dit soort gratis artikelen. Dus als je een betaald abonnement wilt aanschaffen stel ik het zeer op prijs als je dat via deze pagina doet 😉

    Ga je voor een gratis oplossing maar wil je me toch bedanken voor mijn hulp? Dan kun je eventueel ook een kleine eenmalige donatie doen via de button hiernaast 🙂

     

  • WordPress directory website beginnen met PremiumPress

    WordPress directory website beginnen met PremiumPress

    Met een theme builder als Divi of Elementor kun je vrijwel elke website bouwen die je wilt, maar als je een directory website wilt bouwen is dat een stuk lastiger.
    In dat geval kun je beter kiezen voor een thema waar alles wat je nodig hebt al ingebouwd is, zoals de directory thema’s van PremiumPress.

    Wat is een directory website?

    Als we het over directory websites hebben kun je denken aan een advertentiesite zoals marktplaats of ebay, een vakantiehuizen website zoals booking.com, een autodealer die zijn voorraad op de website wil tonen, een lidmaatschapswebsite zoals een dating site, of gewoon een webshop. De vermeldingen op zo’n website (dus de adverenties, vakantiehuizen, profielen, producten enzovoorts) noemen we een listing.

    PremiumPress biedt schitterende thema’s voor al deze toepassingen – en meer! Bekijk hier alle PremiumPress thema’s.

    PremiumPress features

    Ik ontdekte PremiumPress in 2015, toen een klant me vroeg een datingsite voor hem te bouwen. Ik was behoorlijk onder de indruk van de geboden features, dus ik kocht een licentie en heb hun thema’s daarna nog op een paar andere sites gebruikt. Later ontdekte ik Toolset, een plugin die veel vrijheid biedt, maar ook een behoorlijk steile leercurve heeft en ook niet goedkoop is … En zelfs als je weet hoe Toolset werkt kost het nog steeds erg veel tijd om te bouwen wat je voor ogen hebt. 

    Ik had eigenlijk niet meer aan mijn PremiumPress licentie gedacht, totdat ik een e-mail kreeg dat ze een nieuwe versie (v10) hadden uitgebracht, die werkt met de populaire Elementor pagebuilder. Hoog tijd om er weer eens in te duiken dus!

    De thema’s van PremiumPress bevatten ongelooflijk veel features. Alle functionaliteit die je nodig hebt is ingebouwd, dus je hebt geen extra plugins nodig om te kunnen starten met je directory website. Je hoeft alleen 1 van de demo websites te installeren en je kunt aan de gang!

    Een aantal van die features is:

    • Custom search en filters (bijvoorbeeld op afstand, categorie, prijs, zoekterm) 
    • Custom categorieën and custom fields
    • Google Maps support (toon je listings op Google Maps and filter op afstand)
    • Front-end formulieren waarmee bezoekers zelf een listing kunnen toevoegen
    • De mogelijkheid om bezoekers te laten betalen voor het plaatsen of bekijken van die listings
    • Verschillende Payment gateways, waaronder PayPal, Stripe en zelfs het Nederlandse Mollie
    • Banner / advertentie systeem
    • Direct messaging (berichten) systeem
    • E-mail and nieuwsbrief systeem
    • Feedback / rating systeem
    • 20+ child themes / templates voor ieder thema, zodat je kunt kiezen tussen verschillende “looks”.
    • Bijna 120 custom blokken voor Elementor met geïntegreerde PremiumPress functionaliteit
    • Schitterend dashboard voor zowel gebruikers als beheerder
    • Meerdere talen

    Had ik al gezegd dat de thema’s van PremiumPress ongelooflijk veel features hebben? Laten we er eens wat dieper in duiken!

    Custom fields, search en filters

    Het eerste wat je nodig hebt als je een WordPress directory website wilt bouwen is custom fields. 

    Maar wat zijn custom fields nu precies? Dat zijn specifieke eigenschappen die bij een bepaald product of service horen. Wanneer je bijvoorbeeld een fashion webshop wilt maken heb een custom field nodig voor de prijs, 1 voor de kleuren, 1 voor de maten enzovoorts. Als je een vakantiehuizen website wilt maken heb je een custom field nodig voor het aantal slaapkamers, of er een zwembad is, of het dichtbij zee is enzovoorts. En als je een dating website maakt heb je custom fields nodig voor leeftijd, lengte, gewicht, haarkleur enz. 

    PremiumPress heeft standaard al de meest gebruikte velden voor je aangemaakt, maar je kunt ook eigen custom fields aanmaken zodat je de website echt helemaal kunt afstemmen op jouw specifieke behoeftes.

    Verder wil je natuurlijk ook dat bezoekers de resultaten kunnen filteren op die custom fields, zoals je kunt zien op de screenshot hiernaast. Met PremiumPress thema’s kun je filteren op vrijwel alles. Standaard kun je bijvoorbeeld een minimum en maximum prijs instellen, op categorieen filteren, op afstand (mbv Google Maps) of op een zoekterm, maar je kunt ook filters toevoegen voor je eigen custom fields. Je kunt de standaard filters ook uitschakelen.

    Het filtersysteem is gemaakt met Ajax technologie (niets te maken met de voetbalclub 😉 ), waardoor de resultaten direct geupdate worden zodra een bezoeker 1 van de filters aanpast. Cool!

     

     

    Verdien geld met betaalde listings, advertenties en lidmaatschappen

    De meeste directory websites zijn opgericht omdat de eigenaar ervan graag wat geld wil verdienen 🙂
    PremiumPress biedt daar in elk geval volop mogelijkheden voor!

    De makkelijkste manier om geld te verdienen met je directory website is door gebruikers te laten betalen om hun eigen listing toe te voegen. Een bekend voorbeeld daarvan is Marktplaats.nl, waarbij bezoekers bij een aantal categorieën moeten betalen om een advertentie te plaatsen.

    Omdat je eerst flink wat bezoekers en listings zal moeten hebben voordat mensen bereid zijn ervoor te betalen zul je zeker in het begin ook een gratis optie moeten aanbieden, maar je kunt al wel direct betaalde uitbreidingen gaan aanbieden.

    In je PremiumPress thema kun je diverse pakketten aanmaken, en per pakket diverse extra’s instellen. 
    Zo kun je bijvoorbeeld het aantal afbeeldingen dat gebruikers kunnen uploaden per pakket laten verschillen, instellen of de gebruiker videos kan gebruiken, een “featured” label toevoegen, of de listing wordt weergegeven op de homepage, of boven de gratis listings, en het aantal dagen dat de listing wordt getoond. Je kunt zelf terugkerende betalingen instellen.

    Naast dat je bezoekers kunt laten betalen om een listing te plaatsen kun je ze ook laten betalen om de listings op je site te bekijken met het ingebouwde lidmaatschap systeem. Zo kun je de profielfoto verbergen voor gratis gebruikers, of de uitgebreide profiel info, en het gebruik van het ingebouwde berichtensysteem (waarbij je lezen en verzenden van berichten apart kan limiteren). 

    Net zoals bij listings kun je verschillende pakketten met verschillende eigenschappen instellen, en ook hier kun je de geldigheidsduur van het abonnement zelf bepalen. Je kunt zelfs specifieke content verbergen voor leden zonder een bepaald lidmaatschap door die content in een shortcode te wrappen.

    PremiumPress heeft een ingebouwd e-commerce systeem en biedt meerdere payment gateways, waaronder Stripe, PayPal en het Nederlandse Mollie. In tegenstelling tot veel andere plugins heb je dus niet eens WooCommerce nodig om betalingen te ontvangen, maar dat kan ook een nadeel zijn aangezien PremiumPress ook niet compatible is met WooCommerce.

    Verder beschikken PremiumPress thema’s over een ingebouwd banner systeem zodat je advertentieruimte op je site kunt verkopen. Ook dat is behoorlijk uitgebreid; je kunt kiezen uit een aantal posities en formaten, een einddatum of een maximaal aantal vertoningen of kliks instellen (dat wordt dus allemaal gemeten), en naast gewone afbeeldingsbanners kun je ook je adsense of affiliate code invoeren.

    E-mails, nieuwsbrieven and direct messaging (berichten)

    Je kunt een aantal automatische e-mails laten versturen naar gebruikers, zoals een bestelbevestiging, een herinnering als hun listing of lidmaatschap vervallen is (helaas niet net van tevoren) of als de gebruiker een nieuw bericht heeft ontvangen. Je kunt ook een e-mail sturen naar al je gebruikers tegelijk, en is zelfs een ingebouwd nieuwsbrief systeem. Dat nieuwsbrief systeem is echter wel heel erg simpel; je kunt alleen platte tekst gebruiken, dus geen afbeeldingen of creatieve layouts. Ik raad je dan ook aan andere nieuwsbrief software te gebruiken, zoals MailPoet of MailChimp.

    Het direct messaging systeem heb ik al eerder kort benoemd. Ook dit is vrij eenvoudig opgezet, maar ook best gaaf. Zeker omdat je het lezen en/of verzenden van berichten kunt in of uitschakelen per lidmaatschap niveau. Stel je eens voor dat je op een dating website zit en je krijgt een mailtje dat iemand je een bericht heeft gestuurd, maar je kunt het niet lezen? 
    Of je kunt het bericht wel lezen, maar niet beantwoorden? Zou je dan niet upgraden naar een betaald abonnement waarmee je wel berichten kunt lezen of versturen?

    Bouw je pagina’s met Elementor

    Toen ik PremiumPress voor het eerst ontdekte hadden ze nog een eigen page builder. Die werkte ok, maar was wel behoorlijk beperkt. Gelukkig kozen ze er later voor om deze te vervangen dooElementor,
    de populairste gratis page builder van dit moment. 

    PremiumPress thema’s bevatten een behoorlijk aantal templates; zo is er een template voor de homepage, voor de over ons pagina, voor de lidmaatschap pagina, voor de listing toevoegen pagina, voor de contactpagina enzovoorts.

    Er is een standaard design beschikbaar voor elke template, maar je kunt dat standaard design desgewenst bewerken met Elementor of vervangen door een template die je zelf hebt gemaakt. 

    Uiteraard kun je alle standaard Elementor widgets gebruiken in die templates, maar PremiumPress heeft ook een aantal eigen widgets toegevoegd. Met een van die widgets kun je bijna 120 custom PremiumPress Elementor blokken toevoegen in je pagina.

    Uiteraard gebruiken die blokken tal van PremiumPress features, zoals de eerder genoemde custom search en filter opties, blokken waarmee je listings kunt tonen enzovoorts. Je kunt zelfs een zelfgemaakte standaard header en footer instellen, iets dat normaal alleen mogelijk is met Elementor Pro.

    Het enige nadeel van die custom blokken is dat je niet zo veel kunt customizen als je zou denken met Elementor. Je kunt bijvoorbeeld een primaire en secundaire kleur instellen in de thema instellingen, maar dat zijn dan ook de enige kleuren die kunt gebruiken voor dingen als kopteksten en knoppen (nou ja, naast zwart en wit dan). Dit helpt je om je design consistent te houden, maar slechts 2 of 4 kleuren is wel erg weinig… zeker aangezien Elementor standaard een prima globaal kleuren systeem heeft. Waarom wordt daar niet gewoon gebruik van gemaakt?

    Maar verder is de Elementor integratie in PremiumPress thema’s wel echt top. En voor alle PremiumPress thema’s zijn meer dan 20 childthemes beschikbaar zodat je kunt kiezen uit een flink aantal verschillende kant-en-klare designs.

    Prijs

    Als je slechts 1 thema wilt betaal je $ 99,00. Dat is inclusief 6 maanden support en updates. Als je toegang wilt tot alle PremiumPress thema’s betaal je $ 399,00 inclusief 12 maanden support en updates. Met beide licenties mag je de thema’s op een ongelimiteerd aantal van je eigen websites gebruiken. Als je PremiumPress thema’s wilt gebruiken op websites van klanten heb je de developer licentie nodig, die $ 599,00 kost.

    Je kunt de standaard support en updates periode steeds verlengen met 6 maanden voor $ 49,00. 

    Conclusie

    Had ik al gezegd dat PremiumPress thema’s een fors aantal features bevatten? Ik vind de prijs echter ook wat fors… dit zouden prima prijzen zijn als er levenslange updates waren inbegrepen, maar aangezien je maar 6 of 12 maanden updates krijgt zijn ze wat aan de hoge kant naar mijn mening. Maar goed, dit zijn dan ook niet van die standaard brochure / allround thema’s, en als ik een website voor je zou bouwen met al deze functionaliteit ben je duizenden euro’s kwijt.

    Dus PremiumPress is dan wel wat prijzig, maar je krijgt wel enorm veel waar voor je geld. Dus als je op zoek bent naar een snelle, betaalbare manier om een directory website te beginnen zou ik absoluut aanraden om het aanbod van PremiumPress eens te bekijken! 

    Hulp nodig met je directory website?

    Vroeger verkocht PremiumPress nog wel levenslange licenties, en ik heb die destijds nog 1 weten te bemachtigen. Als je mij inhuurt om je directory website op te zetten op basis van een PremiumPress thema krijg je die licentie er gratis bij, dus dan heb je geen jaarlijks terugkerende kosten meer.

    Op zoek naar andere functionaliteiten? Dan kan ik ook een website compleet op maat voor je maken.

    Dit artikel bevat affiliate links. Dat wil zeggen dat ik een vergoeding krijg als je een PremiumPress abonnement afsluit via een link op deze pagina. Dat kost jou verder niets extra’s, maar zorgt er wel voor dat ik jou kan blijven helpen met dit soort gratis artikelen. Dus als je zelf een PremiumPress abonnement wilt aanschaffen stel ik het zeer op prijs als je dat via deze link doet 😉

    Ga je voor een andere oplossing maar wil je me wel bedanken voor dit artikel?
    Dan kun je eventueel een kleine eenmalige donatie doen via de button hiernaast 🙂

     

  • Elementor handleiding

    Elementor handleiding

    In deze handleiding legt Bob de webbouwer uit hoe de populaire Elementor page builder werkt. In deze handleiding lees je:

    De basis van Elementor

    Als je de Elementor geïnstalleerd hebt zie je op elke pagina een grote blauwe knop “bewerk met Elementor”. Klik daarop om de Elementor page builder te activeren. 
    Je krijgt dan een scherm zoals hiernaast te zien. Daarop vind je de volgende onderdelen: 

    • ln de linker sidebar (1) vind je de widgets, waarmee je diverse soorten content kunt toevoegen. Als je bijvoorbeeld tekst wilt toevoegen sleep je de “tekstbewerker” widget naar rechts, en als je een afbeelding wilt toevoegen sleep je de “afbeelding” widget naar rechts . Als je al content op de pagina hebt staan sleep je de widget simpelweg naar de plek waar je deze wilt toevoegen.
    • Als je op het plus icoontje (2) klikt kun je kiezen uit diverse kolom structuren.
      In elke kolom kun je dan een widget slepen. Je kunt de kolommen in Elementor overigens gewoon naar de gewenste breedte slepen waardoor je eenvoudig je eigen kolomstructuur kunt maken.
    • Als je op het map icoontje (3) klikt opent de layout bibliotheek van Elementor. Hierin vind je tientallen professioneel ontworpen templates die je als basis voor je pagina kunt gebruiken, en ook de templates die je zelf hebt opgeslagen vind je hier terug. Meer daarover hier.
    • Als je op het hamburger icoontje (4) links bovenin klikt kun je een aantal standaard dingen voor de gehele website instellen. Meer daarover hier.
    • Door op het icoontje met de vier blokjes (5) te klikken kom je weer terug bij het widget overzicht.
    • In de werkbalk links onderaan (6) vind je de pagina instellingen, de navigator, de geschiedenis, de responsive modus, de voorbeeld bekijken knop en de bijwerken knop.
      Alles over deze werkbalk lees je hier.

    Widgets : de bouwstenen van Elementor

    Elementors Widgets zijn de bouwstenen waarmee je je pagina opbouwt. Zoals je hierboven hebt kunnen lezen sleep je een widget gewoon vanuit de linker sidebar naar rechts om deze op de pagina toe te voegen. Elementor heeft standaard 30 van die widgets:

    • Inner sectie : Hiermee kun je 1 kolom verdelen in meerdere kolommen. Dit kan heel handig zijn als je bijvoorbeeld 2 knoppen, iconen of afbeeldingen naast elkaar wilt plaatsen.
    • Kop : Hiermee kun je een titel of tussenkopje toevoegen en deze voorzien van een heading tag (H1 t/m H6). 
    • Afbeelding : Hiermee kun je uiteraard een afbeelding toevoegen.
    • Tekstbewerker : Dit is de meest gebruikte widget, want hiermee kun je gewone tekst toevoegen zoals je dat ook in Word zou doen.
    • Video : Ook deze widget spreekt voor zich. Je kunt hier een video toevoegen vanaf YouTube, Vimeo, DailyMotion of op je eigen server. Indien gewenst kun je deze op een later punt laten starten, automatisch laten afspelen, het geluid dempen, herhalen en kiezen of je afspeelknoppen wilt weergeven.
    • Knop : Hiermee kun je uiteraard een knop toevoegen, bijvoorbeeld een contact knop of offerte aanvraag knop. Je kunt kiezen uit verschillende stijlen (of deze helemaal naar wens vormgeven), de link instellen en indien gewenst ook een icoontje toevoegen.
    • Scheiding : Hiermee kun je een lijn toevoegen, handig om bijvoorbeeld een scheiding aan te brengen tussen 2 onderwerpen in je tekst. Je kunt onder andere de stijl, dikte en kleur van je scheidingslijn instellen.
    • Afstandshouder : Hiermee voeg je een leeg blok in om witruimte te creëren. Je kunt zelf instellen hoe hoog dit blok moet zijn. 
    • Google Maps : Hiermee voeg je natuurlijk een Google Maps kaartje in. Voer simpelweg het adres in, stel eventueel het gewenste zoomniveau in en klaar.
    • Icoon : Hiermee kun je een Font Awesome icoon toevoegen. Uiteraard kun je instellen welk icoon je wilt, maar ook de kleur, uitlijnen en afbeelding kun je instellen.
    • Afbeeldingsbox : Hiermee kun je een afbeelding toevoegen met daaronder een koptekst en een tekstveld. Daarmee kun je bijvoorbeeld een referentie toevoegen,
      of je producten en diensten. 
    • Icoonbox : Dit is hetzelfde als bovenstaande afbeeldingsbox, maar dan met een icoon in plaats van een afbeelding.
    • Aantal sterren : Hiermee kun je een sterwaardering toevoegen, zoals je dit vaak bij reviews ziet. Je kunt o.a. de kleur en het aantal sterren aanpassen (ook halve sterren).
    • Afbeeldingsgalerij : Handig als je meerdere afbeeldingen naast elkaar wilt toevoegen. Kies o.a. welke afbeeldingen je wilt tonen en hoeveel afbeeldingen er naast elkaar komen.
    • Carroussel afbeelding : Hiermee kun je een slider met afbeeldingen toevoegen. Je kunt o.a. het formaat en aantal afbeeldingen naast elkaar instellen, of je pijlen en navigatie wilt tonen en of je de carroussel automatisch wilt laten lopen (en hoe snel). 
    • Iconenlijst : Hiermee kun je een lijstje toevoegen, waarbij je per item kunt bepalen welk icoontje daarvoor gebruikt wordt. Handig voor bijvoorbeeld een vergelijkingstabel of een opsomming van features. 
    • Teller : Hiermee voeg je een teller toe die oploopt tot een vooraf ingesteld getal. Dit wordt bijvoorbeeld vaak gebruikt om aan te geven hoeveel gebruikers een product heeft.
    • Voortgangsbalk : Hiermee voeg je een voortgangsbalk in die vol loopt tot een vooraf ingesteld percentage. Handig om bijvoorbeeld de voortgang van een project aan te geven.
    • Aanbeveling : Ook wel referentie of testimonial genoemd. Hiermee kun je een foto (van de klant of het project) kiezen, de naam en functie van die klant invoeren en natuurlijk ook de tekst van de aanbeveling toevoegen. 
    • Tabs : Hiermee kun je meerdere tekstbewerker velden als tabbladen naast elkaar weergeven.
    • Accordeon : Hiermee kun je meerdere tekstbewerker velden onder elkaar weergeven, en deze laten openen en sluiten als er op de titel wordt geklikt. Dit wordt bijvoorbeeld vaak gebruikt voor veel gestelde vragen.
    • Wissel : Dit is hetzelfde als de accordeon, maar nu sluit de huidige tekst automatisch als je een andere titel aanklikt.
    • Sociale iconen : Hiermee kun je links naar je social netwerk pagina’s toevoegen, zoals Facebook, Twitter, LinkedIn, Instagram en Pinterest.
    • Melding : Hiermee voeg je een tekstblok op dat is opgemaakt als een melding. Je kunt kiezen uit diverse stijlen, zoals een waarschuwing, succes of info melding.
    • SoundCloud : Hiermee voeg een SoundCloud speler toe op je website, waarbij je diverse knoppen kunt toevoegen of weglaten. Vooral handig voor artiesten.
    • Shortcode : Veel plugins – bijvoorbeeld contactformulier plugins – maken gebruik van shortcodes. Met deze widget voeg je die eenvoudig toe.
    • HTML : Met deze widget kun je eigen HTML code toevoegen op je pagina. Ook handig voor iframes.
    • Menu anker : Je kunt in je menu verwijzen naar een bepaalde positie op de pagina door het toevoegen van een ID. Met deze widget kun je die positie markeren. Je kunt echter ook gewoon een ID toevoegen in de instellingen van de betreffende sectie of widget (daarover later meer) net zo makkelijk. 
    • Sidebar : Hiermee kun je een widget area overal op de pagina toevoegen. 
    • Lees verder : Dit is eigenlijk alleen bedoeld voor archief pagina’s zoals het berichtenoverzicht, maar om dat te gebruiken heb je eigenlijk Elementor Pro nodig. Waarom deze widget in de gratis versie zit is me dan ook een raadsel… 
    • WordPress widgets : Een heel handig onderdeel van Elementor is dat je overal op de pagina widgets van WordPress zelf – maar ook widgets die zijn toegevoegd door plugins – kunt toevoegen. Normaal kan dit alleen in de widget areas van je thema (vaak alleen in een sidebar en footer), maar met Elementor kun je deze dus op iedere gewenste plek toevoegen.

    Elementor instellingen en effecten voor widgets, kolommen en secties

    Als je met de muis op een widget klikt openen de instellingen voor de betreffende widget in de sidebar (1).  Deze instellingen zijn verdeeld in 3 tabbladen: layout, stijl en geavanceerd.

    Onder het layout tabblad vind je de basis instellingen voor de betreffende widget.
    Bij een tekstbewerker widget kun je hier je tekst invoeren, bij een afbeelding widget kies je hier de afbeelding en stel je het formaat, de uitlijning en de link hier in en bij de Google Maps widget stel je hier het adres en het zoomniveau in.

    Onder het stijl tabblad kun je dingen als tekstkleur, typografie (lettertype en grootte), de kleuren van een knop enzovoorts instellen. Ook hier zijn de opties die je hebt afhankelijk van welke widget het is.

    Vreemd genoeg kun je onder het stijl tabblad geen achtergrond instellen, daarvoor moet je in het geavanceerd tabblad zijn. Onder dit tabblad kun je ook de marge en padding instellen (witruimte), een z-index opgeven en een CSS ID en class instellen. Als je geen idee hebt waarvoor dat allemaal dient heb je het ook niet nodig 😉

    Onder bewegingseffecten kun je een animatie selecteren zodat je een widget op een mooie manier in beeld kan laten verschijnen (zoals de blokken op mijn homepage) en bij
    rand kun je vanzelfsprekend een rand toevoegen, maar ook een schaduw effect en afgeronde hoeken instellen. 

    Onder aangepaste positie kun je door de breedte op “inline” in te stellen zorgen dat widgets niet onder elkaar, maar naast elkaar moeten verschijnen, en als je bij “positie” de optie “absoluut” kiest kun je een widget naar iedere gewenste plek op de pagina verslepen. Dit werkt erg gaaf, maar levert gegarandeerd problemen op met kleinere schermen dus pas daar mee op. 

    Over kleinere schermen gesproken: onder het kopje responsive kun je de betreffende widget verbergen op desktop, tablet en/of mobiel.

    Bij een aantal onderdelen zie je ook een lichtgrijs computer icoontje staan, als je daarop klikt kun je dat onderdeel apart instellen voor desktop, tablet en mobiel.
    Ook kun je bij sommige onderdelen een apart hover effect instellen, waarmee je bijvoorbeeld een andere achtergrondkleur kunt tonen als je bezoeker er met de muis over beweegt.

    Tenslotte zie je daar het kopje aangepaste CSS, maar daarvoor heb je de pro versie nodig. Persoonlijk gebruik ik dat onderdeel overigens toch nooit, ik geef de widget dan liever een CSS class of ID en voeg de CSS toe via de customizer zodat alle CSS op 1 plek staat.

    Sectie instellingen

    Als je op de met de muis over een widget heen beweegt worden er diverse icoontjes zichtbaar. Als je op het potloodje (4) klikt worden de instellingen van de betreffende widget geopend. Als je op de 6 blokjes in het blauwe balkje bovenin (2) klikt openen de sectie instellingen in de sidebar. Hier kun je o.a. de sectie uitrekken over de gehele breedte van het scherm (mooi voor achtergronden), instellen hoe breed de inhoud in die sectie moet zijn, de hoogte van de sectie bepalen en een vormscheiding (shape divider) en animatie instellen. 

    Kolom instellingen

    Als je op het donkergrijze blokje (3) klikt worden de instellen voor de betreffende kolom geopend. Je kunt hier o.a. de breedte instellen, evenals de horizontale en verticale uitlijning, de achtergrond en een rand of schaduw effect.

    Rechter muisknop in Elementor

    Er gaat in Elementor ook een aantal handige functies schuil achter de rechter muisknop. Zo kun je een onderdeel bewerken, dupliceren en de styling (instellingen) kopiëren en plakken. 

    Werkbalk onderaan de sidebar

    Onderaan de Elementor sidebar vind je een donkergrijze werkbalk met lichtgrijze icoontjes, en een grote groene knop “bijwerken”. Het zal geen verrassing zijn dat je op die knop moet klikken om je aanpassingen op te slaan 😉 Maar wat betekenen die andere icoontjes?

     

     

      Tandwiel icoontje (1) : Instellingen voor de huidige pagina

      Als je op het tandwieltje klikt openen de pagina instellingen voor de huidige pagina. Hier kun je:

      • De pagina titel aanpassen
      • De publicatiestatus aanpassen
      • Een samenvatting schrijven (sommige thema’s gebruiken deze voor de interne zoekfunctie en de archief pagina’s zoals het berichtenoverzicht)
      • Een uitgelichte afbeelding instellen (ook deze wordt gebruikt voor de interne zoekfunctie en archief pagina’s, maar ook als het bericht gedeeld wordt op social media)
      • De paginatitel verbergen (kan handig zijn als je deze bijvoorbeeld in een header afbeelding wilt toevoegen
      • Instellen of je standaard pagina layout van het thema wilt gebruiken of niet

      Onder het tabblad “stijl” kun je ook nog een pagina achtergrond instellen, evenals een aangepaste padding (witruimte) voor de huidige pagina. 
      Onder “geavanceerd” kunnen gebruikers van Elementor Pro nog custom CSS toevoegen.

      Navigator (2) : Overzicht van de paginastructuur

      Als je op het navigator icoontje (2) klikt opent een popup venster aan de rechterzijde van het scherm, waarmee je de structuur van de pagina duidelijk krijgt. Als je op een widget klikt zie je in de navigator in welke kolom en sectie deze valt, en als je (in de navigator) op de betreffende kolom of sectie klikt openen de instellingen daarvoor in de sidebar.

      Geschiedenis (3) : Herstel een eerdere status van de pagina

      Als je op het “geschiedenis” icoontje klikt krijg je een overzicht van alle wijzigingen van deze sessie. Klik op 1 van de vorige statussen om de pagina daarnaar te herstellen. Erg handig als je bijvoorbeeld per ongeluk een stuk tekst hebt verwijderd of een andere fout hebt gemaakt die je graag wilt herstellen. Bovenaan (onder het kopje “geschiedenis” zie je ook “revisies” staan, dat zijn oudere versies van je pagina die zijn opgeslagen door WordPress. Als je niet zeker weet welke versie je moet hebben kun je er gewoon een paar proberen, je kunt immers altijd terug naar een nieuwere versie. 

      Computer icoontje (4) : Bekijk hoe je pagina eruit ziet op tablet of mobiel

      Hiermee kun je kijken hoe je site er (ongeveer) uit ziet op een tablet en telefoon.

      Oog icoontje (5) : Bekijk je pagina zonder sidebar

      Door hierop te klikken kun je de pagina bekijken zonder de Elementor sidebar. Deze opent in een nieuw tabblad.

      Pijtje naast de knop “bijwerken” (6) : De pagina opslaan als template of concept

      Naast de knop “bijwerken” zie je een klein pijltje. Als je daarop klikt kun je ervoor kiezen de huidige pagina als template op te slaan, of als concept (dus nog niet zichtbaar voor publiek.

      Elementor bibliotheek

      De bibliotheek van Elementor is te vergelijken met de mediabibliotheek van WordPress. De Elementor bibliotheek bevat tientallen professioneel ontworpen templates die je zo kunt importeren op je pagina.

      Je kunt ervoor kiezen een complete pagina template te importeren die bestaat uit meerdere secties, maar als je op het kopje “blokken” klikt kun je ook kiezen uit een aantal secties zodat je zelf je pagina naar wens kunt samenstellen.

      Onder “mijn templates” vind je de templates die je zelf hebt gemaakt en hebt opgeslagen in de bibliotheek.

      In de gratis versie kun je alleen complete secties opslaan (met de rechter muisknop klikken op de 6 vierkantjes, zie (2) in de afbeelding hierboven), of volledge pagina’s opslaan door links onderin op het pijltje naast de knop “bijwerken” te klikken en te kiezen voor “als template opslaan.

      In de pro versie kun je ook individuele widgets opslaan in de bibliotheek.

      Elementor standaard instellingen

      Als je helemaal links bovenin op het hamburger icoontje klikt opent het menu hiernaast. Hierin vind je enkele opties:

      Standaardkleuren

      Hier kun je het standaard kleurenpallet voor de gehele website instellen.

      • De primary color wordt gebruikt voor kopteksten en icoontjes
      • De secundairy color wordt gebruikt voor lijsten, subkopjes, geanimeerde headers (pro) en prijstabellen (pro)
      • De text color voor alle andere teksten
      • De accent color voor links, knoppen en headings van de tab en accordeon widgets

      Je kunt kiezen uit een aantal standaard kleurenpalletten, maar als je op een kleur klikt kun je daar ook een eigen kleur instellen zodat je kleurenpallet perfect aansluit op je huisstijl.

       

      Standaard lettertypen

      Hier kun je de lettertypes instellen voor de kopteksten, body tekst (dat is alle andere tekst) en de accent teksten (links, knoppen en heading van tab en accordeon widgets).

      Kleurenkiezer

      Overal in Elementor wordt gebruik gemaakt van een kleurenkiezer, bijvoorbeeld om een tekst- of achtergrondkleur aan te passen. Hier kun je zelf bepalen welke kleuren in de kleurenkiezer worden getoond. Klik op een kleur om deze aan te passen. Helaas worden niet automatisch de kleuren van de hierboven ingestelde standaard kleuren gebruikt, maar het is uiteraard verstandig om diezelfde kleuren als basis voor je kleurenkiezer te gebruiken.

      Globale instellingen

      Deze instellingen zijn bedoeld voor developers. Hier kun je het standaard lettertype voor de gehele website instellen, de breedte van de inhoud (ik gebruik meestal 1200), de standaard witruimte tussen widgets, tot welk HTML element een uitgerekte sectie reikt (standaard “body”, wat even breed als het scherm is) en de standaard selector van de paginatitel.

      Lightbox

      Onder de globale instellingen vind je ook een kopje “lightbox”. Een lightbox is een popup venster waarin een grotere versie van een afbeelding verschijnt als je op die afbeelding klikt, zoals bij de afbeeldingen op deze pagina. Hier kun je instellen of je de ingebouwde lightbox van Elementor wilt gebruiken en welke kleur de achtergrond en de andere elementen moeten hebben.

      Dashboard instellingen

      Je kunt ook enkele dingen instellen in de backend van WordPress. Als je op “dashboard instellingen” klikt ga je daar naartoe. Je kunt hier o.a. selecteren voor welke berichttypes Elementor gebruikt wordt, of je de standaard kleuren en lettertypes van je thema wilt gebruiken in plaats van de hierboven beschreven standaardkleuren en lettertypes.

      Als je op het tabblad “stijl” klikt vind je dezelfde instellingen als bij “globale instellingen” en de mogelijkheid de lightbox in of uit te schakelen, en je kunt hier ook de breaking points voor tablet en mobiel instellen. Dat is de breedte waarop de responsive instellingen hun werk gaan doen. De standaard instellingen zijn prima (1025px voor tablet en 768px voor mobiel). 

      Onder het tabblad “geavanceerd” vind je nog enkele instellingen voor geavanceerde gebruikers.

      Over Elementor

      Als je hierop klikt ga je naar de website van Elementor

      Vinder

      De vinder in Elementor is wel een zeer handige tool. Als je daarop klikt krijg je een zoekvenster waarin je van alles kunt typen. Bijvoorbeeld de titel van een pagina, waar je vervolgens direct naartoe kunt. Elementor is dan ook al geopend, zodat je direct kunt beginnen met bewerken. Maar ook instellingen, templates of de WordPress customizer. Je kunt de vinder ook openen door CRTL + E (of CMD + E op de Mac) te typen.

      Pagina bekijken

      Als je hierop klikt opent de huidige pagina in een nieuw tabblad, zodat je deze kunt bekijken zonder de Elementor sidebar.

      Elementor Pro

      Alles wat beschreven is in deze handleiding vind je in de gratis versie van Elementor. Wil je nog meer features? Kies dan voor Elementor Pro en krijg o.a.:

      Theme Builder

      Met de theme builder van Elementor kun je niet alleen de inhoud van je pagina bewerken, maar ook alle andere onderdelen zoals de header en de footer, je blog overzicht enzovoorts.
      Ook kun je standaard templates maken voor speciale pagina’s zoals de 404 pagina en zoekresultaten pagina, maar ook voor berichten waarbij je zelfs een andere template kunt kiezen per categorie.

      WooCommerce Builder

      Heb je een webshop? Met Elementor Pro kun je zowel de individuele productpagina’s als het productoverzicht (de winkel en categorie pagina’s) helemaal naar wens vormgeven

      Popup Builder

      Hiermee kun popups maken met verschillende triggers, waardoor deze automatisch verschijnen nadat je bezoeker bijvoorbeeld 10 seconden op de pagina is, of als hij de muis richting het kruisje beweegt om de pagina te verlaten. Zeer geliefd onder marketeers voor o.a. nieuwsbrief inschrijvingen en speciale acties.

      Nog eens 22 extra widgets

      Met Elementor Pro krijg je nog eens 22 extra widgets, waaronder een widget waarmee je blogberichten op iedere pagina kan tonen, een aantal social media widgets (oa share knoppen en een Facebook feed), een aftel timer, geanimeerde titels, prijstabellen, review sliders, flip box enzovoorts.

      En nog veel meer…

      En dat allemaal vanaf slechts $ 49,00!

      Hulp nodig met je Elementor website?

      Als het goed is heb je de basis van Elementor nu aardig onder de knie. Heb je toch nog vragen?
      Stel ze gerust in de reacties hieronder!

      Je kunt mij natuurlijk ook inhuren om een Elementor website voor je te bouwen, of om een
      Elementor training te volgen.

      Vraag direct een vrijblijvende offerte aan

      Dit artikel bevat affiliate links. Dat wil zeggen dat ik een vergoeding krijg als je Elementor Pro koopt via een link op deze pagina. Dat kost jou verder niets extra’s, maar zorgt er wel voor dat ik jou kan blijven helpen met dit soort gratis artikelen. Dus als je zelf Elementor Pro wilt aanschaffen stel ik het zeer op prijs als je dat via deze pagina doet 😉

      Houd je het bij de gratis versie van Elementor or heb je al een Pro licentie, maar wil je me toch bedanken voor dit artikel? Dan wordt een kleine eenmalige donatie via de knop hiernaast natuurlijk altijd zeer op prijs gesteld 🙂