skip to Main Content

Comment créer et personnaliser un thème enfant sur WordPress

Divi : le thème WordPress le plus facile à utiliser

Divi : Le meilleur thème WordPress de tous les temps !

Avec plus de 600.000 téléchargements, Divi est le thème WordPress le plus populaire au monde. Il est complet, facile à utiliser et livré avec plus de 62 templates gratuits. [ Recommandé ]

Qu’est-ce qu’un thème enfant et pourquoi est-il si important ?

Dans ce post, nous allons vous donner les réponses à ces questions et vous montrer étape par étape comment créer et personnaliser votre propre thème enfant à l’aide de plugins ou de code.

Si vous souhaitez apporter des modifications au thème de votre site WordPress,vous avez probablement vu des gens vous dire d’utiliser un thème enfant.

Mais qu’est-ce qu’un thème enfant, et pourquoi les thèmes enfants sont-ils si importants ?

Dans ce post, nous allons vous donner les réponses à ces questions avec une introduction aux thèmes enfant et comment ils sont parfaits pour vous. 

Ensuite, nous vous montrerons étape par étape comment créer et personnaliser votre propre thème enfant à l’aide de plugins ou de code.

Mais, si vous n’avez jamais installé WordPress découvrez Comment installer un blog WordPress en 7 étapes et Comment rechercher, installer et activer un thème WordPress sur votre blog

Et après revenons vers ce pourquoi nous sommes là.

Qu’est-ce qu’un thème WordPress enfant ?

Un thème enfant n’est pas un thème autonome. C’est un « enfant » d’un thème parent existant, d’où le nom.

Vous l’installerez à côté de votre thème parent, mais il vous donne une chance d’apporter en toute sécurité des modifications à votre thème parent sans avoir besoin de modifier le thème parent lui-même.

Le thème enfant tirera la plupart / tous ses paramètres de conception du thème parent. Toutefois, dans les situations où vous modifiez le thème enfant, cette modification remplacera les paramètres du thème parent.

Avantages d’un thème enfant

À ce stade, vous vous demandez peut-être :  pourquoi vous ne pouvez pas simplement apporter vos modifications directement au thème parent ?

La principale raison pour laquelle ce n’est pas une bonne idée est la mises à jour des thèmes WordPress.

Si vous souhaitez assurer la sécurité et le bon fonctionnement de votre site web WordPress, vous devez appliquer rapidement les mises à jour au fur et à mesure qu’elles sortent, y compris les mises à jour de votre thème WordPress.

Si vous personnalisez votre site Web en modifiant directement votre thème (sans thème enfant), ce qui signifie que vous remplacerez tous vos changements chaque fois que vous mettrez à jour le thème WordPress.

Cela signifie que vous :

Avec un thème enfant, vous pouvez apporter tous vos changements dans le thème enfant. Ensuite, vous serez en mesure de mettre à jour le thème parent sans perdre aucun de vos travaux.

Au-delà de vous aider à mettre à jour en toute sécurité, l’utilisation d’un thème enfant est également généralement pratique pour faire des personnalisations. Parce qu’il sépare tous vos changements en un seul endroit, il est facile de suivre toutes vos modifications et de les modifier au besoin.

Il est également facile d’aller à l’envers. Par exemple, si vous souhaitez cesser d’utiliser vos modifications et revenir au thème parent, il vous suffit de désactiver le thème enfant.

Certains thèmes WordPress utilisent même cette approche parent/enfant par défaut. Par exemple, si vous souhaitez utiliser le framework Genesis, vous aurez besoin à la fois du thème parent (le framework de base) et d’un thème enfant pour contrôler la conception.

Quand utiliser un thème enfant

À part quelques exceptions que nous allons énumérer ci-dessous, vous devez toujours utiliser un thème enfant si vous prévoyez de faire vos propres modifications sur un thème WordPress existant.

Lorsque vous n’avez pas besoin d’utiliser un thème enfant

En général, l’utilisation d’un thème enfant est une bonne pratique chaque fois que vous personnalisez votre thème WordPress.

