Tout savoir sur les thèmes enfants sous WordPress

Qu’est-ce qu’un thème enfant et pourquoi vous devriez en avoir un

  • Un thème enfant est un thème qui  va garder les fonctionnalités du thème que vous avez installé (thème parent) mais qui va te permettre d’effectuer des changements ou des modifications notamment (mais pas seulement) au niveau de la feuille de style CSS sans modifier directement les fichiers du thème parent.
  • Il vaut mieux créer un thème enfant lorsque tu en es au début de la création de ton site.
  • Si tu dois éditer des fichiers du thème parce que tu veux personnaliser une fonctionnalité ou un design, lorsque le développeur du thème fera une mise à jour, et tu pourras perdre ces personnalisations. Imagine les heures passées à coder certaines choses et tout perdre à cause d’une mise à jour ! :-/
  • Grâce à un thème enfant tu assures ainsi la sécurité de voir tes personnalisations demeurer même en cas de mise à jour.
Un thème enfant permet de garder tes personnalisations en sécurité, tout site devrait en posséder un.Click to Tweet

Le cas du Framework Genesis

Pour ceux qui connaissent le framework Genesis, ce framework utilise par défaut un thème parent sur lequel viennent se greffer des thèmes enfants déjà largement personnalisés.

Lorsque tu passes par Genesis, tu dois installer le framework (qui est en quelque sorte, le thème parent) et ensuite un thème de ton choix compatible Genesis.

Tu dois laisser les deux thèmes dans ton interface et tu dois activé celui qui est le thème enfant. Si tu supprimes le framework Genesis de base, ton thème ne fonctionnera plus.

Ceci est valable chaque fois qu’on utilise un thème enfant Genesis Framework ou pas.

C’est pour moi ce qui fait que le Framework Genesis est vraiment une bonne option pour un site car on a sous le capot un thème parent puissant qui est mise à jour régulièrement, bien codé et prêt pour le référencement naturel tout en ayant la possibilité d’avoir un look original et joli tout en sécurité.

Une petite sélection de thèmes enfants compatibles Genesis que je préfère

Comment faire un thème enfant : méthode traditionnelle

  1. Dans ton FTP sous wp-content >themes créée un nouveau dossier. Donne lui le nom que tu veux donner à ton thème enfant (pour plus de cohérence tu peux l’appeler du nom du thème parent + child ex: simplemag-child)
  2. Dans un éditeur de texte (ex: textWrangler) copie ce texte en faisant les changements nécessaires
    Note bien le nom du thème enfant qui doit être le même que celui du dossier que tu viens de créer et après Template, note bien le nom du thème parent.

    /*
    Theme Name: Nom du thème enfant (ex :Simplemag Child)
    Description: Theme enfant du theme  nom du thème parent.
    Author: Nom de l'auteur
    Author URI: https://url de l'auteur.com
    Template: Ici il faut noter le nom du thème parent
    Version: 1.0
    */

    Enregistre ensuite ce document sous le nom style.css et glisse le dans le dossier de ton thème enfant.

  3. Crée un document toujours dans un éditeur de texte dans lequel tu vas coller le code suivant:
    <?php
    
    /* Chargement de la feuille du style du theme parent */
    add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );
    function theme_enqueue_styles() {
     wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
    }

    Enregistre ensuite le document sous le nom de functions.php et glisse le également dans le dossier de ton thème enfant.

  4. Créer une image de la taille 880 x 660 et nomme là screenshot.png ajoute là également à ton dossier.

Au final si tu as respecté ces étapes tu devrais avoir cela:

 

Tu peux alors aller dans ton WordPress, dans Apparences> Thèmes et tu verras l’image de ton thème enfant. Tu pourras alors activer ce dernier.

La méthode de la paresseuse grâce à un générateur en ligne

Si tu ne te sens pas prêt(e) à mettre les mains dans le cambouis, notre camarade Alex de WP Marmite propose une solution prête à l’emploi en ligne.

CREER UN THEME ENFANT

Si ton site est déjà en ligne:

va sur cette adresse et entre l’url de ton site, clique sur Générer le thème enfant et en une seconde tu télécharges un thème enfant prêt à l’emploi à installer sur ton site via FTP comme je te l’indique au dessus (en mettant le dossier dans wp-content>themes).

Cela te fait gagner du temps et de créer tous les fichiers toi-même.

Si ton site n’est pas encore en ligne:

clique sur le lien en dessous « votre site n’est pas encore en ligne? » et entre le nom de ton thème parent. Télécharge ensuite le fichier.

Méthode à l’aide d’un plugin

