Hoe maak je zelf een Divi Child Theme in 2023

Website maken
Tim Gerrits
06/05/2021

Heb jij plannen om jouw nieuwe website of webshop met Divi te maken? Dan kan het verstandig zijn om te kiezen voor een Divi Child Theme. Door gebruik te maken van een Child thema kun je namelijk geavanceerde aanpassingen aan het thema maken zonder dat jij je zorgen hoeft te maken over fouten die zouden kunnen opduiken tijdens het updaten van het thema. Het gebruiken van een Child theme heeft een aantal voordelen waar ik je in deze blog meer over zal gaan vertellen.

In deze blog ik jou stap voor stap uitleggen hoe jij zelf een Divi Child theme kunt maken, maar er is nog meer. De volgende punten zijn namelijk ook erg handig wanneer jij zelf een Child theme wilt maken binnen Divi:

Wat is een Child Theme?
Waarom heb jij een Child Theme nodig?
Kun je Divi ook gebruiken zonder Child theme?
Wat heb je nodig om een Divi Child theme te kunnen maken?
Zo kun jij zelf een Divi Child Theme maken

Wat is een Child Theme?

Een Child theme in WordPress is een subthema dat alle functionaliteiten, de opmaak en de layout van het hoofdthema erft. Er voor kiezen om een Child theme te gebruiken is erg slim, want dit is een erg veilig manier om een WordPress thema aan te passen zonder daadwerkelijk wijzigingen aan te brengen in de bestanden van het hoofd thema.

Een ander voordeel van een Child Theme is dat je tijdens het updaten van het hoofdthema geen problemen zult ervaren in het Child theme dat jij gebruikt. Dit is erg fijn, want in het verleden kwam het nog wel eens voor dat er problemen ontstonden na het updaten van het hoofdthema, maar dat is nu gelukkig niet meer van toepassing.

Als beginnende WordPress gebruik zul je nog niet in aanraking komen met een Child theme, omdat je in de meeste gevallen geen wijzigingen in het thema zelf gaat maken. Wanneer je dit wel gaat doen is een Child thema super handig, omdat je dan veilig wijzigingen in het thema kunt aanbrengen zonder dat dit gevolgen heeft voor het hoofdthema.

Waarom heb je een Child theme nodig?

In deze blog hebben we het over Divi en daarom zal ik even uitleggen waarom je hiervoor gebruik zou willen maken van een Divi Child Theme. Zoals je waarschijnlijk wel weet is Divi een WordPress thema. Wanneer je hier wijzigingen in wilt aanbrengen moet je de code van het thema aanpassen. Omdat dit vrij technisch is en grote gevolgen kan hebben moet je hier erg voorzichtig mee zijn.

In veel gevallen kiezen webbouwers en programmeurs er daarom voor om gebruik te maken van een Child thema. Zoals je net al hebt gelezen neemt een Child theme alle functionaliteiten en de stijl opties over van het hoofdthema. In de code van het child theme kun je vervolgens wijzigingen aanbrengen zonder dat dit gevolgen zal hebben voor het hoofdthema.

Een belangrijk voordeel zit hem in het updaten van het thema. Elke keer wanneer je Divi namelijk moet bijwerken worden de bronbestanden aangepast. Dit betekent dat wanneer je wijzigingen hebt aangebracht in het thema deze worden verwijderd na het updaten van het thema. Door gebruik te maken van een Divi Child theme voorkom je dit en kun je zonder gevolgen aanpassingen maken in de code van het Child theme.

Kun je Divi ook gebruiken zonder Child Theme?

Ja, Divi van Elegant Themes is zeker te gebruiken zonder Child theme. Sterker nog voor de meeste gebruikers heb je hier ook meer dan voldoende aan. Waarschijnlijk ben je namelijk van plan om jouw website met gebruik van de Divi page builder aan te passen. Alles wat je in deze page builder aanpast valt niet onder het aanpassen van de bronbestanden. Je kunt dus gewoon gebruik maken van het standaard Divi thema als je geen wijzigingen gaat aanbrengen in de bronbestanden(bijvoorbeeld het functions.php bestand).

Wanneer heb je een Divi Child Theme nodig?

Eigen heb ik hier in zonet ook al antwoord opgegeven. Een Divi Child Theme heb je namelijk nodig wanneer wanneer je wijzigingen wilt aanbrengen in het thema van jouw website of webshop(in dit geval Divi).

