Ajouter un thème enfant

Lorsqu'un thème est mis à jour, tous les fichiers de ce thème sont réécrits. Si des modifications avaient été faites sur les fichiers, elles seront écrasées par les fichiers du thème officiel. Si l'on souhaite malgré tout faire des modifications de certains fichiers du thème tout en conservant les avantages des mises à jour, il faudra créer un thème enfant.

Création du dossier

Créez un dossier dans le dossier themes de WordPress et nommez le comme bon vous semble, même si je conseille, pour des raisons d'organisation, de nommer le dossier du thème enfant comme le thème d'origine suivi de "-enfant". Supposons que votre thème s'appelle twenties, nommez votre thème enfant twenties-enfant, même si ce n'est pas obligatoire.

Le dossier du thème enfant va contenir les fichiers suivants :

Création de la feuille de style

Avec un éditeur de texte, créez un fichier css nommé style.css et mettez-y le texte suivant :

/*
Theme Name: Twenties Enfant
Description: Theme enfant de Twenties
Author: Guillaume
Author URI: https://lesdocs.fr
Template: twenties
Version: 1.0
*/

On suppose ici que le thème principal s'appelle twenties, ce nom correspond au nom du dossier du thème parent. La ligne Template: twenties est indispensable car elle permet de relier votre thème enfant à son parent. A la suite de ce commentaire, vous pourrez ajouter votre CSS personnalisé qui complètera le style.css du thème parent.

Création du fichier functions.php

Le fichier functions.php va compléter son homologue du thème parent. Le code qui suit permet de charger la feuille de style principale du thème parent, avant de la compléter par celle du thème enfant.

<?php
add_action( 'wp_enqueue_scripts', 'charge_styles' );

function charge_styles() {
    wp_enqueue_style( 'parent-style', get_template_directory_uri().'/style.css' );
    wp_enqueue_style( 'child-theme', get_stylesheet_directory_uri().'/style.css' );
}

Fonctionnement

Il ne reste plus qu'à activer le thème enfant dans Apparence -> Thèmes

Si vous souhaitez modifier un fichier du thème, dupliquez-le dans le thème enfant. Par exemple, dupliquez footer.php puis modifiez-le dans le thème enfant, de manière à vous faire un pied de page personnalisé. Le fichier footer.php personnalisé remplacera le footer.php du thème parent, même si ce dernier est mis à jour. C'est la même chose pour tous les fichiers du thème parents situés dans la racine du dossier.

Arborescence

Si vous souhaitez inclure un fichier dans un sous-dossier du thème parent, il faudra le copier dans le même sous-dossier du côté du thème enfant : l'arborescence doit être dupliquée.

Passage en force

Parfois, certains fichiers ne sont pas lus par le thème enfant, vous pouvez forcer la lecture de ces fichiers :

Supposons que vous souhaitiez ajouter à votre thème enfant un fichier nommé next-prev.php situé dans un sous-dossier du thème parent nommé divers, il faudra le signaler avec la fonction require dans functions.php. Ajoutez cette ligne dans fonctions.php :

require_once( get_stylesheet_directory() . '/divers/next-prev.php' );

La fonction get_stylesheet_directory() retourne le chemin du thème enfant.

Ajouter les languages dans le thème enfant

Pour conservez vos traductions inscrites dans le dossier languages, vous devrez également les dupliquer dans le thème enfant et les signaler dans le fichier functions.php. Ajouter le code suivant :

function localisation_theme_enfant() {
load_child_theme_textdomain( 'total', get_stylesheet_directory() . '/languages' );
}
add_action( 'after_setup_theme', 'localisation_theme_enfant' );

Articles connexes