Ce plugin s’appelle: Child Themify. Il est pratique et pourra dépanner un débutant. Néanmoins il ne permet pas de personnaliser l’url du thème, le nom de l’auteur, l’url de l’auteur et la version. Mais si pour toi tout ce qui compte c’est d’avoir un thème enfant facilement et sans avoir à manipuler quoi que ce soit, cette solution peut t’aider.

Un tutoriel en images:

Activer l’extension

Une fois l’extension activée, se rendre dans l’onglet Apparences>thèmes. Tu découvriras qu’à côté de chaque thème une nouvelle phrase a été créée: « create a child theme »

creer un theme enfant

Créer le thème enfant

Clique sur « create a child theme », une nouvelle fenêtre s’ouvre. Maintenant il te faut entrer un nom pour ton thème enfant:

creer un theme enfant

Activer le thème enfant

Après avoir cliqué sur « let’s go » un message est apparu te disant que le thème enfant a été créé avec succès. Rendez-vous à nouveau dans Apparences>thèmes. Tu découvriras alors votre thème enfant. Il te suffit de l’activer.

Quelques conseils

-Lorsque le thème est activé, le thème dépend bien d’un thème parent donc ne supprime jamais le thème parent ou ton thème enfant ne fonctionnerait plus.

– Si tu vas maintenant sur Apparence> Editeur, tu verras que c’est bien ton thème enfant qui prendra en charge les changements de style.

creer un theme enfant wordpress

– Si tu vas sur ton serveur via FTP, tu verras que le dossier du thème enfant a été créé dans wp-content> thèmes

créer un thème enfant avec child themify

A savoir lorsqu’on installe un thème enfant

Lorsqu’on active le thème enfant, il se peut que ton site ait l’air sans dessus dessous. C’est parce que le menu n’est plus configuré donc il faut te rendre à nouveau dans Apparences>menus et sélectionner ton menu si tu en avais déjà créé un!

Voilà, tu es prêt(e)s à te servir de ton thème enfant!

