Aller au contenu

Richard Coudrais

Thème enfant
Accueil » blog » créer un thème enfant sous WordPress

créer un thème enfant sous WordPress

Créer un thème enfant sous WordPress évite beaucoup de désagréments. Cela permet en premier lieu de personnaliser un thème existant et d’éviter que nos modifications soient écrasées par une mise à jour.

La création d’un thème enfant sous WordPress nécessite de faire un peu de code. rien de bien sorcier, mais connaitre quelques bases de css et de php permettront de bien savoir ce que l’on fait.

Il s’agit dans un premier temps de créer un répertoire dans l’arborescence de WordPress et d’y déposer deux fichiers. Dans notre exemple, nous créons un thème enfant nommé Child Theme qui se base sur le thème Twenty Twenty Two de WordPress (qu’on appellera le thème source).

  • Dans le répertoire /wp-content/themes/
    • créer un répertoire portant le nom du thème enfant, par exemple childtheme
  • Dans le répertoire /wp-content/themes/childtheme/
    • créer un fichier style.css qui contiendra le code suivant :
/*
Theme Name: Child Theme
Theme URI: https://www.onsenfout.com
Description: Thème enfant à partir de twentytwentytwo
Author: Richard Coudrais
Author URI: https://www.richard-coudrais.com
Template: twentytwentytwo
Version: 0.1.0
*/

Tout ce qui est mentionné en italique est à modifier. Défense de toucher à ce qui n’est pas rédigé en italique (et surtout ne pas mettre d’espace avant le deux points).
Deux éléments sont indispensables :

  • Theme Name: Child Theme est le nom que vous aurez choisi de donner à votre thème
  • Template: twentytwentytwo est le nom du répertoire dans lequel se trouve le thème source

Les autres sont facultatifs (mais pas tous inutiles) :

  • Description: permet de donner quelques indications à l’utilisateur
  • Author: flatte l’égo du créateur (surtout utile en agence pour savoir qui a fait quoi)
  • Les URL ne sont à indiquer que si vous y trouvez un intérêt
  • Tout comme la version

Une fois rempli le fichier style.css, il faut l’enregistrer et le fermer. On passe ensuite à l’autre fichier.

  • Dans le répertoire /wp-content/themes/childtheme/
    • créer un fichier function.php qui contiendra le code suivant :
<?php
add_action( 'wp_enqueue_scripts', 'wpm_enqueue_styles' );
function wpm_enqueue_styles(){
   wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
}

Ici, il n’y a rien à changer. On reprend le code tel quel.

Une fois que les deux fichiers sont présents dans le répertoire du nouveau thème, on peu se rendre dans le tableau de bord WordPress et cliquer sur Apparence > Thèmes : on constatera l’existence de ce nouveau thème. On peut même le sélectionner, même si en l’occurrence, il sera identique au thème source.

Pour que ça soit plus sympa, on peut ajouter une image jpg au format 600×450 pixels que l’on appellera screenshot.jpg et que l’on déposera dans le répertoire /wp-content/themes/childtheme/

Et ensuite ?

Ensuite, selon ses besoins, on pourra modifier le fichier style.css et ajouter des fonctions dans function.php. Le principe est que le thème utilise les ressources du thème source, mais priorise ce qui est inscrit dans style.css et function.php (car ces fichiers sont lus en dernier).