Wat is een WordPress child theme?

Een WordPress child theme is een apart thema dat samenwerkt met een bestaand hoofdthema. Het gebruikt het ontwerp en de functies van dat hoofdthema, maar geeft je een veilige plek voor je eigen aanpassingen.

Hierdoor kun je bijvoorbeeld CSS, PHP-code of templatebestanden wijzigen zonder rechtstreeks in de bestanden van het hoofdthema te werken. Wanneer het hoofdthema later wordt bijgewerkt, blijven de bestanden van het child theme normaal gesproken behouden.

Wat is het verschil tussen een parent theme en child theme?

Het parent theme is het volledige hoofdthema waarop je website draait. Dit thema bevat alle bestanden die nodig zijn voor de vormgeving en werking van de website.

Het child theme is een aanvulling op dat hoofdthema. Het neemt standaard het ontwerp en de functies van het parent theme over. Alleen de onderdelen die je zelf in het child theme toevoegt of vervangt, worden anders uitgevoerd.

Wil je eerst begrijpen hoe WordPress, thema’s en plugins met elkaar samenwerken, dan helpt deze uitleg je verder: Wat is WordPress en waarom is het zo populair?

Een child theme kan niet zelfstandig werken. Het bijbehorende parent theme moet daarom altijd geïnstalleerd blijven. Je activeert alleen het child theme, terwijl WordPress de benodigde onderdelen uit het hoofdthema blijft gebruiken.

Wanneer heb je een WordPress child theme nodig?

Een child theme is vooral nodig wanneer je bestanden van een WordPress-thema wilt aanpassen. Denk aan wijzigingen in style.css, functions.php, templatebestanden of andere onderdelen van het thema.

Gebruik bij voorkeur een child theme wanneer je:

• eigen CSS in themabestanden plaatst;
• PHP-functies aan het thema toevoegt;
• bestaande templates wilt aanpassen;
• onderdelen zoals de header, footer of berichtweergave overschrijft;
• wijzigingen wilt behouden nadat het hoofdthema wordt bijgewerkt.

Een child theme houdt maatwerk gescheiden van het hoofdthema. Daardoor kun je makkelijker terugvinden welke onderdelen je zelf hebt toegevoegd en blijft het hoofdthema beschikbaar voor normale updates.

Heb je nog geen geschikt hoofdthema gekozen, dan helpt dit overzicht je om verschillende opties te vergelijken: 17 Beste gratis WordPress thema’s.

Wanneer heb je geen child theme nodig?

Je hebt niet altijd een child theme nodig. Gebruik je alleen de standaardinstellingen van het thema en pas je geen bestanden aan, dan kun je meestal zonder child theme werken.

Veel wijzigingen via Elementor, Gutenberg of de instellingen van een thema worden opgeslagen in de database. Zulke wijzigingen verdwijnen normaal gesproken niet doordat het thema wordt bijgewerkt.

Ook voor functies die onafhankelijk van het actieve thema moeten blijven werken, is een child theme niet altijd de juiste oplossing. Trackingcodes, redirects en algemene WooCommerce-aanpassingen kun je vaak beter via een geschikte plugin of snippetplugin beheren.

Een goede vraag is daarom: moet deze wijziging verdwijnen wanneer ik later een ander thema activeer? Is het antwoord nee, dan hoort de code mogelijk niet in het child theme.

Voordelen van een child theme

Het belangrijkste voordeel is dat je het hoofdthema kunt bijwerken zonder rechtstreeks aangepaste bestanden te overschrijven. Je eigen bestanden blijven gescheiden van de originele themabestanden.

Een child theme maakt het onderhoud ook overzichtelijker. Je ziet sneller welke CSS, PHP-code en templates speciaal voor jouw website zijn toegevoegd.

Daarnaast hoef je geen volledig nieuw thema te bouwen. Je gebruikt de bestaande basis van het parent theme en past alleen de onderdelen aan die werkelijk anders moeten worden.

Een child theme voorkomt niet automatisch alle problemen. Verouderde templates of code kunnen na een grote update van het parent theme alsnog gecontroleerd en aangepast moeten worden.

Een WordPress child theme handmatig maken

Je kunt een child theme handmatig maken via het bestandsbeheer van je hosting of via FTP. In dit voorbeeld gebruiken we algemene namen. Vervang deze door de naam en mapnaam van jouw eigen thema.

Maak voordat je bestanden toevoegt of wijzigt altijd een reservekopie. Zo kun je de website herstellen als een bestand verkeerd wordt geplaatst of een code een fout veroorzaakt. Meer uitleg hierover vind je in: Wat is een website backup en hoe beschermt dit je site?

Maak een map voor het child theme

Open via je hosting of FTP de map wp-content en ga daarna naar themes. Hier zie je de mappen van de geïnstalleerde WordPress-thema’s.

