Content builders vormen een ware revolutie binnen WordPress. Ze helpen je namelijk om – zonder te coderen – een pagina bloksgewijs in te delen met allerlei elementen. Je kunt hierbij gebruik maken van diverse soorten kolommen. Dit maakt je website een stuk interessanter en afwisselender. Binnen de kolommen kun je kant en klare elementen toevoegen. Denk hierbij aan rijen, tekstblokken, afbeeldingen, diashows, fotogallerijen, social media widgets, call-to-action-buttons, html code, videospelers, buttons, Google maps, veelgestelde vragen, berichtencarroussels, tabbladen enz. Je hoeft dus geen programmeur te zijn om een pagina flexibel en naar smaak te kunnen inrichten. In dit artikel delen we onze ervaringen met content builders.

De klassieke editor

Klassieke WordPress editorWanneer je een nieuw bericht of pagina gaat schrijven voer je in de klassieke editor de content (afbeeldingen, teksten etc.) in. Bovenin deze editor heb je 2 tabs: Wysiwyg en Tekst. Dit zijn de 2 mogelijkheden om content in te voeren. Wysiwyg betekent: What you see is what you get/wat je ziet is wat je krijgt. Bij Wysiwyg zie je al bijna hoe het er in het echt uit komt te zien. Bij tekst werk je echt in de broncode en kun je dus echte html code kwijt. Het is mogelijk om tussen deze 2 weergaven te switchen. Deze klassieke editor is behoorlijk recht toe recht aan. Tegenwoordig is het steeds gebruikelijker om in kolommen te werken. Dit kon in het verleden niet en daarom bieden veel thema’s en plugins de mogelijkheid aan shortcodes te gebruiken. Een shortcode is een stukje code tussen je content waarmee je bijvoorbeeld kolommen maakt, buttons toevoegt etc. Eigenlijk extra functionaliteiten die er standaard niet inzitten. Hierdoor wordt het bewerken van een bericht of pagina al snel een warboel omdat content en code door elkaar heen gaan lopen… en Wysiwyg gaat dan niet meer op. Dit is het punt waarop content builders om de hoek komen kijken.

Wat is een content builder?

Enfold content builderEen content builder werkt gebruiksvriendelijker dan de klassieke editor en maakt het mogelijk op eenvoudige wijze kolommen en andere elementen toe te voegen. Op de achtergrond kan je een structuur neerzetten van de elementen die je in je webpagina wilt zien. Je kunt hierbij gebruik maken van diverse soorten kolommen. Dit maakt je website een stuk interessanter en afwisselender. Binnen de kolommen kun je kant en klare elementen toevoegen. Denk hierbij aan rijen, tekstblokken, afbeeldingen, diashows, fotogallerijen, social media widgets, call-to-action-buttons, html code, videospelers, buttons, Google maps, veelgestelde vragen, berichtencarroussels, tabbladen enz.

Doordat je zelf de structuur bepaald en die blok voor blok aan de website toevoegt, ben je veel flexibeler om elementen in je website te wijzigen. Dit gaat eenvoudig door de klik en sleepmethode (Engels: Drag and Drop). Daarnaast bieden de meeste content builders de mogelijkheid de pagina als een template op te slaan. Dit kan erg handig zijn wanneer je een template met een bepaalde indeling/stramien vaker wilt gebruiken.

Een content builder voegt onderwater shortcodes toe. Zo zorgt een bepaalde shortcode voor kolommen en weer een andere voor bijvoorbeeld een mooie foto gallerij. Elke content builder heeft weer zijn eigen shortcodes. Er zijn verschillende soorten content builders:

  1. Tempate builder. Je kunt een template maken (= stramien / vlakverdeling) en deze aan een pagina toevoegen. Feitelijk werk je dus op 2 afzonderlijke plekken. Deze template builders zijn achterhaald ten opzichte van de volgende 2 manieren.
  2. Page builder. Je maakt alles op de pagina zelf (content en stramien). Vanuit de pagina kan je het stramien weer tot template maken dat je ook op andere pagina’s kan gebruiken. Dit type is momenteel de meest gebruikte content builder.
  3. Front-end builder. Via de voorkant (front-end) kan je wijzigingen aan de blokken op je pagina aanbrengen. Dit is de meest recente variant die nog in opkomst is. De front-end builers zijn relatief nieuw en we volgen de ontwikkelingen met grote interesse.

