Comment créer un thème enfant WordPress (sans rien casser)

Vous avez choisi un joli thème WordPress pour votre site, tout semble parfait… jusqu’à ce que vous réalisiez que vous ne pouvez pas modifier ce satané pied de page ou personnaliser ce bouton sans mettre les mains dans le code. Et là, c’est le drame : si vous touchez au thème directement, vous risquez de tout perdre à la prochaine mise à jour.

Mais pas de panique ! Il existe une solution simple : le thème enfant (child theme).

Créer un thème enfant vous permet d’adapter un thème existant à vos besoins sans risquer de casser quoi que ce soit. Et surtout, sans perdre vos modifications au moindre clic sur « mettre à jour ».

Dans cet article, vous allez découvrir pas à pas comment créer votre propre thème enfant, que ce soit manuellement (pour les plus bricoleux) ou avec une extension gratuite (pour les allergiques au FTP) si votre thème ne vous propose pas déjà son propre thème enfant.

Vous verrez, c’est à la portée de tous.

Installer le thème enfant lorsqu’il existe

Beaucoup de thèmes premium (sous licence payante) comportent déjà leur thème enfant prêt à l’emploi. Dans ce cas c’est très pratique, il vous suffit d’installer ce thème en parallèle du parent, puis de l’activer depuis WordPress.

Vous cliquerez donc sur « Ajouter un thème » depuis (Apparence > Thèmes), puis vous irez chercher le dossier ZIP du thème enfant : dans cet exemple brick-child.zip.
Ou si vous êtes à l’aise avec un client FTP, vous pourrez téléverser le dossier décompressé (brick-child) directement dans le répertoire /wp-content/themes/ de WordPress.

Une fois installé vous l’activerez, tout simplement.

C’est la solution la plus rapide pour personnaliser un site de la bonne manière.

Créer un thème enfant manuellement

Si votre thème n’inclut pas de thème enfant (child theme), vous pouvez facilement en créer une vous-même. Il vous suffit de créer un dossier dans le répertoire /wp-content/themes et d’y placer les fichiers suivants :

• un fichier style.css ;
• un fichier functions.php : pour modifier des fonctions du thème parent ou en ajouter.
• une image (type capture d’écran) : pour la voir apparaître dans l’administration WP (Apparence > Thèmes) ; vous pouvez reprendre la même image que le thème parent (facultatif) ;

Le fichier functions.php

Ce fichier servira à mettre en file d’attente les feuilles de style parents avec le code suivant :

function theme_enfant_enqueue_styles() {
    wp_enqueue_style('parent-style', get_template_directory_uri() . '/style.css');
    wp_enqueue_style('child-style', get_stylesheet_uri(), array('parent-style'));
}
add_action('wp_enqueue_scripts', 'theme_enfant_enqueue_styles');

Bien entendu le fichier functions.php permet d’ajouter toutes les fonctions/fonctionnalités supplémentaires à votre thème.

Le fichier style.css

En réalité, le seul fichier vraiment indispensable pour créer votre thème enfant est le fichier style.css.

Voici un exemple de contenu pour le fichier style.css :

/*
Theme Name: Nom de votre thème
Description: Une description du thème enfant si vous voulez (facultatif)
Author: Auteur du thème (facultatif)
Author URI: https://www.site-auteur.net (facultatif)
Template: nom-repertoire-theme-parent 
Version: 1.0.0 (facultatif)
*/

Pour que cela fonctionne correctement veillez à bien respecter les points suivants :

• Le nom du thème parent (dans la ligne Template:) doit correspondre exactement au nom du dossier du thème parent, en respectant les majuscules et minuscules.
• Respectez la syntaxe des en-têtes : ne mettez pas d’espace avant les deux-points (Theme Name:).

Télécharger un thème enfant prêt à l’emploi (ZIP)

Gagnez du temps avec ce kit de démarrage ; je vous propose un petit fichier ZIP (29 Ko) contenant tous les éléments nécessaires pour créer facilement votre thème enfant WordPress.

👉 Télécharger le thème enfant (54 Ko)

Ce fichier comprend :

• Un fichier style.css prérempli avec toutes les métadonnées indispensables ;
• Un fichier functions.php prêt à charger correctement les styles du thème parent ;
• Une image screenshot.png pour que le thème apparaisse dans l’interface WordPress (Apparence > Thèmes).

Après avoir installé le thème enfant en important ce fichier ZIP dans WordPress, vous modifierez le fichier style.css directement depuis le tableau de bord, en suivant ces étapes :

1. Allez dans le menu Apparence > Éditeur de fichiers de thème (ou Éditeur de thème selon votre version de WordPress) ;
2. Dans la liste de droite, Sélectionnez le thème à modifier ;
3. Cliquez sur le fichier style.css pour l’ouvrir ;
4. Repérez la ligne Template: et remplacez-la par le nom exact du dossier de votre thème parent (en respectant la casse).

Pensez à cliquer sur « Mettre à jour le fichier » pour enregistrer vos modifications.

Générer un thème enfant avec une extension WordPress

Si vous ne souhaitez pas vous embêter à créer ces fichiers, sachez qu’il existe des extensions WordPress qui peuvent faire ce travail, comme Child Theme Configurator. Ce plugin vous permettra de créer et configurer un thème enfant à partir d’un thème installé. Une fois activée, vous trouverez le tableau de bord de l’extension dans Outils > Thèmes enfants :

Analyser et créer le thème enfant

Pour créer le thème enfant, choisissez « Créer un nouveau thème enfant », sélectionnez un thème existant (ici WD Oswad Market), puis cliquez sur « Analyser ». Si le plugin peut lire les données du thème sélectionné correctement, un message vous le signalera.

Vous pouvez ensuite laisser la configuration par défaut du plugin et passer directement à la création de votre thème enfant à l’étape 9.

Vous pouvez dès à présent activer ce nouveau thème enfant depuis le menu Apparence de WordPress :

Si jamais vous souhaiter gérer un thème enfant existant avec l’extension, vous devrez créer une copie de celui-ci, en sélectionnant cette option puis en lançant l’analyse ; puis en le créant en cliquant sur le bouton bleu en fin de page « Duplicate Child Theme » :

Faites ensuite la même opération que lors d’une création d’un nouveau thème enfant, en activant ce dernier depuis l’onglet Apparence de WordPress.

Copier et modifier des fichiers pour la personnalisation

Une fois en place vous aurez certainement besoin de modifier des fichiers du thème parent en passant par ce nouveau thème enfant (c’est quand même le principe). Admettons ici que nous souhaitons modifier le pied de page (footer) du site, nous allons sélectionner le fichier php correspondant à cette partie, à savoir footer.php. ; ensuite il faut cliquer sur le bouton en fin de liste « Copier la sélection dans le thème enfant » pour copier le fichier depuis le thème parent sur l’enfant :

La structure nécessaire des dossiers est créée et respectée automatiquement au moment de la copie, que vous pourrez apercevoir si vous accédez à votre serveur via un client FTP.

Questions utiles sur les thèmes enfants

Créer un thème enfant est une étape indispensable si vous souhaitez personnaliser votre site WordPress sans risquer de tout perdre à la prochaine mise à jour. C’est une bonne habitude à adopter dès le départ, tout comme le fait de ne jamais modifier les fichiers du cœur de WordPress (comme wp-includes et wp-admin).

Une question, un doute ou besoin d’un coup de main ? N’hésitez pas à me contacter !