Toutefois, il existe quelques exceptions à la règle où il pourrait y avoir une meilleure option que l’utilisation d’un thème enfant.

Tout d’abord, si vous voulez juste faire quelques modifications mineures CSS, il pourrait être exagéré de créer un thème enfant juste pour quelques réglages.

Au lieu de cela, vous pouvez ajouter votre CSS personnalisé à l’aide de la fonctionnalité CSS supplémentaire intégrée dans le Customizer WordPress. Ou, vous pouvez utiliser un plugin WordPress gratuit tel que Simple CSS.

Deuxièmement, si vous effectuez des modifications que vous souhaitez être indépendante du thème, un thème enfant pourrait ne pas être la meilleure option.

Par exemple, si vous enregistrez une taxonomie personnalisée ou un type de publication personnalisé, vous ne souhaitez probablement pas utiliser le fichier functions.php de votre thème enfant (parce que vous souhaitez les conserver même si vous changez de thème). Au lieu de cela, vous devriez simplement ajouter le code en dehors de votre thème avec un plugin tels que Code Snippets ou votre propre plugin personnalisé.

Comment créer un thème enfant sur WordPress

Maintenant que vous savez pourquoi les thèmes enfants sont importants, nous allons entrer dans la façon dont vous pouvez réellement créer un thème enfant pour votre site web WordPress.

Tout d’abord, si vous utilisez le thème Hello Elementor, nous avons déjà créé un thème enfant pour vous – vous n’avez pas besoin de le faire vous-même. Vous pouvez saisir le thème enfant Hello Elementor de WordPress.org. Vous pouvez l’installer comme n’importe quel autre thème WordPress (nous allons également vous montrer comment installer un thème enfant plus tard dans ce post).

Si vous utilisez un thème WordPress différent, il vaut toujours la peine de jeter un rapide coup d’œil sur Google pour voir si le développeur de votre thème WordPress fournit un thème enfant. Par exemple, Astra, GeneratePress et OceanWP disposent tous d’outils/fichiers pour vous aider à télécharger un thème enfant.

Si votre thème WordPress n’a pas déjà de thème enfant, vous pouvez créer un thème enfant pour n’importe quel thème WordPress :

  1. Utilisez un plugin WordPress gratuit générateur de thème enfant.
  2. Créez manuellement votre propre thème enfant.

Nous vous montrerons comment exécuter les deux méthodes.

Comment utiliser un plugin WordPress de thème enfant

Un plugin de générateur de thème enfant vous permet de créer un thème enfant sans quitter votre tableau de bord WordPress.

L’option la plus populaire ici est le plugin gratuit child theme configurator, qui est actif sur plus de 300.000 sites web.

Child Theme Configurator vous aide non seulement à créer les fichiers de thème enfant, mais il analysera également le thème que vous utilisez et les feuilles de style du thème et des polices au besoin.

Il inclut également d’autres fonctionnalités utiles si vous essayez de créer un thème enfant sur un site web où vous avez déjà ajouté du contenu. Par exemple, il peut copier vos widgets existants et les options du customizer sur le thème enfant.

Toutefois, si vous prévoyez d’utiliser le plugin sur un site Webopérationnel, nous vous recommandons de faire une sauvegarde complète avant de procéder. Ou, idéalement, tout mettre en place sur un site web de démo.

Une fois que vous avez votre sauvegarde prête, commencez par installer et activer le plugin gratuit Child Theme Configurator à partir de WordPress.org. Ensuite, accédez au menu Outils → Child Themes pour créer votre thème enfant.

Dans la liste déroulante Sélectionner un thème parent, sélectionnez le thème pour lequel vous souhaitez créer votre thème enfant. Ensuite, cliquez sur Analyze:

Créez Facilement votre site Web avec Elementor

Elementor vous permet de créer facilement n'importe quel design de site Web avec un look professionnel. Arrêtez de payer cher pour ce que vous pouvez faire vous-même. [ Gratuit ]