10 Comments

  1. allo serrurier montigny le bretonneux sur 1 août 2014 à 12 h 24 min

    Merci ! je découvre enfin concrètement les fonctionnement des themes enfant et j’aimerai bien savoir si cette méthode fonctionne avec tous les templates worpress gratuit ou payant ?

    • Christelle Bourgeois sur 1 août 2014 à 23 h 00 min

      A priori oui, même si je n’ai pas essayé sur de nombreux thèmes. Mais ayant fait le test sur un payant et un gratuit, ça a fonctionné pour moi. Je recommande cette solution si vraiment on ne s’y connait pas et qu’on ne veut pas créer des fichiers soi même. Mais la meilleure méthode à suivre reste tout de même celle décrite dans le codex et ce n’est pas aussi difficile qu’on le croit. Vous pourrez trouver cela ici: http://codex.wordpress.org/fr:Thèmes_Enfant
      Bonne continuation !

  2. romain sur 20 septembre 2014 à 16 h 29 min

    et comment faire une fois que l’on a activé le thème enfant pour copier et ajouter tous les autres fichiers en plus du style.css afin que l’enfant soit le même que le parent et ainsi repartir proprement de zéro avec un thème enfant ?

    • Christelle Bourgeois sur 22 septembre 2014 à 17 h 54 min

      Bonjour Romain,
      A priori moi je ne copie pas « tous » les fichiers. Le but n’est pas d’avoir un nouveau « thème complet » mais de mettre dans ce thème enfant les fichiers qu’on va modifier comme la feuille de style, le fichier function.php, et les autres fichiers php que l’on modifie (pour moi souvent header.php et footer.php) ceci afin d’empêcher que lors d’une mise à jour du thème parent on perde nos changements.
      Pour ce faire, je crée une page sous textedit par exemple je copie et colle sur cette page tout ce que contient mon fichier header.php par exemple. Je l’enregistre sur mon bureau en le nommant header.php et ensuite via FTP la met dans le dossier de mon thème enfant. Pour fonction.php c’est un peu différent. On ne copie pas tout, on crée juste un fichier (comme ci-dessus) sur lequel on inscrit

  3. Vanessa sur 9 mai 2015 à 19 h 21 min

    Bonjour Christelle, j’ai suivi vos instructions à la lettre tout fonctionne! je suis donc en train de « créer » mon site sous le theme enfant de mon theme principal. Mais maintenant que dois-je faire? en cas de mise à jour de mon thème devrai-je mettre à jour mon thème enfant ou mon thème parent? et ensuite? quels fichiers transférer? dans quel sens? En gros je suis complètement perdue! Faire le thème enfant avec le plugin ok c’est facile mais le reste… Pouvez vous m’aider à y voir plus clair? vous dites au dessus « mettre dans ce thème enfant les fichiers qu’on va modifier comme la feuille de style, le fichier function.php, et les autres fichiers php que l’on modifie  » comment mettre de tels fichiers dans mon thème enfant puisque je ne travaille pas sur le thème parent?

    • Christelle Bourgeois sur 9 mai 2015 à 19 h 38 min

      Bonjour Vanessa,

      Normalement vous devez maintenant voir via FTP vos deux dossiers le theme parent et le theme enfant. La feuille de style a été mise par défaut dans le thème enfant par le plugin donc si vous avez des changements css à faire vous pouvez les écrire directement sur cette feuille de style. Ensuite tout dépend si vous avez besoin de modifier d’autres fichiers. Par exemple si vous avez besoin de changer un fichier comme footer.php,il vous faut copier et coller ce fichier dans le dossier du thème enfant et faire vos changements dans le footer.php du thème enfant. (Vous aurez donc en tout deux footer.php, un dans le thème parent, un dans le thème enfant. Celui du thème enfant gardera vos modifications quand celui du thème parent sera écrasé par les mises à jours). Pour faire ce copier coller, vous devez passer par FTP.
      Ensuite vous pourrez faire les mises à jour de votre thème parent quand il y en aura. Le thème enfant ne bouge pas. C’est le thème parent qu’on met à jour.

      • Vanessa sur 14 mai 2015 à 23 h 13 min

        Bonjour Christelle,
        Merci de votre réponse. Afin de traduire mon thème j’ai téléchargé le plugin loco, je dois donc copier coller le fichier languages dans mon thème enfant mais je n’arrive pas à le faire, il n’y a pas cette possibilité de copier coller. Désolée… Merci à vous et longue vie à votre blog qui est instructif et « frais »!

  4. camille sur 5 août 2015 à 14 h 13 min

    Bonjour,

    Merci beaucoup pour votre article.
    J’essaye de créer mon thème enfant à la main mais je suis en passe de baisser les bras et de prendre un plugin.

    Mon problème est que j’ai bien créé mon thème enfant. Quand je fais une modife sur lastyle.css de mon thème enfant cela est visible sur mon site. J’ai également intégré dans mon thème enfant tous les fichiers .php que j’ai modifié et en testant j’ai constaté que cela fonctionne bien.

    Mon problème c’est sur functions.php. J’ai donc créé un functions.php dans mon child theme mais quand je fais des modifes dessus, ces dernières ne se répercutent pas sur mon site. Comme si le thème parent était toujours le plus fort, comme si functions.php de mon thème enfant n’était pas appelé. Je ne comprends pas pourquoi car il me semble pourtant avoir fait ce qu’il fallait ;(
    Voilà mon fichier functions.php (celui de mon child theme) : http://pastebin.com/3yDvA94n
    Pourriez-vous y jeter un oeil et me dire si vous voyez où est mon erreur ?

    J’espère que vous pourrez m’aider !
    Merci d’avance pour votre retour,
    Bien à vous,
    Camille

    • Christelle Bourgeois sur 6 août 2015 à 22 h 17 min

      Bonjour Camille,

      A y regarder comme ça j’avoue que je ne vois pas bien d’où l’erreur peut venir. Normalement le function.php du thème enfant est appelé en complément de celui du thème originel et est même « lu » en premier..
      Avez-vous la possibilité de contacter le concepteur du thème? Je me rappelle avoir déjà lu quelque chose au sujet du même problème que vous avez décrit et me souviens que selon le thème utilisé il fallait ajouter une ligne de code dans le function.php du child theme..
      Par contre dans pastebin je remarque que certains guillemets-apostrophes sont « courbés ». Faites attention à ce qu’il soient « droits ». Cela m’a déjà causé des problèmes de code non pris en compte.

      • Camille sur 10 août 2015 à 15 h 05 min

        Merci beaucoup pour votre retour !
        En fait je crois que cela vient du fait que je ne me suis pas servi des fonctions add_image_size() ou encore add_theme_support correctement. Apparemment il faut que je les inclue dans une fonction liée au hook after_setup_theme…
        Bref je vais retravailler dessus et quand cela fonctionnera je vous montrerai !
        Je vais aussi refaire le tour des apostrophes 😉
        Merci encore !

Laissez un commentaire





Scroll Up
108 Partages
Enregistrer93
Tweetez
Partagez14
Partagez1