Maak in de map themes een nieuwe map voor het child theme. Gebruik een duidelijke naam zonder spaties, bijvoorbeeld:

mijn-thema-child

Gebruik bij voorkeur de mapnaam van het hoofdthema met daarachter -child. Hierdoor blijft duidelijk bij welk parent theme het child theme hoort.

Maak het bestand style.css

Maak in de nieuwe child-theme-map een bestand met de naam style.css. Dit bestand is noodzakelijk om WordPress het child theme te laten herkennen.

Plaats bovenaan style.css de volgende informatie:

/*
Theme Name: Mijn Child Theme
Description: Child theme van het hoofdthema
Author: Jouw naam
Template: mapnaam-van-het-parent-theme
Version: 1.0.0
Text Domain: mijn-child-theme
*/

De waarde achter Template moet exact overeenkomen met de mapnaam van het parent theme. Kijk hiervoor in wp-content/themes en kopieer de naam van de map van het hoofdthema. Eén verkeerde letter kan ervoor zorgen dat WordPress het child theme niet aan het juiste thema koppelt.

Gebruik je bijvoorbeeld een parent theme met de mapnaam hello-elementor, dan wordt de regel:

Template: hello-elementor

Onder de informatie bovenaan het bestand kun je later je eigen CSS toevoegen.

Voeg alleen indien nodig functions.php toe

Een child theme heeft niet altijd direct een functions.php-bestand nodig. Voeg dit bestand toe wanneer je PHP-functies wilt gebruiken of wanneer het child theme zijn eigen stylesheet niet automatisch laadt.

Maak in dezelfde child-theme-map een nieuw bestand met de naam functions.php.

Gebruik het volgende voorbeeld om style.css van het child theme te laden:

<?php

add_action( 'wp_enqueue_scripts', 'webmazters_child_enqueue_styles' );

function webmazters_child_enqueue_styles() {
    wp_enqueue_style(
        'webmazters-child-style',
        get_stylesheet_uri(),
        array(),
        wp_get_theme()->get( 'Version' )
    );
}

Plaats deze code vanaf de eerste regel van het lege bestand functions.php. Voeg geen afsluitende PHP-tag toe aan het einde.

Niet ieder thema laadt stylesheets op dezelfde manier. Controleer daarom eerst of je child-theme-CSS al wordt geladen en raadpleeg bij twijfel de documentatie van het gebruikte thema.

Kopieer nooit het volledige bestand functions.php uit het parent theme naar het child theme. Beide bestanden worden door WordPress geladen. Dubbele functienamen kunnen daardoor een fatale fout veroorzaken.

Wil je beter begrijpen welke code wel of niet in dit bestand hoort, lees dan: Wat is functions.php? Uitleg over dit WordPress bestand.

Voeg eventueel een screenshot toe

Je kunt een afbeelding met de naam screenshot.png aan de child-theme-map toevoegen. Deze afbeelding wordt in het WordPress-dashboard als voorbeeldafbeelding van het thema weergegeven.

Een screenshot is niet nodig voor de werking van het child theme. Het maakt het alleen makkelijker om het thema onder Weergave en Thema’s te herkennen.

Je kunt een eigen afbeelding gebruiken of de screenshot van het parent theme kopiëren. Zorg dat het bestand rechtstreeks in de hoofdmap van het child theme staat.

Activeer het child theme

Log in op het WordPress-dashboard en ga naar Weergave en daarna naar Thema’s. Als style.css correct is ingesteld, wordt het nieuwe child theme hier weergegeven.

Controleer voordat je het activeert of het parent theme nog geïnstalleerd is. Klik daarna op Activeren.

De website hoort na activering ongeveer hetzelfde te blijven uitzien als met het parent theme. Controleer direct de homepage, enkele binnenpagina’s, het menu, de footer en de mobiele weergave.

Een child theme maken met een plugin

Wil je liever niet handmatig met bestanden werken, dan kun je een plugin gebruiken die automatisch een child theme aanmaakt. Een voorbeeld hiervan is Child Theme Configurator.

Deze plugin analyseert het geïnstalleerde parent theme en maakt de benodigde child-theme-bestanden aan. De plugin kan ook helpen bij het correct laden van stylesheets.

Controleer na het aanmaken altijd of het juiste parent theme is geselecteerd en of het nieuwe child theme goed werkt. Maak ook bij deze methode vooraf een back-up.

Wat kun je aanpassen in een child theme?

Je kunt verschillende onderdelen van een thema via een child theme aanpassen. Welke bestanden beschikbaar zijn, hangt af van het gebruikte parent theme.

CSS-aanpassingen

In style.css kun je eigen vormgeving toevoegen. Denk aan kleuren, lettertypes, afstanden, knoppen en aanpassingen voor mobiel.

Zorg dat je CSS overzichtelijk blijft. Plaats gerelateerde regels bij elkaar en voeg eventueel korte opmerkingen toe, zodat je later begrijpt waarvoor de code wordt gebruikt.