Le plugin analysera ensuite le thème parent pour toute dépendance.

Une fois cela fait, vous verrez quelques options supplémentaires pour configurer la façon de créer votre thème enfant. Si vous n’êtes pas sûr de ce que signifie un paramètre spécifique, vous pouvez simplement le laisser comme valeur par défaut :

 

Une fois que vous avez terminé de faire vos choix, cliquez sur le bouton en bas pour créer un nouveau thème enfant.

Et c’est tout ! Le plugin créera ensuite le thème enfant pour vous. Toutefois, il n’activera pas ce thème enfant.

Pour l’activer :

  • Aller à Apparence → Thèmes.
  • Prévisualiser à quoi ressemble votre site web avec ce thème enfant (pour vous assurer qu’il fonctionne – si votre site web semble étrange, c’est probablement à cause d’un problème CSS).
  • Activez votre thème enfant comme vous le feriez pour n’importe quel autre thème WordPress. Assurez-vous de laisser votre thème parent installé, cependant.

Une fois que vous avez activé votre thème enfant, le plugin Child Theme Configurator propose également d’autres outils utiles pour vous aider à gérer le thème enfant. Par exemple, si vous accédez à l’onglet Files des paramètres du plugin, vous pouvez afficher tous les fichiers associés dans le thème parent et le thème enfant.

Ensuite, vous pouvez copier des fichiers du thème parent au thème enfant.

Par exemple, si vous souhaitez effectuer quelques modifications sur single.php, vous pouvez copier ce fichier sur le thème enfant afin que vous puissiez le modifier en toute sécurité :

Vous trouverez également beaucoup d’autres outils pour vous aider à travailler avec du CSS.

Nous expliquerons pourquoi ces outils sont utiles plus tard.

Comment créer manuellement un thème enfant

Pour cette section, nous supposerons que vous en savez un peu plus sur PHP et CSS. Si vous vous sentez dépassé par les instructions ici, nous vous recommandons d’utiliser le plugin gratuit de la section précédente.

Pour créer manuellement un thème enfant, vous devez créer deux fichiers (ce sont les stricts minimums pour un thème enfant) :

  • style.css – au début, tout ce que vous devez ajouter est un code boilplate.
  • functions.php – cela vous permet de charger la feuille de style du thème parent. Sans cela, votre thème enfant ne serait pas en mesure d’appliquer le CSS de votre thème parent, ce qui rendrait votre site web super laid !

style.css

Tout d’abord, créez un fichier nommé style.css et ajoutez le code suivant :

First, create a file named style.css and add the following code:

/*

Theme Name: Hello Elementor Child

Theme URI: https://github.com/elementor/hello-theme/

Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team

Author: Elementor Team

Author URI: https://elementor.com/

Template: hello-elementor

Version: 1.0.1

Text Domain: hello-elementor-child

License: GNU General Public License v3 or later.

License URI: https://www.gnu.org/licenses/gpl-3.0.html

*/

Assurez-vous de remplacer tout ce qui vient après les deux points avec vos informations réelles :

  • Nom du thème – nom de votre thème enfant.
  • Thème URI – le site Web de votre thème et sa documentation.
  • Description – une courte description du thème.
  • Auteur – le nom de l’auteur du thème.
  • Auteur URI: – le site web de l’auteur thème.
  • Template – nom du dossier de votre thème parent (tel que nommé à l’intérieur de votre dossier wp-content/themes). C’est la ligne la plus importante; votre thème enfant ne fonctionnera pas sans cela.
  • Version – numéro de version de votre thème enfant.
  • Domaine de texte – ceci est utilisé pour l’internationalisation. Vous pouvez simplement ajouter « enfant » à la fin du nom du template.
  • Licence – laissez cela comme valeur par défaut.
  • Licence URI – laissez cela comme valeur par défaut.

En excluant la ligne Template, ce n’est pas vraiment important ce que vous entrez, alors ne stressez pas trop. Assurez-vous simplement d’entrer correctement le nom du dossier de votre thème parent pour le template.

Si vous souhaitez ajouter vos propres styles personnalisés à l’avenir, vous pouvez l’ajouter à cette feuille de style sous le code boilplate.

functions.php

Ensuite, vous devez créer le fichier functions.php pour votre thème enfant. Encore une fois, c’est ce qui vous permet de charger la feuille de style CSS complète de votre thème parent.

Dans le fichier functions.php, ajoutez le code suivant :

<?php

/* Function to enqueue stylesheet from parent theme */

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

Télécharger des fichiers sur le site web WordPress

Une fois que vous avez vos fichiers style.css et functions.php, vous devez les télécharger sur votre site web WordPress comme un nouveau thème.

Pour le faire, connectez-vous à votre site web WordPress à l’aide de FTP.

Ensuite, accédez au répertoire de thèmes de votre site web (wp-content/themes)et créez un nouveau dossier pour votre thème enfant.

Par exemple, si le dossier de votre thème parent est hello-elementor, vous pouvez nommer le dossier de thème enfant hello-eletor-child pour vous aider à vous en souvenir.

Ensuite, téléchargez votre fichier style.css et functions.php à l’intérieur de ce dossier :

Une fois que vous avez téléchargé les deux fichiers, vous pouvez aller à Apparence → Thèmes et activer votre thème enfant comme vous le feriez avec n’importe quel autre thème WordPress.

Comment installer un thème WordPress enfant

Nous avons abordé certains de ces aspects ci-dessus dans les méthodes spécifiques, mais nous allons passer par la façon d’installer un thème enfant WordPress une fois de plus.

Cela sera également utile si vous avez téléchargé un thème enfant à partir du  site web du développeur de votre thème, plutôt que de le créer vous-même.

Vous pouvez installer un thème enfant WordPress comme vous le feriez avec n’importe quel autre thème WordPress :

  • Accédez à Apparence → Thèmes dans votre tableau de bord WordPress.
  • Cliquez sur Ajouter un nouveau.
  • Téléverser le fichier ZIP du thème enfant.

Pendant le processus d’installation, WordPress détecte que vous téléchargez un thème enfant et vérifie que le thème parent existe :

Une fois que vous avez téléchargé le fichier, assurez-vous de l’activer.

Rappelez-vous, pour que votre thème enfant fonctionne, vous devez installer à la foisle thème parent et le thème enfant.

Votre thème enfant doit être votre thème actif, mais vous devez toujours avoir votre thème parent installé.

Voici à quoi il devrait ressembler :

  1. Le thème enfant est le thème actif
  2. Le thème parent est toujours installé, mais pas actif

Comment personnaliser un thème enfant

Tout comme avec la personnalisation d’un thème WordPress régulier, vous avez plusieurs options pour « personnaliser » un thème enfant.

Cherchez-vous les meilleurs thèmes et plugins WordPress ?

Téléchargez les meilleurs plugins et thèmes WordPress sur Envato et créez facilement votre site web. Déjà plus de 49.720.000 de téléchargements. [EXCLUSIF]

Pour être plus précis, vous n’êtes pas vraiment entrain de personnaliser le thème enfant – vous utilisez le thème enfant pour personnaliser le thème existant (parent).

Tout d’abord, nous allons vous montrer quelques façons dont vous pouvez utiliser le code pour personnaliser votre thème enfant. Ensuite, nous partagerons une façon plus simple de personnaliser les choses avec Elementor Theme Builder.

Personnaliser un thème enfant avec du code

Si vous souhaitez personnaliser votre thème enfant avec du code, vous devrez avoir de bonnes connaissances en CSS, HTML et PHP.

Voici quelques-unes des choses que vous pouvez faire :

Ajouter des CSS personnalisés

Pour personnaliser votre thème enfant avec du CSS, vous pouvez l’ajouter directement au fichier style.css de votre thème enfant.

Ajoutez du CSS sous le code existant en haut du fichier.

Tout CSS que vous ajoutez à votre thème enfant remplacera celui de votre thème parent tant que vous utilisez les mêmes sélecteurs.