Content builder plugins

Content builders op basis van een plugin hebben onze voorkeur. Wanneer je dan van thema verandert en dezelfde content builder plugin blijft gebruiken, blijft je site er goed uitzien. Ga je van een theme met eigen shortcodes naar een ander theme met weer andere shortcodes dan zie je deze shortcodes in de tekst verschijnen. Hierdoor moet je al die pagina’s weer nalopen en opnieuw opmaken. Probeer dit te voorkomen!

Laten we met de deur in huis vallen. Wij zijn al sinds het begin een groot liefhebber van de WordPress plugin Visual Composer. De Visual Composer is een waardevolle upgrade van de Classic Editor en werkt eenvoudig door de klik en sleepmethode (Engels: Drag and Drop). Volgens de website ThemeForest al meer dan 9.800 keer verkocht en gemiddeld krijgt deze plugin het cijfer 8,9. Voordeel is dat de plugin vrij stabiel werkt en goed wordt doorontwikkeld. Er verschijnen regelmatig nieuwe updates. Uiteraard zijn ook bij deze plug-in nog een aantal verbeterpunten te vinden. Je kunt in Visual Composer de toegevoegde afbeelding zien, maar niet op ware grote en in de juiste verhouding. En als je bijvoorbeeld in de tekst een opsommingsteken toevoegt, zie je die niet terug in de editor. Wanneer je thema geen content builder heeft en je een plugin wilt gebruiken raden we de Visual Composer aan. De Visual Composer staat bij ons op 1.

Doelgroep: Iedereen

Een andere populaire betaalde plugin is de Ether Content Builder. Ether is een uitgebreide builder. Qua stabiliteit hadden we destijds nog wel eens problemen. Toch is Ether ruim 1600 keer verkocht op ThemeForest en krijgt het cijfer 8,8 gebaseerd op 223 stemmen. Qua functionaliteiten net zo compleet als Visual Composer alleen qua gebruikersgemak en interface minder. Het afgelopen jaar is er maandelijks een update geweest. Desondanks raden we aan de plugin links te laten liggen en voor de Visual Composer gaan.

Doelgroep: Iedereen

Deze plugin werd oorspronkelijk gebouwd voor een theme om flexibel landingspagina’s te kunnen bouwen. De Elegant Page Builder kan het beste gebruikt worden in combinatie met de Elegant Themes. Elegant Themes biedt haar 80+ themes aan voor $39 (Personal pakket). Voor $89 krijg je het Developer pakket met alle themes plus enkele plugins, waaronder de Elegant Page Builder. We vinden Elegant Themes erg geschikt voor mensen die nog niet zoveel ervaring hebben en meerdere themes tot hun beschikking willen hebben. Voor hen is de aankoop van het Developer pakket een goede aankoop vanuit prijs-kwaliteit oogpunt.

Doelgroep: Gebruikers van Elegant themes (vooral beginners)

Dynamik is een plugin voor het Genesis framework. De plugin biedt een bulk van mogelijkheden en helpt om binnen Genesis child-themes extra flexibiliteit te krijgen; zonder te hoeven coderen.  Vanwege de vele mogelijkheden is de interface niet erg gebruiksvriendelijk. Maar dat past dan wel weer helemaal binnen het Genesis framework dat vooral geliefd is onder techneuten. We zouden de plugin het beste kunnen typeren als een hulpmiddel voor ontwikkelaars. Een leuke feature voor ontwikkelaars is de front-end CSS editor. Wanneer je een gebruiker bent van het Genesis framework, adviseren we je zeker om deze plugin uit te gaan proberen.