Voor beginners zal dit niet nodig zijn, omdat zij in veel gevallen gebruik zullen maken van de Divi page builder. Hiermee maak je zichtbare aanpassingen op jouw website, maar dit valt niet onder de wijzingen in de code van het Child theme.

Wanneer je een webbouwer of programmeur bent kan ik het gebruik van een Divi Child theme zeker aanraden. Je zult namelijk altijd wel wat vinden dat je in het thema wilt aanpassen en dat doe je liever niet in het hoofdthema. Door een Child theme te gebruiken kun je deze wijzigingen snel en zonder problemen doorvoeren.

Wat heb je nodig om een Divi Child Theme te kunnen maken

Heb jij inmiddels besloten dat jij gebruik wilt gaan maken van een Divi Child Theme? Dan zijn er een aantal dingen die je nodig hebt om zelf een Child Theme te kunnen aanmaken. Voor sommigen klinkt dit misschien een beetje technisch, maar later in deze blog ga ik jou stap voor stap uitleggen hoe jij zelf een Divi child theme kunt maken. Laten we daarom eerst maar even de benodigdheden bespreken om zelf een Divi child theme te kunnen maken:

Divi geïnstalleerd & geactiveerd: Om een Divi child thema te kunnen maken heb je uiteraard het Divi thema nodig. Wanneer je deze nog niet hebt zul je deze eerst moeten kopen. Vergeet het thema vervolgens niet in WordPress te installeren en activeren, want ook dit is nodig om een Child theme te kunnen maken. Ontvang 20% korting op Divi.
Text editor: Omdat er wijzigingen moeten worden gemaakt in de themabestanden heb je een teksteditor nodig. Je kunt hiervoor gebruik maken van de standaard teksteditor op jouw laptop, maar omdat je waarschijnlijk vaker aanpassingen wilt gaan maken is een krachtigere teksteditor een aanrader. In dit geval is PHPStorm of Visual Studio Code een erg goede teksteditor.
FTP Client: Toegang tot de FTP client is niet noodzakelijk wanneer je van plan bent om het Child thema als zip-bestand naar WordPress te uploaden. Ben je van plan de themabestanden voor een live website te openen of te bewerken? Dan heb je hiervoor een FTP client nodig. In dit geval kun je gebruik maken van FileZilla. Dit is namelijk een erg populaire FTP Client.

Zo kun jij zelf een Divi Child Theme maken

Nu jij alles weet over het Divi Child theme kun je zelf een Divi Child theme gaan maken. Hieronder ga ik jou stap voor stap uitleggen hoe jij dit kunt doen. Wanneer je al deze stappen volgt zul jij snel en eenvoudig een eigen Divi Child theme kunnen maken en deze vervolgens in WordPress kunnen uploaden. Laten we daarom maar direct beginnen met stap 1.

Maak een map voor het Child Theme

Wanneer je een Child theme wilt maken kun je de themabestanden op twee manieren aan WordPress toevoegen. Je kunt er voor kiezen om de child themamap rechtstreeks aan de themabestanden toe te voegen, maar je kunt er ook voor kiezen om een map buiten WordPress te maken en die te comprimeren om het thema later als nieuw thema in WordPress te uploaden.

Om een nieuwe map voor jouw child-thema rechtstreeks in WordPress te maken, moet jij de themabestanden openen in de map WordPress Themes (wp-content/themes/). Maak vervolgens een nieuwe map in de themamap en geef deze de naam “divi-child”. Dus de nieuwe child-themamap zal wp-content/themes/divi-child heten.

Kies je voor de tweede optie? Dan is deze stap wat makkelijker. Je kunt in dit geval namelijk gewoon een map op jouw computer aanmaken. Deze map moet je vervolgens “divi-child’ noemen.

Maak een Style.css bestand aan

Zodra je de div-child map hebt aangemaakt moet in deze map het Style.css bestand worden aangemaakt. Het is belangrijk dat je dit bestand precies deze naam geeft, want anders zal WordPress het bestand niet herkennen. Het is belangrijk dat je in dit bestand vervolgens de volgende code plaatst:

/*
Theme Name: Divi Child
Theme URI: https://www.eleganttheme s.com/gallery/divi/
Description: Divi Child Theme
Author: Elegant Themes
Author URI: https://www.elegantthemes.com
Template: Divi
Version: 1.0.0
*/

