Child-theme (WordPress)

Uit De Vliegende Brigade
Ga naar: navigatie, zoeken

Child themes of child-themes zijn handig op het moment dat je een theme via code gaat aanpassen: Prop de wijzigingen in een child-theme, en op het moment dat het 'parent-theme' wordt bijgewerkt, worden de wijzigingen in het child-theme namelijk niet overschreven.

Het enige vereiste voor een child-theme, is de aanwezigheid van een style.css-bestand, ter identificaie van het parent-theme.

Child-theme aanmaken

  • Maak een willekeurige map aan onder wp-content/themes
  • Maak daar een bestand style.css aan en verwijs daarin naar het parent-theme.

Dit is een voorbeeld van zo'n style.css-bestand uit de lente van 2018:

 /*
  Theme Name:   Hoshi Child
  Theme URI:    http://devliegendebrigade.nl
  Description:  Hoshi child theme with altered functions.php (and maybe other stuff as well)
  Author:       Jeroen Strompf
  Author URI:   http://devliegendebrigade.nl
  Template:     hoshi
  Version:      1.0.0
  License:      GNU General Public License
  License URI:  licence/GPL.txt
  Text Domain:  hoshi-child
 12 */

De crux zit in de regel Template: hoshi - Deze geeft aan wat het bijbehorende parent-theme is. Zonder deze regel zou verschijnt dit child-theme ook niet in het overzicht onder Appearance, omdat-ie dan alle bestanden nodig zou hebben om een volwaardig theme te zijn.

Voorbeeld: Aanpassing functions.php

Dit betreft een child-theme met maar één aanpassing, namelijk in functions.php.

  • Style.css: Zie voorbeeld hierboven.
  • Functions.php: Deze bevat alleen de wijzigingen tov. het parent-theme:
<?php

/*

        Changes the redirect URL for the Return To Shop button in the cart
        ==================================================================

        * https://trello.com/c/OVar6wTE/154-terug-naar-winkel-link-doorsturen-naar-home-page
        * https://nicola.blog/2015/07/20/change-the-return-to-shop-button-url-in-the-cart-page/
        * Jeroen Strompf - April 2018 

        @return string
 
 */


function wc_empty_cart_redirect_url() 
{
        return 'http://beamerverhuur.amsterdam';
}
add_filter( 'woocommerce_return_to_shop_redirect', 'wc_empty_cart_redirect_url' );

Bronnen