Sélectionner une page

Le thème enfant est un élément important pour bien consolider la fondation de votre site Internet. Dans cet article je vais vous expliquer ce qu’est un thème enfant, plus précisément appelé « child theme » en anglais, à quoi ça sert et surtout comment le mettre en place pour votre site. Vous verrez que c’est assez simple. Installer un thème enfant ne nécessite que quelques manipulations faciles que vous pouvez réaliser aisément. Je prends en considération que la plupart de mes lecteurs sont familiers avec wordpress, ce qu’est un thème et les extensions.

 

QUE SE PASSE-T-IL LORSQUE VOUS EFFECTUEZ UNE MISE À JOUR DE VOTRE THÈME WORDPRESS VERS UNE VERSION PLUS RÉCENTE ?

Les concepteur de thèmes et d’extension ont la fâcheuse habitude de mettre régulièrement à votre disposition des mises à jour de leurs produits. Parfois c’est pour corriger des bugs, parfois c’est pour ajouter de nouvelles fonctionnalités. WordPress est une plateforme en constante évolution. Pour faire une analogie, c’est un peu comme un détaillant automobile qui vous présente annuellement une nouvelle version d’un véhicule.

Lorsque vous réalisez la mise à jour de votre thème WordPress le contenu est conservé (textes et extensions) mais l’ancienne version du thème, le contenant en quelque sorte, est automatiquement  effacé et remplacé par la nouvelle version. Un nouveau look de véhicule en quelque sorte.

TANT ET AUSSI LONGTEMPS que vous n’avez pas personnalisé vous-même certains éléments sur votre « contenant », tout va bien. MAIS si c’est le cas et que vous faites vos mises à jour régulièrement, comme tout bon webmestre soucieux, eh bien vos modifications personnalisées disparaîtront et seront remplacées par la nouvelle version du thème. Vous me suivez? En 2013, la compagnie Elegant Theme a réalisé un sondage qui disait que 85% des consommateurs personnalisent leur site WordPress mais seulement 35% utilisent un thème enfant. VOUS VOYEZ LA BELLE SURPRISE POINDRE À L’HORIZON ?

 

JE NE SUIS PAS UN PROGRAMMEUR!

Nul besoin d’être programmeur pour personnaliser un thème. Avec Internet il suffit de gratter un peu pour trouver un code permettant de personnaliser certains éléments de votre site Internet (ex : centrer un titre, ajuster une couleur, etc.). Ces codes sont souvent appliqués avec un simple copier-coller dans l’onglet CSS de la section « personnaliser » de votre site web. Vous sauvegardez et voilà, vous êtes programmeur !

 

C’EST LÀ QUE LE THÈME ENFANT DEVIENT INTÉRESSANT !

Le thème enfant a pour fonction de conserver et prend en charge toutes les modifications personnalisées de votre site Internet.  Ce sont les fichiers du thème parent qui sont mis à jour. Un fois que cela est fait, l’affichage du site web doit obligatoirement passer par le thème enfant qui incrustera au passage dans le code les modifications personnalisées de votre site avant que votre page ne s’affiche à l’écran.

 

EN RÉSUMÉ :

  • Si vous modifiez un thème existant et qu’il est mis à jour, vos modifications seront perdues.
  • Utiliser un thème enfant vous assure que vos modifications seront préservées.
  • Utiliser un thème enfant accélère le temps de développement.
  • Utiliser un thème enfant est une excellente façon de commencer pour apprendre comment développer un thème WordPress.

 

LA RECETTE POUR CRÉER VOTRE THÈME ENFANT

N.B. : Bien que ces manipulations demeurent aisées, la responsabilité de vos modifications vous revient entièrement. Une sauvegarde de vos données avant toutes manipulations est toujours conseillée.

 

1-CRÉER VOTRE RÉPERTOIRE DE BASE (UN DOSSIER)

Créer un dossier sur votre bureau d’ordinateur et le renommer du même nom que le thème que vous employez (le thème actif) mais en y ajoutant l’extension « child » ou « enfant ». C’est comme vous voulez. Dans l’exemple ci-dessous, nous avons créé un thème enfant nommé « twentyfifteen-child »  dont le nom du thème parent est : « twentyfifteen ».

2- CRÉER LES FICHIERS DANS LE DOSSIER DU THÈME ENFANT

A l’aide d’un éditeur de texte (ex : Brackets) créez ensuite deux fichiers que vous placez dans le dossier que vous venez de créer et nommez-les : functions.php et style.css. 

3- OUVREZ LE FICHIER « style.css » AVEC VOTRE ÉDITEUR. SÉLECTIONNEZ, COPIER ET COLLER LE CODE SUIVANT DANS LE FICHIER :

/*
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
*/

Vous pouvez personnaliser les éléments Theme name, Theme URL, Description, Author et Author URL à votre discrétion. L’élément Template quant à lui doit porter le même nom que le thème parent. Voilà pour cette étape. Sauvegardez et fermer le fichier.

 

4- Ensuite ouvrez le fichier « functions.php » avec l’éditeur. Sélectionnez, copier et coller le texte suivant tel quel :

add_action( ‘wp_enqueue_scripts’, ‘theme_enqueue_styles’ );
function theme_enqueue_styles() {
wp_enqueue_style( ‘parent-style’, get_template_directory_uri() . ‘/style.css’ );
}

Sauvegardez et fermez votre fichier. Vous venez de créer votre thème enfant.

5- INSTALLER LE DOSSIER DANS LE RÉPERTOIRE RACINE DE VOTRE SITE WEB

Deux façons de faire pour y parvenir :

• Utiliser une connection FTP à l’aide d’un fureteur ftp tel que (Filezilla ou Cyberduck) et téléchargez directement le dossier au bon endroit dans le répertoire Theme de votre site web.

• Téléchargez le thème directement à partir du tableau de bord de votre site web.

Si vous avez déjà installé vous-même votre site Internet vous devriez être familié avec ces notions. La vidéo ci-dessous vous montre comment procéder par le tableau de bord de votre site web. Si vous avez des questions vous pouvez m’écrire directement dans la section commentaires en-dessous.

NB : Il existe des extensions pour créer automatiquement un thème enfant de votre site web. Je ne les ai pas testés. En voici quelques-unes qui semblent faire l’affaire. Si vous les essayez, donnez-moi votre opinion 😉

• Child Theme Configurator : Ils ont une version de base et pro (payante) ICI
• Child Them Creator : version pro ICI
• Child Themify : Gratuite ICI 
• Child Theme Wizard ICI

Bonne succès!
Coach Alain