/* =Theme customization starts here

Het is belangrijk dat je ervoor zorgt dat de bij de parameter “Template” de directorynaam van het hoofdthema komt te staan. Hier moet in dit geval dus “Divi” komen te staan. Je bent vervolgens helemaal vrij om zelf een Thema naam, URL, beschrijving en auteur in te voeren. Je zou hier dus bijvoorbeeld de naam van jouw bedrijf voor kunnen gebruiken. Dit is namelijk ook de naam die in WordPress zichtbaar is.

Maak een Functions.php bestand

Nu je inmiddels het Style.css bestand hebt aangemaakt voor het Divi child theme is er nog een belangrijke stap die je niet mag overslaan. Je moet er namelijk voor zorgen dat de styling die standaard aanwezig is in het Divi thema wel wordt meegenomen. Dit kun je doen door een Functions.php bestand aan te maken.

Om dit te doen moet je wederom weer de teksteditor induiken waar je ook het Style.css bestand in hebt gemaakt. Denk er wel aan dat dit document in dezelfde map wordt geplaatst als het Style.css bestand. In het Functions.php bestand moet de volgende code worden geplaatst.

<?php
function my_theme_enqueue_styles() {
wp_enqueue_style( ‘parent-style’, get_template_directory_uri() . ‘/style.css’ );
}
add_action( ‘wp_enqueue_scripts’, ‘my_theme_enqueue_styles’ );

Maak een Thumbnail voor het Child Theme(Optioneel)

Wanneer je in WordPress een thema wilt uploaden zul je altijd een afbeelding zien. Aan deze afbeelding kun je het thema herkennen en het geeft een net wat mooiere uitstraling. Je kunt er daarom voor kiezen om zelf ook een thumbnail te maken voor jouw eigen Divi child theme. Het is wel handig om te weten dat dit niet verplicht is, dus als je niet niet nodig vindt kun je deze stap overslaan.

Je kunt zelf eenvoudig een thumbnail maken maken met bijvoorbeeld Canva. WordPress raadt zelf aan om te kiezen voor een formaat van 1200px bij 900px, want dit is de meest ideale afmeting voor een thumbnail. Ook is het belangrijk dat je het bestand screenshot.png noemt, want anders herkent WordPress het bestand niet.

Inmiddels zul je 3 bestanden in jouw divi-child theme mapje hebben staan.

Functions.php
Style.css
Screenshot.png

Upload en activeer het Child thema in WordPress

Wanneer jij alle drie de bestanden in deze map hebt staan en ze ook de juiste namen hebt gegeven kunnen we het thema uploaden in WordPress. Het is hiervoor belangrijk dat het Divi thema al is geupload in jouw WordPress account.

Heb jij ervoor gekozen om de bestanden rechtstreek in WordPress te uploaden? Dan hoef je deze bestanden niet meer te uploaden. Deze zijn namelijk al aanwezig. Het enige wat jij nu nog hoeft te doen is in het WordPress dashboard naar Weergave > thema’s te navigeren. Hier hoef je vervolgens alleen nog op het Divi child theme te klikken en deze te activeren.

Heb jij de stappen in deze blog gevolgd en al deze bestanden aangemaakt? Dan moet je deze map eerst comprimeren(Zippen). Wanneer dit mapje namelijk is gezipt kan hij geupload worden naar WordPress. Zodra het zip mapje is geupload in WordPress kun je hem net als een normaal thema activeren.

Conclusie

Naast de methodes die ik in deze blog heb besproken om zelf een Divi child theme te maken zullen er uiteraard nog meer methodes zijn. Wanneer je gebruik maakt van het Divi theme raad ik je aan om deze methode te gebruiken, maar als je een ander thema gebruikt kan het maken van een Child theme anders werken.

Het is goed om te weten dat je niet precies hoeft te weten wat je zonet allemaal hebt gedaan. De programmeurs zullen weten wat alle code betekent, maar jij hoeft deze code niet te begrijpen omdat het nu volledig werkt en jij jouw eigen Divi website of webshop kunt gaan bouwen!

Divi child theme - Eigen website maken

Heb je een Child Theme nodig voor Divi?

Heb je een Child Theme nodig voor Divi? Nee, je hebt geen Divi child theme nodig, maar het kan wel erg handig zijn wanneer jij custom aanpassingen aan jouw website of webshop wilt doen.