Divi child theme

5 november 2020

Werkt u in WordPress met het thema Divi van Elegant Themes, dan kunt u overwegen om gebruik te maken van een Child theme. In deze cursus beschrijf ik:

  1. Wat is een WordPress Child theme?
  2. Waaruit bestaat een WordPress Child theme dan?
  3. Waarom dan gebruik maken van een WordPress Child theme?
  4. Wanneer is het verstandig om gebruik te maken van een Child theme?
  5. Hoe installeert u het WordPress Divi Child theme?

U kunt tevens gratis een Child theme van Divi downloaden!

Wat is een WordPress Child theme?

Child theme

Een WordPress Child theme is eigenlijk geen thema. Als je gebruik maakt van een Child theme, dan gebruik je nog steeds alle functionaliteiten en bestanden van het bovenliggende thema. We noemen dit bovenliggende thema ook wel het parent theme. In dit geval is het parent theme dus het reeds geïnstalleerde thema Divi van Elegant Themes.

Waaruit bestaat een  WordPress Child theme dan?

De samenstelling van een WordPress Child theme

Een WordPress Child theme is altijd een zipbestand en bestaat uit drie bestanden, namelijk: 

  1. function.php
  2. style.css
  3. Screenshot.png
samenstelling wordpress child theme

Als u een Child theme installeert, dan blijft u gebruik maken van het parent theme Divi. U moet dit thema dan ook niet verwijderen van uw WordPress.

 

  • In het function.php bestand van uw Child theme hebben we aangegeven dat we gebruik blijven maken van het style.css bestand van het parent theme Divi. In het function.php bestand geven we aan wat de locatie van het style.css bestand van het parent theme Divi is. Hierdoor wordt het style.css bestand van het parent theme dus geïmporeerd.
  • In het style.css bestand van ons Child theme gaan we vanaf nu onze wijzigingen in css-code invoeren.
  • Met het bestand screenshot.png voorzien we het Child theme in WordPress van een afbeelding. Zodra u het Child theme heeft geinstalleerd, ziet u deze afbeelding bij het thema’s.

Waarom dan gebruik maken van een WordPress Child theme?

Wanneer een WordPress Child theme gebruiken?

Met behulp van een WordPress Child theme kun je gemakkelijk bepaalde zaken met betrekking tot de opmaak van de website (css-code) aanpassen. Dit kun je natuurlijk ook in het thema Divi zelf doen, echter zijn er dan enkele nadelen:

 

  • Als u een nieuwe update van Divi installeert, dan worden de oude bestanden overschreven door de nieuwe bestanden. Op dat ogenblik verdwijnen dus ook alle aanpassingen die u heeft gedaan.
  • Als u werkt met een eigen style.css bestand, dan blijft het voor u overzichtelijker. In dit style.css bestand staan namelijk alleen de css-codes die u heeft ingevoerd. Alle css-codes die horen bij het parent theme Divi staan in het style.css bestand van Divi zelf.

Wanneer is het dan verstandig om gebruik te maken van een Child theme?

U hoeft bij WordPress niet standaard gebruik te maken van een Child theme. Als u via het admin menu naar de optie “Weergave” gaat en vervolgens “Customizer” kiest, kunt u bij het onderdeel “Extra CSS” ook uw eigen css-codes invoeren. Alles wat u hier invoert, blijft bij updates van Divi ook bestaan. Wanneer is het dan wel verstandig om gebruik te maken van een eigen Child theme?

 

  • Als u de laadsneldheid van uw website wilt maximaliseren. U kunt in het Child theme bijvoorbeeld aangeven dat bepaalde onderdelen eerder geladen moeten worden. Bijvoorbeeld een preload van fonts. Dit kan de snelheid van uw website aanzienlijk versnellen. Ook zorgt dit ervoor dat uw website een betere beoordeling krijgt in PageSpeed Insights en GTMetrix.
  • Als u van plan bent om behoorlijk wat regels met code toe te voegen (css, JavaScripts, etc).

Hoe installeert u het WordPress Divi Child theme?

Uitleg hoe u het Divi Child theme installeert

Als eerste moet u er voor zorgen dat u het thema Divi heeft geïnstalleerd en geactiveerd. Vergeet ook niet om uw gebruikersnaam en API key in te voeren, want anders krijgt u geen updates voor het parent theme Divi. Weet u niet waar u dit moet invoeren, bekijk dan nog even mijn uitleg over het updaten van Divi.

Vervolgens download u gratis het Divi Child theme. Dit is een zipbestand, wat u niet moet uitpakken!

Daarna gaat u in het WordPress admin menu naar de optie “Weergave” en selecteert u “Thema’s'”.  U klikt op de knop “Nieuwe toevoegen”. Vervolgens klikt u op de knop “Thema uploaden” en “Bestand kiezen”. U selecteert het zipbestand “Divi-Child-Theme” en klikt op “Nu installeren”. Het Divi Child theme is nu geïnstalleerd.

Reacties zijn welkom

1 Reactie

  1. Tjitte de Wolf

    Super bedankt voor je uitleg en het gratis Divi Child theme.

    Antwoord

Een reactie versturen

Het e-mailadres wordt niet gepubliceerd. Vereiste velden zijn gemarkeerd met *

Gerelateerde berichten

Handige Divi css codes

De layout van uw WordPress website of webshop kunt u aanpassen met enkele handige css codes. Combineer Divi met bijvoorbeeld de volgende css codes.

Lees meer

Divi header & footer layouts

WordPress is het meest gebruikte Content Management Systeem (CMS) voor het maken van een website of webshop. In combinatie met een pagebuilder ontwerpt u vervolgens super gemakkelijk de mooiste berichten en pagina's. Het WordPress thema Divi van Elegant Themes is...

Lees meer

Blader door berichten

Pin It on Pinterest

Share This

Deel mijn website met uw familie, vrienden en collega's.

Uw familie, vrienden of collega's vinden het fijn als u hun informeert over handige tips, gratis materiaal en leuke informatie.