Doelgroep: ontwikkelaars en gebruikers van het Genesis framework

Deze volgende gratis content builders hebben we zelf niet gebruikt, omdat we vanaf het begin direct met de Visual Composer zijn gaan werken.

Content builder binnen WordPress themes

Tegenwoordig worden steeds meer themes geleverd met een content builder. Dat is niet altijd een goede zaak. Themes moeten vooral doen waar ze voor bedoeld zijn en dat is toch vooral design. Momenteel bieden themes ook steeds meer extra functionaliteiten aan. Dat is natuurlijk handig, maar het nadeel is dat het niet alle leveranciers in staat zijn om alle functionaliteiten goed te debuggen en te updaten. Een positieve ontwikkeling is dat steeds meer themes een betaalde content builder plugin integreren. Deze WordPress themes hebben bijvoorbeeld de Visual Composer geintegreerd.

  • Enfold template builderVan alle themes met content builders steekt er wat ons betreft één met kop en schouders bovenuit. Dat is Enfold. Dat we gek op Enfold zijn noemden we al in ons blog Onze 9 favoriete WordPress themes in 2013. Van alle content builders vinden we hun content builder het meest intuïtief. Enfold werd al ruim 8.000 keer verkocht en krijgt gemiddeld het cijfer 9,5. Met hun content builder klik je gemakkelijk mooie opgemaakte pagina’s in elkaar. Het Enfold theme is eenvoudig in gebruik en erg geschikt voor de beginner en de gemiddelde WordPress gebruiker.
  • Een ander interessant WordPress theme met content builder is Jupiter. Zij hebben de open-source code van de Visual Code geforkt (‘gekopieerd’) en deze uitgebreid naar een eigen content editor. Resultaat is een extreem uitgebreide editor. Het aantal in te stellen variabelen is ongekend. Dit maakt de editor en het theme uitstekend voor ervaren gebruikers zoals wijzelf.
  • Het noemen waard is GoodLayers. Deze ontwikkelaar was één van de eerste met een fatsoenlijke content builder op paginaniveau. We hebben om deze reden in het verleden veel WordPress themes gebruikt van GoodLayers. De ontwikkeling van de content builder staat helaas praktisch stil. Voor de beste content builder hoeven we dus niet per se naar een theme van GoodLayers te zoeken.