PHP-functies

In functions.php kun je functies toevoegen die echt bij het actieve thema horen. Denk aan het registreren van een menugebied, het laden van stylesheets of het toevoegen van ondersteuning voor bepaalde themafuncties.

Voor algemene functies die ook na een themawissel moeten blijven bestaan, is een maatwerkplugin of snippetplugin meestal een betere plek.

Templatebestanden

Wil je een template van het parent theme aanpassen, dan kun je meestal een bestand met dezelfde naam en mapstructuur in het child theme plaatsen. WordPress gebruikt dan het bestand uit het child theme in plaats van het overeenkomstige bestand uit het parent theme.

Kopieer alleen het bestand dat je werkelijk wilt aanpassen. Het is niet nodig om alle bestanden van het parent theme naar het child theme te kopiëren.

Bij block themes kun je ook templates, template parts, patterns en theme.json aanpassen. De precieze werkwijze verschilt van klassieke WordPress-thema’s.

Hoe update je het parent theme?

Wanneer het child theme actief is, kun je het parent theme normaal via het WordPress-dashboard bijwerken. Het parent theme blijft geïnstalleerd, maar hoeft niet actief te zijn.

De bestanden van het child theme worden tijdens de update van het parent theme niet vervangen. Toch is het verstandig om vooraf een back-up te maken en de website na de update te testen.

Controleer vooral onderdelen waarvoor je templates uit het parent theme hebt gekopieerd. De ontwikkelaar kan in een nieuwe versie wijzigingen hebben aangebracht die ook in jouw aangepaste template nodig zijn.

Veelgemaakte fouten bij een child theme

Een veelvoorkomende fout is een verkeerde waarde achter Template in style.css. Deze waarde moet exact hetzelfde zijn als de mapnaam van het parent theme.

Ook wordt het parent theme soms verwijderd omdat alleen het child theme actief is. Dat werkt niet. Het child theme heeft het hoofdthema nodig om ontbrekende bestanden, stijlen en functies te laden.

Een andere fout is het volledig kopiëren van functions.php uit het hoofdthema. Hierdoor kunnen functies dubbel worden geladen en kan de website een kritieke fout tonen.

Soms wordt style.css wel aangemaakt, maar niet geladen. Controleer dan eerst de broncode en documentatie van het parent theme voordat je willekeurige enqueue-code toevoegt.

Krijg je tijdens het installeren of activeren een melding over een ontbrekend stylesheet, dan helpt deze handleiding je om de mapstructuur en style.css te controleren: Oplossing voor The theme is missing the style.css stylesheet in WordPress.

Conclusie

Een WordPress child theme is een veilige manier om een bestaand thema aan te passen zonder rechtstreeks in de bestanden van het hoofdthema te werken.

Gebruik een child theme wanneer je CSS, PHP-code of templates van het thema wilt wijzigen. Werk je alleen met de normale instellingen van WordPress, Elementor of een thema, dan is een child theme niet altijd nodig.

Maak voor je begint een back-up, controleer de juiste mapnaam van het parent theme en test de website na activering. Houd het child theme overzichtelijk en voeg alleen bestanden toe die je werkelijk nodig hebt.

Veelgestelde vragen

1. Is een child theme altijd nodig?

Nee. Een child theme is vooral nodig wanneer je bestanden van het thema wilt aanpassen. Voor normale instellingen in WordPress of een pagebuilder is het vaak niet nodig.

2. Blijven mijn wijzigingen behouden na een thema-update?

Wijzigingen in de bestanden van het child theme blijven normaal behouden wanneer je het parent theme bijwerkt. Controleer na de update wel of aangepaste templates nog goed samenwerken met de nieuwe versie.

3. Kan een child theme zonder parent theme werken?

Nee. Het parent theme moet geïnstalleerd blijven. Het child theme gebruikt de bestanden en functies van het hoofdthema.

4. Vertraagt een child theme mijn website?

Een correct opgebouwd child theme hoeft de website niet merkbaar te vertragen. Onnodige scripts, grote stylesheets of slechte code kunnen wel invloed hebben op de snelheid.

5. Kan ik achteraf een child theme maken?

Ja. Bestaande aanpassingen moeten dan wel handmatig uit het parent theme worden gehaald en naar het child theme worden verplaatst. Maak vooraf een back-up en controleer iedere wijziging apart.

6. Kan ik meerdere child themes tegelijk gebruiken?

Je kunt meerdere child themes installeren, maar WordPress kan slechts één thema tegelijk activeren. Ieder child theme kan bovendien maar aan één parent theme gekoppeld zijn.

7. Moet functions.php altijd in een child theme staan?

Nee. Voor een eenvoudig child theme is style.css het noodzakelijke bestand. Voeg functions.php alleen toe wanneer je PHP-functies nodig hebt of stylesheets op die manier moet laden.