Rédacteur : Eric P.
Sommaire
Débuter avec WordPress : Comment créer un thème enfant ?
Sur des centaines de CMS qui existent, sans parler des sites web qui ne font pas appel à une solution de gestion de contenu, WordPress est le plus populaire et l’un des plus appréciés. Sans parler de la gestion de contenu en général, ce CMS a aussi cet avantage d’être très facile à utiliser (d’un point de vue développement), même pour ceux qui ont des connaissances très minimums sur la programmation web. Il existe cependant une facette de WordPress qui est moins connue, l’utilisation des « thèmes enfants ». Pourquoi les utiliser ? Quels en sont les avantages ? Vous allez découvrir à travers ce document que le thèmes enfant est tout simplement incontournables lorsque vous utilisez WordPress.
Pourquoi parler de thème enfant ?
Lorsque vous faites appel à WordPress pour votre site (et lorsque vous téléchargez le CMS), celui-ci sera livré avec des thèmes gratuits. Cependant, vous n’allez pas forcément adopter l’un de ces thèmes, vous allez sûrement en choisir un et le modifier selon vos goûts, vos besoins, vos différentes contraintes techniques… Si tout le monde utilisait en effet ces thèmes fournis, les milliers de sites de web WordPress qui existent se ressembleraient tous. De la même manière, des milliers de thèmes gratuits et payants existent sur la toile. Vous pouvez les télécharger et les modifier selon vos besoins, exactement comme avec les thèmes fournis.
Cependant, un problème de taille existe. Le site, comme le thème de WordPress évoluent et sont automatiquement mis à jour, sauf si vous enlevez cette fonctionnalité. Ainsi, lorsque vous modifiez un thème, son éditeur ne saurait pas s’adapter aux modifications que vous avez réalisées sur votre site, et vous risquez d’avoir de gros problèmes si vos modifications et ceux de l’éditeur ne sont pas compatibles. Ainsi, à chaque mise à jour, vous risquez de voir votre site dans tous ces états. Et à chaque modification des fichiers de base, vous serez obligé d’apporter à votre tour des adaptations importantes. Cette situation n’est pas du tout favorable.
Il serait tentant de ne pas permettre à WordPress de ne pas se mettre à jour. Cependant, cette pratique n’est pas conseillée, vu que les modifications apportées peuvent concerner des facettes très importantes, comme la sécurité de votre site. Et d’un côté, une solution toute simple s’offre à vous : les thèmes enfants.
Qu’est-ce qu’un thème enfant WordPress ?
Le principe du thème enfant est très simple : il suffit de créer son propre thème à partir d’un thème existant, sans toucher au premier qui sera alors le thème parent. L’idée n’est pas de recopier et de modifier à sa guise l’ensemble des fichiers concernés, mais de modifier uniquement les fichiers qui doivent l’être en se limitant au strict minimum. De cette manière, lorsque le thème parent est mis à jour, les répercussions seront automatiques vers votre site web.
Pour être plus clair, nous allons vous rappeler le principe de fonctionnement d’un thème WordPress en général. D’abord, WordPress est un outil de gestion de contenu où ce dernier est géré séparément du thème (ou du visuel de votre site web). Chaque page du site, lorsqu’un internaute fait appel à elle, utilise un thème que vous aurez choisi. Jusqu’ici WordPress fonctionne à peu près comme tous les CMS ordinaires. Cependant, nous avons vu que modifier un thème fourni (gratuit ou payant) est une mauvaise pratique sur WordPress, vous devez utiliser le système parent / enfant pour votre site internet.
En d’autres termes, au chargement de votre page par un internaute, la requête fera appel à deux thèmes spécifiques, le thème parent et le thème enfant. Cependant, les deux thèmes ne vont pas se mettre en conflit. Au contraire, ils vont se compléter. D’un point de vue technique, lors du chargement de votre page, plusieurs lignes de votre fichier .css ou .php (converti en réalité en .html) vont être envoyées à votre navigateur de la part du thème parent dans un premier temps. Puis, quelques lignes vont être écrasées et ignorées lorsque le thème enfant sera chargé, ces derniers seront les seules considérées par votre navigateur.
Comment créer un thème enfant avec WordPress ?
Dans WordPress, le thème est géré principalement par les fichiers style.css et functions.php. Notez que vous avez le loisir d’ajouter d’autres fichiers ensuite selon les besoins. Vous avez aussi la possibilité de modifier les noms de ces fichiers, ce qui n’est pas du tout conseillé pour le thème parent sinon les mises à jour ne se feront pas. Vous trouverez ces fichiers dans le répertoire « wp-content/themes/nom-de-votre-theme » de votre serveur d’hébergement.
Supposez alors que vous aimeriez utiliser le thème twentyseventeen comme thème parent de votre site. Vos fichiers de thèmes se trouvent donc dans le répertoire « wp-content/themes/twentyseventeen ». L’étape suivante est alors de créer le répertoire de votre thème enfant, par exemple « wp-content/themes/mytheme ». Créez ensuite dans ce répertoire deux fichiers, style.css et functions.php VIDE (très important).
Ouvrez ensuite le fichier style.css avec n’importe quel navigateur et écrivez ces quelques lignes dedans :
/*
Theme Name: My theme
Template: twentyseventeen
Version: 1.0.0
*/
De la même manière, ouvrez le fichier theme.php avec n’importe quel navigateur et écrivez-y ces quelques lignes :
<?php add_action( ‘wp_enqueue_scripts’, ‘my_theme_enqueue_styles’ ); function my_theme_enqueue_styles() { wp_enqueue_style( ‘parent-style’, get_template_directory_uri() . ‘/style.css’ ); } ?>
Accédez aux paramètres de votre site et indiquez à WordPress votre nouveau thème dans Apparence > Thèmes, en prenant bien soin d’indiquer le thème enfant.
Qu’avons-nous fait ? Nous venons d’ordonner à WordPress d’utiliser notre nouveau thème (enfant), mais lorsqu’il accède aux deux fichiers principaux, ces derniers le renvoient aux deux fichiers équivalents du thème parent. Lorsque plus tard, le thème parent sera mis à jour, votre site le sera aussi puisque ce sont les deux fichiers du thème parent qui seront changés.
La prochaine étape est de modifier votre site, en copiant uniquement les fichiers qui vous intéressent du thème parent vers votre thème enfant. Par exemple, si les modifications nécessaires concernent uniquement le fichier header.php, copiez-le dans votre répertoire du thème enfant. Lors du chargement de votre page, WordPress chargera en priorité les fichiers qu’il trouvera dans le dossier enfant avant de chercher dans le dossier parent. Notez que vous avez aussi désormais la liberté d’ajouter d’autres feuilles de styles ou d’autres feuilles php voire html (toujours dans votre dossier thème enfant).
