Création d’un thème enfant

Un thème enfant est l’émanation  d’un thème existant (dit thème parent) qui, sans être toutefois une copie conforme, reprends la majorité de son code. C’est la méthode recommandée par wordpress pour modifier un thème qui ne conviendrait qu’en partie à votre projet.

Outre que c’est une excellente façon de commencer à apprendre à créer un thème, la création d’un thème enfant est nécessaire dès que vous souhaitez modifier une partie du code d’un thème  que ce soit pour ajouter des fonctions ou en retirer, ajouter des marqueurs conditionnels ou du code php directement dans la page. Sans cela, si vous modifiez directement le code de votre thème, tous les changements que vous pouvez avoir fait disparaitront lors de la mise à jour du thème.

Comment fonctionne un thème enfant ?

Quand wordpress affiche la page d’un site, il sait de quels fichiers il a besoin. Il va d’abord  les chercher dans le dossier du thème enfant mais si il ne les trouve pas, alors il va ensuite les chercher dans le dossier du thème parent. Chaque fichier modifié que vous avez mis dans le thème enfant sera ainsi prioritaire sur le fichier équivalent du thème parent et surtout il sera à l’abri de toute mise à jour du thème parent.

Comment créer le thème enfant

La création d’un thème enfant est très simple puisque qu’il suffit au minimum d’un répertoire et des fichiers style.css et functions.php. Je vous conseille d’utiliser un éditeur de code comme notepad++ ou brackets pour créer ces fichiers afin d’éviter toute erreur de codage.

La première étape consiste à créer un répertoire au nom de votre thème enfant dans le dossier wp-content=>thèmes. Ouvrez ensuite l’éditeur de code, collez ces lignes dedans et enregistrez la page sous le nom style.css

/*
 Theme Name:   Twenty Fifteen Child
 Theme URI:    http://example.com/twenty-fifteen-child/
 Description:  Twenty Fifteen Child Theme
 Author:       John Doe
 Author URI:   http://example.com
 Template:     twentyfifteen
 Version:      1.0.0
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Tags:         light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
 Text Domain:  twenty-fifteen-child
*/

Parmi ce code, seules les lignes « thème name »  qui correspond au nom du thème enfant et « template »   qui mentionne le nom du thème parent (dans l’exemple twentyfifteen) doivent être modifiées avec vos informations, les autres lignes n’étant utiles que si vous partagez votre thème, vous pouvez les modifier ou les laisser telles quelles.

Ouvrez une nouvelle page dans l’éditeur pour y coller les lignes suivantes et enregistrez la page sous le nom de functions.php

<?php
add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );
function theme_enqueue_styles() {
    wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );

}
?>

Cette fonction servant à mettre en file d’attente les différents fichiers du thème parent pour qu’ils s’exécutent après que wordpress ait vérifié la présence ou l’absence des fichiers du thème enfant.

Lire aussi :  Un anti adblock pour votre site

Voila, vous avez créer votre premier thème enfant, vous pouvez maintenant l’activer dans l’administration de votre site et vous apercevoir que rien n’a réellement changé par rapport au thème parent ce qui est logique, le thème enfant n’ayant aucun fichier modifié pour le moment, wp reprends simplement tous les fichiers du thème parent.

Comment modifier un fichier existant ?

Copiez  le fichier à modifier du thème parent (par exemple page.php) et collez-le dans le thème enfant à coté du fichier style.css et de functions.php.  Modifiez son code à votre convenance avec un éditeur de code et enregistrez-le . A partir de cet instant, le fichier pages.php du thème enfant sera affiché sur votre site à la place du fichier pages.php du thème parent. Vous pouvez ainsi modifier n’importe quel fichier du thème parent y compris les fichiers style.css et functions.php que vous n’aurez pas besoin de les déplacer puisqu’ils existent déjà dans votre thème enfant.

A noter qu’avec votre thème enfant, vous gardez les mêmes options de personnalisation (ainsi que les réglages déjà effectués) que celles disponibles sur le thème parent à condition, bien entendu, de ne pas les modifier dans le code.

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *