[Total : 1    Moyenne : 5/5]

Les themes WordPress sont fantastiques mais il y’a toujours quelques personnalisation que l’on souhaite apporter. Changer une couleur, une taille de police d’écriture. Et si vous modifiez ce bouton un peu trop triste ?

Mais savez-vous que modifier un thème, même rien qu’un tout petit peu, et bien ça vous bloque dans la mise à jour d’une nouvelle version. Et oui, si vous effectuez la mise en jour, bam ! Tout vos changements ont disparus.
Si vous voulez assurer la pérennité de votre site, il faut absolument créer un Thème Enfant au début de votre projet.

 

Comment marche un Thème Enfant et Pourquoi l’utiliser

Vous avez une télévision chez vous n’est ce pas ? Si vous devez changer de chaine, le réflexe c’est d’utiliser d’abord la télécommande. Et si la zapette a perdue son combat contre le chien, alors plus le choix vous devez vous lever pour utiliser les boutons sur la TV. Oui, comme grande Mémé.

WordPress suit cette même logique. Le Thème Enfant c’est votre télécommande. Le thème parent c’est votre TV. On peut imaginer le rôle de fusible pour le thème Enfant, qui représente votre zapette (attendez tout va s’éclairer dans un instant).

WordPress vérifie d’abord le Theme Enfant (vous utilisez d’abord la télécommande) et applique les fonctionnalités existantes. S’il n’y en a pas, il utilise alors le Thème Parent (votre TV). Ce qui permet d’assurer une vie sereine à vos personnalisations de Thème. En bref, deux raisons incontestables d’utiliser les Thèmes Enfants : les mises à jour et l’organisation de vos modifications.

 

Mises à jour

Modifier un thème sans utiliser un Theme Enfant vous laisse 2 choix :

  • Soit vous ne faites aucune mise à jour du thème dans le futur
  • Soit vous faites les mises à jour et perdez tout les changements enregistrés auparavant

Avouez que perdre des minutes ou des heures à tout remettre en ordre, c’est vraiment navrant pour rester poli.

Et si vous avez la bonne idée de ne pas mettre à jour votre thème. Alors les hackers s’en frottent les mains. Les mises à jour existent pour combler des failles de sécurité. En gros, autant laisser votre nouvelle télé sur le siège de votre voiture, portes ouvertes et clés sur le contact.

Plus sérieusement, ne négligez surtout pas les mises à jour de thème ET d’extensions WordPress.

 

Organisation

En ajoutant du code à votre thème existant, vous nourrissez une base globale de code, composée de milliers de lignes. Les développeurs qui travaillent sur votre site (et bien-sur , vous même) auront bien du mal à remettre les mains dedans et retrouver vos changements. Plus de temps pour le développement = plus d’argent sur la facture finale.

Puisque le Thème Enfant est la modification d’un Thème Parent existants, il entraine un changement important même s’il ne contient que 50 lignes de codes.

 

Créer un Thème Enfant

Bonne nouvelle, c’est hyper simple. Vous pouvez même copier-coller et adapter rapidement l’exemple que je donne ci-dessous.

Pour créer le Thème Enfant de votre Thème, suivez les 3 étapes suivantes :

1 / Créer un nouveau dossier dans votre répertoire de thèmes. Si j’utilise le thème twentysixteen, alors je créé le dossier twentysixteen-child dans mon repertoire de thème comme ici : wp-content/themes/twentysixteen-child

 

2 / Créer une feuille de style. La nommer style.css et copier/coller le code suivant à l’intérieur :

/*
 Theme Name:   Twenty Sixteen Child
 Theme URI:    http://votresiteweb.com/Sixteen-child/
 Description:  Mon premier Thème Enfant, basé sur Twenty Sixteen
 Author:       Thibaut Soufflet
 Author URI:   http://thibautsoufflet.fr
 Template:     twentysixteen
 Version:      1.0.0
 Tags:         black, green, white, light, dark, two-columns, three-columns, left-sidebar, right-sidebar, fixed-layout, responsive-layout, custom-background, custom-header, custom-menu, editor-style, featured-images, flexible-header, full-width-template, microformats, post-formats, rtl-language-support, sticky-post, theme-options, translation-ready, accessibility-ready, responsive-layout, infinite-scroll, post-slider, design, food, journal, magazine, news, photography, portfolio, clean, contemporary, dark, elegant, modern, professional, sophisticated
 Text Domain:  twenty-sixteen-child
*/

Les deux lignes indispensables du code ci-dessus sont les lignes Theme Name (ligne 3) et Template (ligne 8). Theme Name indique à WordPress quel est le nom que vous donnez à votre thème enfant. Template dit à WordPress quel est le thème parent à lier. Le Text Domain (ligne 11) doit être unique pour votre thème et doit être utilisé si vous avez recours à des fonctions de traduction ou de création de Custom Post. Les Tags sont simplement une copie de ceux présents dans le style.css du thème parent.
3 / Au point actuel, votre Thème Enfant est prêt. Si vous l’activez et rechargez la page, tout le contenu sera bien affiché mais aucune personnalisation de style en vue.

Comme vous le savez maintenant, WordPress charge d’abord les fichiers du Thème Enfant et si le fichier n’existe pas, il retombe sur le fichier du Thème Parent. Hors notre Thème Enfant enfant contient désormais un fichier style.css,donc WordPress ne va plus chercher le fichier de style du Thème Parent. Et comme notre fichier style.css est vide, plus aucun style n’apparait à l’écran.

Pour être sûr que WordPress charge également le style.css du Thème Parent, créez un fichier functions.php et copier-coller le code suivant. Sauvegardez ensuite functions.php à la racine de votre Thème Enfant, exemple : wp-content/themes/twentysixteen-child

add_action( 'wp_enqueue_scripts', 'enqueue_parent_styles' );
function enqueue_parent_styles() {
    wp_enqueue_style( 'parent-style', get_template_directory_uri().'/style.css' );
}

Il est temps de rafraichir votre page et de constater avec émotion que tout est bien revenu. Il ne vous reste plus qu’à personnaliser votre site en utilisant le style.css de votre Thème Enfant.

En conclusion

En utilisant quelques copier-coller et en suivant ces étapes simple vous pouvez créer un environnement sécurisé et durables pour votre thème, ce qui vous évitera bien des prises de tête. Il peut être tentant d’utiliser l’éditeur de WordPress (Apparence > Editeur) mais bien souvent c’est la source de nombreux problèmes si vous n’utilisez pas de Thème Enfant.

Prenez quelques minutes pour suivre ce court tutoriel et vote site web et vos développeur vous remercierons. Si vous avez d’autres conseils et astuces pour créer un Thème Enfant, dîtes le en commentaire.

 

Tibow Webdesign vous propose aussi ses services de conseils et de création sur-mesure pour tous vos projets de site Internet et Boutique e-commerce. Devis et conseils gratuits ici.

Utiliser les fichiers SVG dans WordPress
Lightbox des images Produit ne s'ouvre pas - WooCommerce 3.0