Créer un thème enfant sur WordPress, une étape primordiale !
Ça y est, vous avez peut-être suivi notre article qui explique comment installer WordPress, et vous êtes prêts à créer votre propre site, à votre image. Il va falloir effectuer des modifications graphiques et donc créer un thème enfant WordPress !
Une des premières étapes de la création consiste à choisir un thème graphique pour son site.
Il en existe des milliers, gratuits ou payants, qui vous permettront de donner un style personnel à votre site.
Mais surtout, ces thèmes peuvent être modifiés à votre guise pour encore plus de personnalisation.
C’est la qu’il faut commencer à faire attention !
Mais un thème enfant, c'est quoi ?
Un thème enfant est un thème qui va hériter de toutes les fonctionnalités de son thème parent, mais sur lequel on va pouvoir effectuer des modifications qui seront conservées en cas de mise à jour du thème parent.
Utile, non ?!
Pourquoi créer un thème enfant WordPress ?
Imaginez le cas de figure suivant :
Vous choisissez un thème qui vous plaît, vous l’installez et vous commencez à le personnaliser en effectuant des modifications.
Quelques temps plus tard, le créateur du thème propose une mise à jour du thème pour ajouter de nouvelles fonctionnalités et renforcer la sécurité du thème.
Vous voulez forcément être à jour niveau sécurité, et vous ne crachez pas sur de nouvelles fonctionnalité, alors vous mettez le thème à jour.
Et bam ! Toutes vos modifications ont disparues, et vous vous retrouvez au point de départ avec le thème de base, et tout est à refaire…
Faut-il refuser les mises à jour du thème pour conserver ses modifications ?
C’est une solution en effet, mais nous la déconseillons fortement.
Un thème obsolète peut être une faille de sécurité importante pour votre site.
Alors comment conserver un thème à jour et les modifications effectuées ?
C’est la qu’intervient le concept de thème enfant, ou child theme pour les amateurs de la langue de Shakespeare.
Comment créer un thème enfant ?
Allez, du concret, installons un thème enfant sur notre site WordPress.
Nous allons vous montrer la méthode pour installer un thème enfant que votre site soit en local ou en ligne.
Pré requis:
Vous devez déjà avoir sélectionné le thème parent de votre site.
Vous pouvez conserver un des thèmes par défaut de WordPress (twentysixteen, twentyseventeen, twentynineteen, twentytwenty), ou bien choisir un autre thème via le back-office ou via le site de WordPress en suivant ce lien.
Etape 1 : Créer le dossier du thème enfant
En local, accédez via votre ordinateur au répertoire de votre site et rendez-vous dans le dossier wp-content/themes .
Ce dossier contient l’ensemble des thèmes installés sur votre WordPress.
La « norme » veut que l’on donne au thème enfant le nom du thème parent, suivi de « -child ».
Si vous souhaitez créer le thème enfant du thème twentynineteen, créez alors un dossier que vous nommez «twentynineteen-child».
En ligne, c’est la même démarche, sauf qu’il faudra passer par un logiciel client FTP pour accéder aux fichiers présents sur votre hébergement Web. Nous vous conseillons d’utiliser le logiciel Filezilla pour gérer vos hébergements Web.
L’image vous montre l’hébergement Web du site www.monsieursiteweb.fr, pour lequel j’ai installé le thème sydney, et on voit bien que j’ai créé le thème enfant « sydney-child » pour pouvoir modifier sereinement mon thème.
Mais ajouter un dossier ne suffit malheureusement pas à faire fonctionner un thème enfant, ce serait trop simple !
Deux fichiers au minimum sont requis pour que le thème enfant soit fonctionnel, un fichier functions.php et un fichier style.css
Etape 2 : Créer un fichier functions.php
Ce fichier va nous servir (entre autres) à indiquer à WordPress de prendre en priorité les modifications de style effectuées sur le thème enfant. Ainsi, le thème enfant prendra le dessus sur le thème parent.
Ouvrez donc votre logiciel d’édition de code, le bloc-note pour les plus téméraires, ou sinon nous vous conseillons vivement d’installer au minimum le logiciel Notepad++ pour créer et/ou modifier du code source.
Créez un fichier que vous appelez « functions.php » et enregistrez le dans le répertoire du thème enfant.
Ajoutons maintenant la fonction suivante à notre fichier :
// Fonction pour récupérer le fichier CSS du thème enfant
function theme_enqueue_styles()
{
wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
}
add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );
Cette fonction indique à WordPress l’emplacement du fichier de style CSS du thème enfant qui doit être pris en compte avant celui du thème parent.
Désormais, vous allez pouvoir modifier les règles CSS de votre thème dans le thème enfant sans que vos modifications ne soient perdues.
Etape 3 : Créer un fichier style.css
Pour pouvoir modifier les règles CSS via votre thème enfant, il est logique de devoir créer un fichier CSS dans votre thème enfant.
Encore avec votre logiciel d’édition de code, créer un fichier appelé « style.css » et enregistrez le également dans le répertoire du thème enfant.
Avant toute modifications, ajoutons quelques lignes en commentaire pour rendre ce fichier fonctionnel :
/*
Theme Name: twentynineteen-child
Description: Ajoutez une petite description de votre thème
Author: Votre prénom et Nom (toute œuvre doit être signée :p)
Author URI: https://www.nom-de-votre-site.fr
Template: twentynineteen
Version: 1.0
*/
Quelques explications sur ces lignes :
- Thème Name : Le nom de votre thème enfant.
- Description : La description de votre thème enfant (en sachant que cette description apparaîtra dans votre back office pour décrire le thème).
- Author : Nom et prénom de l’auteur du thème enfant.
- Author URI : L’url du site de l’auteur du thème enfant.
- Template : Le nom du thème parent (attention de bien respecter la casse en copiant exactement les majuscules et minuscules).
- Version : La version de votre thème enfant.
Si vous ne connaissez pas du tout le code CSS, voici un petit cours qui vous apprendra quelques bases pour avoir les capacités de personnaliser vous-même votre site.
Et voila, vous avez réalisé toutes les démarches pour avoir un thème enfant correctement installé sur votre site. Il ne vous reste plus qu’à activer votre thème enfant pour pouvoir l’utiliser..
Comment Activer un thème enfant sur WordPress ?
Pour procéder à l’activation de votre thème enfant, rendez-vous dans votre back-office, direction l’onglet apparence et le sous onglet thèmes.
Vous pouvez constater que votre thème enfant est désormais visible et disponible à l’activation.
Il ne vous reste plus qu’à cliquer sur le bouton « activer » de votre thème enfant.
Vous pouvez maintenant modifier le style de votre thème via le fichier « style.css » ou alors ajouter de nouvelles fonctions / réécrire les fonctions existantes via le fichier « functions.php ».
Et comme promis, vous pouvez désormais mettre à jour sereinement votre thème, aucune modification ne sera perdue !
Félicitations, votre thème enfant est installé et prêt à être utilisé ! 🙂
La conclusion !
Créer un thème enfant sur WordPress est une étape incontournable et très simple.
Cela dit, si cela vous fait peur de commencer à modifier les fichiers de WordPress, sachez qu’il existe des extensions capables de créer un thème enfant pour vous, comme Child Theme Configurator.
Chez Monsieur Site Web, nous préférons réaliser cette étape nous-même, nous trouvons dommage d’installer des extensions et alourdir nos sites WordPress pour quelque chose qui prend 5 minutes à réaliser !
A bientôt pour de nouvelles astuces sur l’environnement WordPress ! 🙂
Les tags
A bientôt pour de nouvelles astuces ! 🙂
Vous avez aimé cet article ? Vous pouvez
Le partager avec votre communauté
Articles similaires
Personnaliser le formulaire de validation de commande Woocommerce
Le tunnel de vente d’un site E-commerce est extrêmement important pour que les ventes se convertissent.
Une page de validation de commande trop succincte, peu réfléchie, ou au contraire une page surchargée aura un impact négatif sur vos ventes.
Découvrons ensemble comment personnaliser la page de checkout pour offrir une expérience utilisateur optimale à vos clients.
Ajouter les prix de revient des produits Woocommerce, calculer les marges nettes sans plugin
Woocommerce est l’extension de référence pour créer une boutique E-commerce sur un site WordPress. Cependant, Woocommerce ne permet pas tout. Par défaut, il n’est pas prévu de pouvoir saisir les prix d’achat (ou prix de revient ) des produits pour connaître les marges nettes réalisées.
Découvrons ensemble comment ajouter cette fonctionnalité à Woocommerce.
Pourquoi nous avons créé notre plugin Monsieur Site Web
WordPress est magique, certes !
Mais pour réaliser un site internet professionnel, WordPress à quelques inconvénients et certaines fonctionnalités nécessaires doivent être ajoutées sur chaque site internet.
C’est pourquoi chez Monsieur Site Web, nous avons créé notre propre plugin qui nous permet d’effectuer des actions de manière automatique sur votre futur site.
Découvrons en détails le fonctionnement de notre plugin.
Les commentaires
Super site et tuto
Bonjour,
Et bravo pour ces explications claires précises, rentre le php enfin accessible aux débutant, les site comme le votre sont rarent.
Encore un grand merci
votre thème enfant est désormais visible ? ?
Vous pouvez constater que votre thème enfant est désormais visible et disponible à l’activation
Question. Ou ? ?
La définition de la photo n’est pas. Assez bonne !
Proposition : utilisation de la loupe windows
Réponse de Monsieur Site Web
Bonjour,
Je vous remercie pour votre commentaire. Votre thème enfant est visible dans le back-office dans l’onglet Apparence, sous onglet thèmes. C’est depuis cette page que vous pourrez l’activer après l’avoir correctement paramétré.
Pour mieux voir une image affichée sur un article de blog, il vous suffit de cliquer dessus pour pouvoir Zoomer 😉
Bonne journée et bon courage pour la création de votre thème enfant 🙂
Laisser un commentaire
Vous avez un projet ?
Nous sommes disponibles à tout moment pour l’étudier et le réaliser.
N’hésitez pas à nous contacter.