Oprichter van Sowmedia en expert op het gebied van WordPress, internet- en e-mailmarketing (CreateSend).

  • barkgj schreef:

    Hallo Jan-Willem, leuk om jullie review te zien van de content builders die momenteel beschikbar zijn. En uiteraard helemaal top dat jullie ook onze content builder (van NexusThemes) hebben opgenomen van Nederlandse bodem. Wij zijn ervan overtuigd dat content builders een steeds belangrijkere rol zullen gaan spelen bij het maken van websites.

    Voor de geinteresseerd hierbij nog wat achtergrond informatie mbt onze contentbuilder. We ontwikkelen nu een kleine 2 jaar met ons systeem en we merken dat het begint aan te slaan. Bij mijn laatste freelance klus (al weer vele jaren geleden) zag ik de problemen die mijn niet-techneut-collega’s ervaarden bij het configureren van het CMS dat daar werd gebruikt (EpiServer). Het feit dat je in een admin scherm aan de achterkant iets aanpast, en vervolgens na een refresh van je scherm aan de voorkant hopelijk het juiste ziet aanpassen, dat is gewoon nodeloos ingewikkeld en niet intuitief.

    We hebben ook veel ondernemers gesproken die letterlijk uitspraken dat zij de WordPress back-end “eng” vinden. De back-end staat in hun ogen bomvol met opties die gaan over zaken die een niet-techneut niet veel zegt, en vaak worden er ook zoveel zaken getoond in de backend die helemaal niet relevant zijn voor de context waar een gebruiker mee bezig is. Als je een tikfout wilt aanpassen, moet je niet worden vermoeid met plugins, SEO, slugs, en ga zo maar door. Des te meer je toont, des te meer gebruikers bang zijn dat ze ook iets kapot kunnen maken. Wij hebben daarom geprobeerd om een minimalistisch ontwerp te maken bovenop WordPress, waarbij de gebruikerservaring centraal staat. En nee, we zijn er zeker zelf ook nog niet, wij krijgen continu feedback hoe het systeem nog meer “dont make me think” gemaakt kan (en moet) worden.

    We hopen in ieder geval dat we met onze content builder en themes het een stuk eenvoudiger maken voor ondernemers om zelf aan de slag te gaan. Het is tegenwoordig namelijk echt een “must” om online te zijn, en daar ook gevonden te worden. Een (mobiele en desktop in 1) website is het ideale middel is om je hiermee te helpen.

    Wellicht ook nog leuk om even te delen; naast de themes die we aanbieden, die allen gericht zijn op ondernemers, wordt onze content builder ook al ingezet voor oplossingen voor bijv. verenigingen. We hebben voor voetbalverenigignen bijv. specifieke “bouwstenen” ontwikkeld waarmee “live” data over bijvoorbeeld uitslagen, teamindelingen, poulestanden, en ga zo maar door, heel eenvoudig op de webpagina’s kunnen worden ge- en verplaatst en geconfigureerd. Mochten lezers meer willen weten over ons product, ik vertel er graag meer over (Skype: barkgj, twitter @barkgj of gewoon een mailtje via NexusThemes).

  • Erwin van Ginkel schreef:

    Bedankt voor je toelichting Gert-Jan. Veel succes met het verbeteren en verkopen van jullie product!

  • Lianne schreef:

    Ik ontwikkel momenteel een website voor een tennisvereniging, en werd dus getriggerd door de opmerkingen van Gert-Jan hierboven. De linkjes naar Nexus in de tekst leiden echter alle naar een foutpagina.
    Groet,
    Lianne

  • Gert-Jan schreef:

    Hi Lianne, Gert-Jan hier. We hebben besloten om niet langer meer samen te werken met Shareasale, waardoor de linkjes het inderdaad niet meer doen helaas. Je kan even op mijn naam klikken hier en dan brengt ie je denk ik ook wel naar de website van nexusthemes toe.

  • Lianne schreef:

    Even ook een uitdaging voor een andere klant keukenvuur (dot) nl. Deze wil ik omzetten van joomla naar wordpress. Niet zo problematisch, 1 onderdeel wel, en dat is het receptengebeuren, die in wordpress als CPT geimporteerd zou moeten worden. Het gaat om 300 recepten die met veel ijver door de klant zijn ingevoerd in Zoo van Yootheme. Zien jullie hier wat in?

  • Lianne schreef:

    Hoi Gert-Jan, jouw naam-link doet het wel. Ik stuur je via jouw site een m,ail.
    Groet,
    Lianne

  • Remco Geelen schreef:

    Hallo Gert-Jan, Jan-Willem en Sow-collega’s aldaar.

    Ik kan het niet laten om mijn complimenten over te brengen voor jullie site en artikelen. En de inhoud ervan. Voor mij als gemiddelde WordPress gebruiker deels eye-opening en deels bekend. En de liefde voor Kriesi’s Enfold, ja, jeetje… Ik begrijp die 9,5 (op dit moment zelfs 9,6 – 4,8/5,0 waardering) als geen ander. En herkende het template direct op vele plekken in deze website. Altijd leuk om te zien! En, ondertussen zijn er, in nauwelijks 1 jaar tijd, via Themeforest ruim 25.000 licenties van verkocht.

    Wow…

    En terecht. En mede dankzij die zo soepele en intuïtieve Content Builder, de Avia Layout Builder. Zonder die builder was ik nergens gekomen. Ik ben – ongeacht wat zijdelingse ervaring als gebruiker met het CMS Typo3, en later in een projectmanagementfunctie binnen een web development bureau – totaal geen techie: ik stoei pas sinds een jaar zelf met (enkel) WordPress. En wat ik blij dat ik voor Enfold heb gekozen. Voor mijn eigen website, en ook reeds voor anderen. Want dit is wat er gebeurt: “Hey ehhhh, Remco? …jij bouwt toch websites?…”. Een nieuwe deel-carrière, dankzij dit theme. Wonderlijk. En erg leuk.

    Wat ik me afvraag, en vooralsnog nooit heb kunnen vinden: weten jullie of dat Avia Framework ook van Kriesi’s team zelf is? Of is dat een ‘onafhankelijke’ betaalde en geïmplementeerde tool? Tot de dag dat er werkelijk soepel en massaal gebruik wordt gemaakt van live frontend aanpassingen zoals door Gert-Jan en NexusThemes (cool!!! de wetenschap dat dat ooit standaard zal zijn, jeetje…) wil ik eigenlijk niets anders dan Enfold. Mede door de Layout Builder. Okay, de Visual Composer zou ik dankzij jullie artikel nu ook aandurven. Maar liever niet. Hahaha…

    Ik ben net als jullie heel benieuwd hoe de toekomst er op dit vlak uit ziet! Nogmaals, complimenten aan Sowmedia: goede content, goed leesbaar, chronologisch logische stukken, en heerlijk weinig schrijf- en taalfouten. Ik hou ervan. Veel succes en plezier met jullie business!

  • Erwin van Ginkel schreef:

    Beste Remco, bedankt voor de complimenten. Wij zijn ook nog steeds enthousiast over Enfold. En we zijn trots dat we het thema 1 of 2 dagen na publicatie hebben gekocht en sinds 5 juni 2013 aanbevelen via ons blog (https://www.sowmedia.nl/blog/wordpress/favoriete-wordpress-themes-2013). Kriesi heeft met alle updates ons vertrouwen tot dusver volledig waargemaakt. Succes met je WordPress activiteiten!

  • Steve Lock schreef:

    Hoi Remco, in aanvulling op Erwin: de Avia layout builder is inderdaad het framework dat Kriesi zelf gebouwd heeft, en dat ze gebruikt voor meerdere van haar themes. Het framework is niet los verkrijgbaar.

  • Saskia Lammers schreef:

    Hallo, heb naar aanleiding van dit artikel de visual composer plugin gekocht. Maar stuit tegen een aantal problemen aan. Allereerst de installatie; ok is uiteindelijk gelukt nadat ik het juiste zip bestand gevonden had. Maar nu dat de plugin is geïnstalleerd en geactiveerd, is de editor button niet zichtbaar. Hebben jullie een suggestie?

  • Steve Lock schreef:

    Hoi Saskia, heb je de stappen uit de handleiding gevolgd? Deze vind je hier. Mogelijk moet je nog op de knop ‘Backend editor’ klikken.

  • Geert de Bock schreef:

    Beste mensen, mede naar aanleiding van jullie artikelen op het spoor gekomen van Enfold theme en heb dat ook gekocht. Helaas biedt het theme geen mogelijkheid de product- en productcategoriepagina’s vorm te geven zoals met de Avia Layout Builder wel kan op de gewone pagina’s. Nu bljjkt uit de meeste antwoorden op het forum dat Visual Composer niet goed samen gaat met Enfold.

    Is dat ook jullie ervaring? Zo ja, weten jullie wel een geschikte plugin of extensie waarmee je in woocommerce product- en productcategoriepagina’s kunt vormgeven?

    Dank en groeten.

    Geert

  • Beste Geert,

    Helaas is het via de Avia Layout Builder niet mogelijk om de product- en categoriepagina’s van WooCommerce aan te passen.

    Zelf passen we hiervoor de child theme/css aan. We hebben daar nu ook geen andere oplossing voor helaas.