Remplacer les templates existants

Si vous souhaitez remplacer les templates de votre thème parent, vous pouvez :

  • Copiez le fichier template de votre thème parent sur le thème enfant.
  • Modifiez le fichier template dans votre thème enfant.

Par exemple, si vous souhaitez modifier single.php, vous copiez d’abord le fichier single.php de votre thème parent sur le thème enfant (en vous assurant de préserver la même structure).

Ensuite, vous pouvez modifier le code dans la version de votre thème enfant de single.php.

Remarque : WordPress utilisera le template de votre thème enfant tant qu’il a le même nom. Pour cette raison, vous quasiment masqué le template existant dans le thème parent.

Si vous utilisez le plugin Child Theme Configurator que nous avons mentionné ci-dessus, il peut vous aider à copier des fichiers sur le thème enfant sans quitter votre tableau de bord WordPress.

Ajouter de nouveaux templates

En plus de copier et de modifier les templates existants de votre thème parent, vous pouvez également créer de nouveaux templates personnalisés dans le thème enfant.

Par exemple, si vous souhaitez créer un modèle pour un type de publication personnalisé que vous avez ajouté,vous pouvez ajouter ce templates dans votre thème enfant.

Personnaliser un thème enfant avec le générateur de thème Elementor

Si vous n’êtes pas familier, Elementor Theme Buildervous permet de personnaliser une partie ou la totalité de votre thème WordPress à l’aide d’une interface visuelle.

Avec Elementor Pro et Theme Builder, vous pouvez créer des templates personnalisés pour les templates de votre site web :

  • En-tête
  • Pied de page
  • Single (p. ex. un seul article de blog ou une page)
  • Archives (p. ex. la page qui répertorie tous vos articles de blog)

Ces templates fonctionneront à la fois avec le thème enfant et sur le thème parent.

Avec Elementor Theme Builder, vous n’aurez pas besoin de travailler directement avec le code. Il n’y a pas d’ajout de CSS personnalisé ou de copie de vos fichiers modèle PHP – vous faites tout avec le glisser-et-déposer.

Par exemple, supposons que vous souhaitez personnaliser l’en-tête de votre thème enfant. Au lieu d’avoir besoin de copier votre fichier header.php sur votre thème enfant, puis modifier le PHP, vous pouvez simplement concevoir un nouvel en-tête à l’aide de l’interface visuelle et de glisser-déposer d’Elementor. Ensuite, vous pouvez appliquer cet en-tête partout sur votre site web ou tout simplement à des parties spécifiques de votre site internet.

Si vous ne connaissez pas les CSS, HTML et PHP, cette approche sans code vous permet de personnaliser votre thème enfant. Et même si vous le faites, cette approche visuelle peut toujours vous faire gagner beaucoup de temps qu’avec le PHP dans vos fichiers templates.

Lorsque vous créez un nouveau template avec Elementor Theme Builder, vous pourrez choisir le type de modèle. Par exemple, un en-tête.

Ensuite, vous pouvez soit partir d’une ardoise vierge, soit choisir l’un des modèles d’Elementor Pro :

À partir de là, vous pouvez utiliser les options par glisser-déposer de barre latérale pour contrôler l’apparence de votre en-tête :

Une fois terminé, vous pouvez choisir exactement où vous souhaitez utiliser ce modèle d’en-tête :

Comment supprimer un thème enfant sur WordPress

Si vous voulez arrêter d’utiliser votre thème enfant, vous pouvez le désactiver comme vous le feriez avec un thème WordPress régulier.

C’est :

  • Aller à Apparence → Thèmes.
  • Activez un autre thème. Soit le thème parent ou un tout nouveau thème WordPress.

N’oubliez pas que si vous désactivez le thème enfant et que vous revenez à votre thème parent, toutes les modifications que vous avez ajoutées via votre thème enfant ne seront plus là.

Au lieu de cela, vous serez de retour à la conception de votre thème parent.

Commencez à utiliser un thème enfant WordPress

