Lorsque vous installez un thème sur votre site WordPress, il se peut que vous apportiez des modifications dans le fichier CSS ou dans les fichiers PHP du site. Le problème est que lorsque ce thème sera mis à jour par ses créateurs et que vous décidez de mettre ce thème à jour sur votre site, toutes les modifications seront perdues.

Il existe heureusement une alternative à cela, les thèmes enfant.

Il s’agit d’un thème que vous allez créer qui reprend l’ensemble des propriétés d’un thème existant dans lequel vous pourrez apporter toutes les modifications que vous voulez et qui ne seront jamais écrasées lorsque le thème principal (que l’on qualifie de thème parent) sera mis à jour.

Via FPT

Pour faire un thème enfant, vous aurez besoin du thème original  et de 2 fichiers que vous allez créer.

  1. Choisir un thème et l’activer dans Apparence > Thèmes  p.ex. Twenty Sixteen
  2. Se rendre dans le dossier wp-content/themes et y identifier le nom du thème actif, dans notre cas twentysixteen
  3. Dans de même dossier wp-content/themes, créer un nouveau répertoire p.ex. child-twentysixteen (par convention on peut reprendre le nom du répertoire du thème principal précédé de child- mais le nom du dossier est libre!)
  4. Dans le nouveau dossier (dans ce cas child-twentysixteen ) créer 2 fichiers
    1. functions.php
    2. style.css
  5. Dans le fichier functions.php copiez le code ci-dessous. Cela a pour effect de récupérer le style du thème parent et enfant NB: N’oubliez pas d’inclure ce code dans des balises PHP <?php   code ici    ?>
    
    <?php
    add_action( "wp_enqueue_scripts", "my_theme_enqueue_styles", 100 );
    function my_theme_enqueue_styles() {
    wp_enqueue_style( "parent-style", get_template_directory_uri() . "/style.css" );
    wp_enqueue_style( "child-style", get_stylesheet_uri() );
    } ?>
    
    

     

  6. Dans le fichier style.css, copiez le code ci-dessous
    
    /*
    Theme Name: Mon site enfant de Twenty Sixteen
    Template: twentysixteen
    Author: Emmanuel Lemal
    Description: Thème enfant crée sur base du thème Twenty Fifteen
    Version: 1.0.0
    */
    

    Le plus important ici est la valeur attribuée à Template. Il doit impérativement s’agir du nom du dossier du thème parent !

  7. Une fois cela fait,  envoyez tout vote nouveau dossier en FTP sur le serveur (pas nécessaire si vous travaillez en local)
  8. Si vous voulez, vous pouvez créer dans ce même dossier une image que vous appelez screenshot.png ou .jpg qui illustrera votre thème
  9. Allez dans Apparence > Thèmes et activez le nouveau thème
  10. Vous pouvez maintenant apporter toutes les modifications que vous désirez dans le fichier style.css

Via ZIP

Pour faire un thème enfant, vous aurez besoin du thème original  et de 2 fichiers que vous allez créer.

  1. Choisir un thème et l’activer dans Apparence > Thèmes  p.ex. Twenty Sixteen
  2. Identifier le nom du dossier du thème parent en allant sur le site
    1. afficher code source
    2. rechercher « themes »
    3. identifier le dossier (c’est la partie derrière /themes/nom-du-dossier/) dans ce cas-ci twentysixteen
  3. Nimpote où sur votre ordinateur, créer un nouveau répertoire p.ex. child-twentysixteen (par convention on peut reprendre le nom du répertoire du thème principal précédé de child- mais le nom du dossier est libre!)
  4. Dans le nouveau dossier (dans ce cas child-twentysixteen ) créer 2 fichiers
    1. functions.php
    2. style.css
  5. Dans le fichier functions.php copiez le code ci-dessous. Cela a pour effect de récupérer le style du thème parent et enfant NB: N’oubliez pas d’inclure ce code dans des balises PHP <?php   code ici    ?>
    
    <?php
    add_action( "wp_enqueue_scripts", "my_theme_enqueue_styles", 100 );
    function my_theme_enqueue_styles() {
    wp_enqueue_style( "parent-style", get_template_directory_uri() . "/style.css" );
    wp_enqueue_style( "child-style", get_stylesheet_uri() );
    } ?>
    
    

     

  6. Dans le fichier style.css, copiez le code ci-dessous
    
    /*
    Theme Name: Mon site enfant de Twenty Sixteen
    Template: twentysixteen
    Author: Emmanuel Lemal
    Description: Thème enfant crée sur base du thème Twenty Fifteen
    Version: 1.0.0
    */
    

    Le plus important ici est la valeur attribuée à Template. Il doit impérativement s’agir du nom du dossier du thème parent !

  7. Si vous voulez, vous pouvez créer dans ce même dossier une image que vous appelez screenshot.png ou .jpg qui illustrera votre thème
  8. Une fois cela fait,  zippez votre dossier nouvellement créé
  9. Allez dans Apparence > Thèmes > Ajouter un thème > Téléverser un thème et choisissez votre fichier .zip
  10. Vous pouvez maintenant apporter toutes les modifications que vous désirez dans le fichier style.css via Apparence > Editeur de fichiers et de thèmes

A noter:

Plus d’informations sur https://codex.wordpress.org/fr:Thèmes_Enfant