Inleiding
De Divi Builder van Elegant Themes is een krachtige en flexibele page builder voor WordPress die je in staat stelt om prachtige, op maat gemaakte websites te creëren zonder enige codeerkennis. Of je nu een beginner bent of een ervaren webdesigner, de Divi Builder biedt talloze mogelijkheden om je creativiteit de vrije loop te laten. In dit artikel leggen we stap voor stap uit hoe je aan de slag kunt gaan met de Divi Builder.
Wat is de Divi Builder?
De Divi Builder is een visuele drag-and-drop page builder die deel uitmaakt van het Divi Theme, maar ook als een afzonderlijke plugin kan worden gebruikt. Het biedt een intuïtieve interface waarmee je gemakkelijk lay-outs kunt maken en aanpassen door middel van secties, rijen en modules.
Voordelen van de Divi Builder
- Gebruiksvriendelijk: Geen codering vereist, dankzij de intuïtieve drag-and-drop interface.
- Flexibel: Geschikt voor allerlei soorten websites, van blogs tot bedrijfswebsites en webshops.
- Geavanceerde Ontwerpopties: Biedt uitgebreide mogelijkheden voor maatwerk en design.
Divi Builder Installeren en Activeren
Divi Theme Installeren
- Download het Divi Theme: Ga naar de Elegant Themes website en download het Divi Theme.
- Upload en Installeer: Ga naar het WordPress-dashboard, navigeer naar ‘Thema’s’ en klik op ‘Nieuwe toevoegen’. Upload het gedownloade zip-bestand en klik op ‘Installeren’.
- Activeren: Nadat het thema is geïnstalleerd, klik je op ‘Activeren’ om het Divi Theme in te schakelen.
Divi Plugin Installeren
- Download de Divi Builder Plugin: Als je een ander thema gebruikt maar toch de Divi Builder wilt gebruiken, download dan de Divi Builder plugin van de Elegant Themes website.
- Upload en Installeer: Ga naar het WordPress-dashboard, navigeer naar ‘Plugins’ en klik op ‘Nieuwe plugin’. Upload het gedownloade zip-bestand en klik op ‘Installeren’.
- Activeren: Nadat de plugin is geïnstalleerd, klik je op ‘Activeren’ om de Divi Builder plugin in te schakelen.
De Interface van de Divi Builder
Backend Builder vs. Visual Builder
De Divi Builder biedt twee verschillende interfaces: de Backend Builder en de Visual Builder.
- Backend Builder: Te benaderen via het WordPress-dashboard en biedt een overzichtelijke manier om je pagina’s te bouwen en beheren.
- Visual Builder: Hiermee kun je je pagina’s in realtime bewerken en direct zien hoe ze eruitzien terwijl je werkt.
Basiscomponenten van de Interface
- Secties: De grootste bouwstenen die je gebruikt om je pagina in te delen.
- Rijen: Gelegen binnen secties en bevatten kolommen.
- Modules: De inhoudselementen die in de kolommen geplaatst worden, zoals tekst, afbeeldingen en knoppen.
Pagina’s Maken met de Divi Builder
Een Nieuwe Pagina Maken
- Nieuwe Pagina Aanmaken: Ga naar het WordPress-dashboard, navigeer naar ‘Pagina’s’ en klik op ‘Nieuwe pagina’.
- Divi Builder Activeren: Klik op ‘Gebruik Divi Builder’ om de Divi Builder te activeren voor de nieuwe pagina.
Secties, Rijen en Modules
- Secties: Voeg een nieuwe sectie toe door op het blauwe ‘+’-pictogram te klikken.
- Rijen: Voeg een rij toe binnen een sectie door op het groene ‘+’-pictogram te klikken.
- Modules: Voeg modules toe binnen kolommen door op het zwarte ‘+’-pictogram te klikken.
Gebruik van Secties in de Divi Builder
Standaard, Specialty en Fullwidth Secties
- Standaard Secties: Geschikt voor gewone inhoudslay-outs.
- Specialty Secties: Bieden geavanceerdere lay-outmogelijkheden met verschillende kolomstructuren.
- Fullwidth Secties: Voor inhoud die de volledige breedte van de pagina moet beslaan, zoals sliders en kaarten.
Sectie-instellingen Configureren
- Sectie Opties: Klik op het tandwielpictogram om de instellingen van de sectie te openen.
- Aanpassen: Pas de achtergrond, binnen- en buitenmarges, en andere ontwerpopties aan.
Rijen en Kolommen Gebruiken
Rijen Toevoegen en Configureren
- Nieuwe Rij: Klik op het groene ‘+’-pictogram om een nieuwe rij toe te voegen.
- Kolomindeling Kiezen: Kies een kolomindeling die past bij je inhoud.
Kolommen Instellen
- Kolommen Aanpassen: Klik op het tandwielpictogram om de instellingen van de kolom te openen.
- Kolombreedte: Pas de breedte en de marges van de kolom aan.
Modules in de Divi Builder
Populaire Modules
- Tekstmodule: Voeg tekstinhoud toe en pas deze aan met de ingebouwde editor.
- Afbeeldingsmodule: Voeg afbeeldingen toe en configureer ze met verschillende opties.
- Knoppenmodule: Voeg knoppen toe met verschillende stijlen en acties.
Modules Toevoegen en Aanpassen
- Module Toevoegen: Klik op het zwarte ‘+’-pictogram in een kolom om een nieuwe module toe te voegen.
- Instellingen Configureren: Klik op het tandwielpictogram om de module-instellingen te openen en de inhoud en stijl aan te passen.
Aanpassingsopties en Design
Kleuren, Lettertypen en Achtergronden
- Kleuren: Pas de kleuren van je secties, rijen en modules aan via de ontwerpopties.
- Lettertypen: Kies uit verschillende lettertypen en pas de grootte, stijl en kleur aan.
- Achtergronden: Voeg achtergronden toe aan secties, rijen en modules, inclusief kleuren, afbeeldingen en video’s.
Geavanceerde Ontwerpopties
- CSS Aanpassingen: Voeg aangepaste CSS toe voor specifieke secties, rijen en modules.
- Geanimeerde Elementen: Voeg animaties toe aan je modules voor een dynamisch effect.
Opslaan en Publiceren
Opslaan van Pagina’s
- Opslaan: Klik op de knop ‘Opslaan’ in de Visual Builder om je wijzigingen op te slaan.
- Concepten: Sla pagina’s op als concepten om later verder te bewerken.
Pagina’s Publiceren
- Publiceren: Klik op de knop ‘Publiceren’ om je pagina live te zetten.
- Voorbeeld Weergeven: Bekijk een voorbeeld van je pagina voordat je deze publiceert.
Conclusie
De Divi Builder is een krachtige tool voor het maken van prachtige, aangepaste WordPress-websites zonder dat je enige codeerervaring nodig hebt. Door de stappen in deze gids te volgen, kun je snel aan de slag met het bouwen en aanpassen van je eigen website met de Divi Builder.
FAQs
Is de Divi Builder moeilijk te leren voor beginners? Nee, de Divi Builder is gebruiksvriendelijk en biedt een intuïtieve drag-and-drop interface, waardoor het gemakkelijk is voor beginners om te leren.
Kan ik de Divi Builder gebruiken met elk WordPress-thema? Ja, je kunt de Divi Builder plugin gebruiken met elk WordPress-thema, hoewel het het beste werkt met het Divi Theme zelf.
Zijn er kosten verbonden aan het gebruik van de Divi Builder? Ja, de Divi Builder is een premium product van Elegant Themes, dus er zijn kosten verbonden aan het gebruik ervan.
Kan ik mijn eigen aangepaste CSS toevoegen in de Divi Builder? Ja, je kunt aangepaste CSS toevoegen aan specifieke secties, rijen en modules voor extra maatwerk.
Hoe kan ik mijn pagina’s opslaan en later verder bewerken? Je kunt je pagina’s opslaan als concepten en later verder bewerken door naar ‘Pagina’s’ in het WordPress-dashboard te gaan en de gewenste pagina te selecteren.