Un thème enfant vous aide à apporter des modifications en toute sécurité à votre thème WordPress.

Votre thème enfant héritera de tous ses styles à partir de votre thème parent, mais toutes les modifications que vous apporterez au thème enfant remplaceront le thème parent. Cela signifie que vous pouvez mettre à jour votre thème parent en toute sécurité sans perdre les modifications que vous avez apportées dans le thème enfant.

Pour commencer à utiliser un thème enfant WordPress, vous pouvez :

À partir de là, vous pouvez personnaliser votre thème enfant à l’aide des CSS, HTML et PHP. Vous pouvez également ignorer le code et utiliser Elementor Theme Builder pour personnaliser votre thème à l’aide d’une interface visuelle par glisser-déposer.

Découvrez aussi quelques thèmes et plugins WordPress premium  

Vous pouvez utiliser d’autres plugins WordPress pour donner une apparence moderne et pour optimiser la prise en main de votre blog ou site web.

Nous vous proposons donc ici quelques plugins WordPress premium qui vous aideront à le faire.

1. AP Pricing Tables

AP Pricing Table est un plugin WordPress premium qui permet de créer facilement des grilles de prix riche en fonctionnalités et dotées d’interfaces intuitives. Il offre 35 modèles prédéfinis et un nombre illimité d’options.

Avec ce plugin WordPress facile à utiliser, concevoir un tableau de prix époustouflant en quelques clics sera très facile. Il vous permet de créer de manière illimitée des grilles de prix en offrant la possibilité d’ajouter des lignes et des colonnes, de définir la bordure des colonnes, l’espace entre les colonnes, la largeur des colonnes, et bien plus encore.

Lisez aussi Comment personnaliser le bouton « Ajouter au Panier » de WooCommerce

Ce plugin vous permet également d’ajouter du contenu audio, vidéo et Google Map.

TéléchargerDémo | Hébergement Web

2. wp Page builder

WordPress Page Builder est le générateur ultime pour votre site web WordPress qui est fourni avec d’excellents outils pour générer n’importe quelle publication personnalisée, taxonomie personnalisée ou metabox personnalisée. 

Créez Facilement votre Boutique en ligne

Téléchargez gratuitement WooCommerce, le meilleurs plugins e-commerce pour vendre vos produits physiques et numériques sur WordPress. [Recommandé]

Comme fonctionnalités il possède entres autres : un type de publication personnaliséCPT, une taxonomie personnalisée, des champs personnalisés avancés, la fonctionnalité glisser-déposer, la localisation Google Map prise en charge, les champs répétables pris en charge  également et bien plus encore.

Télécharger | Démo | Hébergement Web

3. Rankie

Rankie est un module WordPress très pratique conçu dans le but de vérifier de façon régulière les classements WordPress sur Google tout en surveillant de près la position de chaque mot-clé.

En tant que plugin de suivi de classement, Rankie mettra à jour le positionnement des mots-clés au quotidien et générera des rapports précis.

 Lisez aussi nos 6 questions régulières en rapport avec le SEO et les redirections

Il intègre également un puissant outil de recherche qui génère des listes précieuses de mots clés. Google l’utilise déjà pour la recherche.

Télécharger | Démo | Hébergement Web

Ressources recommandées

Découvrez d’autres ressources recommandées qui vous accompagneront dans la création et la gestion de votre site web.

Conclusion

Voilà ! C’est tout pour ce tutoriel. Avez-vous encore des questions sur l’utilité d’un thème enfant sur WordPress ?  Faites-nous savoir dans la section commentaires et nous allons essayer d’aider !

Cependant, vous pourrez aussi consulter nos ressources, si vous avez besoin de plus d’éléments pour mener à bien vos projets de création de sites internet, en consultant notre guide sur la création de blog WordPress.

N’hésitez pas à le partager avec vos amis sur vos réseaux sociaux préférés

…  

Cet article comporte 0 commentaires

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.

Back To Top
0 Partages
Partagez
Tweetez
Enregistrer