Comment créer un thème enfant dans WordPress (Programmatiquement et plugin)
Publié: 2020-06-11Vous souhaitez personnaliser le design de votre site et impressionner vos visiteurs ? Dans ce guide, nous allons vous montrer comment créer un thème enfant dans WordPress à la fois avec un peu de codage et avec des plugins .
La personnalisation est un facteur important dans la conception de votre site Web. Vous voulez vous assurer que vous faites tout votre possible pour aider votre site Web à se démarquer. Et bien que vous puissiez utiliser un thème WordPress avec un design qui répond à vos besoins, vous pouvez faire beaucoup mieux si vous ajoutez un peu de saveur aux paramètres par défaut. Qu'il s'agisse de modifier quelques paramètres d'arrière-plan ou de configurer un méga menu pour votre site.
Cependant, la personnalisation de votre site Web peut être une tâche ardue, surtout si vous modifiez une conception qui a bien fonctionné pour vous. C'est pourquoi si vous souhaitez personnaliser votre thème WordPress, nous vous recommandons vivement d'utiliser un thème enfant. Et c'est ce que le tutoriel d'aujourd'hui vous apporte : un guide convivial pour les débutants sur la façon de créer un thème enfant dans WordPress .
Qu'est-ce qu'un thème enfant ?
En termes simples, un thème enfant est un thème supplémentaire que vous créez et qui hérite de la conception et de l'apparence d'un thème parent existant. Le thème enfant hérite également de toutes les fonctions et fonctionnalités du thème parent, que vous pouvez également modifier.
Mais s'il a le même design et les mêmes fonctions que le thème parent, pourquoi avez-vous besoin d'un thème enfant ? Il y a certains avantages à créer des thèmes enfants dans WordPress. D'une part, vous pouvez séparer la personnalisation du thème parent et les personnaliser individuellement. Par exemple, vous pouvez apporter des modifications au code du thème enfant et cette personnalisation restera distincte du thème parent, de sorte qu'aucun des fichiers des thèmes parents ne sera affecté.
De plus, un avantage clé de l'utilisation d'un thème enfant est que vous pouvez conserver toutes vos personnalisations même après la mise à jour du thème parent. Un énorme problème avec la personnalisation de votre thème parent est que, lorsque vous mettez à jour le thème, ces modifications sont perdues. Ainsi, avec un thème enfant, que vous changiez de styles, de modèles ou de fonctions, les modifications que vous apportez aux fichiers de thème restent enregistrées même après vos mises à jour.
Les développeurs peuvent également utiliser des thèmes enfants pour créer rapidement de nouvelles conceptions de thème. En utilisant des thèmes enfants, ils n'ont pas à repartir de zéro et ils peuvent choisir de modifier les thèmes parents pour s'adapter également à leurs conceptions de thème.
Avantages des thèmes enfants
Donc pour résumer, si vous souhaitez une meilleure flexibilité pour vos personnalisations de thème, utiliser un thème enfant est une excellente idée. Certains des principaux avantages de l'utilisation de thèmes enfants sont :
- Toute personnalisation que vous apportez au thème enfant reste séparée du parent et n'est donc pas annulée ou perdue après les mises à jour.
- Il n'y a aucun risque de casser accidentellement votre thème principal ou ses fichiers.
- Les développeurs peuvent utiliser des thèmes enfants et des thèmes parents pour gagner du temps de développement en créant des conceptions de thème flexibles et des cadres de thème.
- Les thèmes enfants sont très légers et vous pouvez toujours annuler les modifications en désactivant ou en supprimant simplement le thème enfant.
Maintenant que nous avons expliqué pourquoi vous devriez envisager d'utiliser un thème enfant, voyons comment vous pouvez créer un thème enfant dans WordPress.
Comment créer un thème enfant dans WordPress
Il existe 2 manières principales de créer un thème enfant dans WordPress :
- Utilisation d'un plug-in
- Par programmation
Les deux méthodes ont leurs avantages et leurs inconvénients, alors utilisez celle qui convient le mieux à vos compétences et à vos besoins.
1) Créer un thème enfant à l'aide d'un plugin WordPress
Créer un thème enfant à l'aide d'un plugin est le moyen le plus simple et le plus convivial pour les débutants. Tout ce que vous avez à faire est d' installer un plugin, de cliquer sur quelques boutons ici et là, et vous êtes prêt à partir. Et il existe un grand nombre de plugins de thème enfant qui sont très faciles à utiliser.
Pour ce guide, nous utiliserons le plugin Child Theme Generator. Si vous souhaitez jeter un œil à d'autres options, nous vous recommandons de consulter notre liste des meilleurs plugins WordPress Child Theme.
Après avoir décidé quel module complémentaire vous préférez, vous devez l'installer. Alors, ouvrez votre tableau de bord WP Admin, survolez Plugins et cliquez sur Ajouter nouveau . Ensuite, utilisez la barre de recherche en haut à droite pour rechercher le plugin que vous êtes sur le point d'installer. Nous allons installer Child Theme Generator .
Ensuite, installez le plugin que vous voulez. Une fois l'installation terminée, appuyez sur Activer. Alternativement, vous pouvez également activer/désactiver vos plugins en allant dans Plugins > Plugins installés dans votre barre latérale.
Comment créer un thème enfant avec le plugin Child Theme Generator
Une fois que vous avez installé et activé le plugin, ouvrez l'interface du plugin en cliquant sur Paramètres > Child-Theme Gen.
Ensuite, sous l'onglet Créer un nouveau , vous pouvez renseigner divers détails sur votre thème enfant.
Choisissez simplement le thème que vous souhaitez comme thème parent, ajoutez l'en-tête de votre thème, la description, l'URL du thème enfant, l'auteur et d'autres détails sur le thème. Ici, vous pouvez également choisir d'ajouter une licence GNU GPL avec vos fichiers de thème.
Une fois que vous avez terminé, cliquez sur Créer un nouveau thème enfant et un thème enfant sera créé en fonction des détails de votre saisie.
Ensuite, vous pouvez le modifier ou l'activer en accédant à Apparence> Thèmes, en sélectionnant votre thème enfant nouvellement créé et en l'activant .
C'est ça! Vous venez de créer votre thème enfant ! Vous pouvez maintenant le personnaliser et apporter toutes les modifications souhaitées.
Voyons maintenant comment vous pouvez créer un thème enfant par programmation sans utiliser de plugin.
2) Créer un thème enfant par programmation
Si vous ne souhaitez installer aucun plugin, vous pouvez créer un thème enfant WordPress par programmation . Cela nécessite un peu de codage, mais c'est toujours assez facile, même pour les débutants. Tout ce que vous avez à faire est de créer le dossier de votre thème enfant et de créer quelques fichiers à l'intérieur.
Activer le thème parent
Donc, tout d'abord, vous devez activer le thème parent à partir duquel vous souhaitez créer un thème enfant sur votre site Web.
Ensuite, vous devez utiliser le panneau de contrôle d'hébergement Web de votre site Web et accéder aux dossiers de votre serveur. Vous devrez utiliser le gestionnaire de fichiers ou le client FTP de votre panneau pour ouvrir le dossier de thèmes de votre site. C'est sous public_html/wp-content/themes .
Pas
Une fois que vous avez localisé le dossier du thème, suivez ces étapes simples :
1) Créez un dossier dans le répertoire des thèmes avec le nom de votre thème enfant. Pour l'instant, nous utiliserons Demo Child Theme . Vous pouvez également utiliser le nom de votre thème parent, suivi d'un suffixe enfant, pour faciliter sa gestion. Par exemple, Flash-Child ou Blacklite-Child .
2) Ensuite, créez un fichier style.css et copiez le code suivant dans le fichier style.CSS.
/* Nom du thème : Thème enfant de démonstration Modèle : Blacklite URL du thème : Quadlayers.com/blog Description : Thème enfant de démonstration Auteur du thème : Quadlayers URL de l'auteur : Qualayers.com Version : 1.0.0 */
C'est ce qu'on appelle une feuille de style. Pensez à modifier ces informations pour votre thème enfant. Ajoutez simplement les informations après les deux-points pour chaque ligne du code. Les parties les plus importantes ici sont le nom du thème qui doit être unique et le nom du modèle que vous utilisez car vous devez désigner le thème parent que vous utilisez.
3) Ensuite, créez un fichier nommé Functions.php dans le dossier du thème enfant et copiez le code suivant :
<?php add_action( 'wp_enqueue_scripts', 'enqueue_parent_styles' ); fonction enqueue_parent_styles() { wp_enqueue_style( 'parent-style', get_template_directory_uri().'/style.css' ); } ?>
4) Enregistrez les deux fichiers, puis accédez à votre Tableau de bord > Apparence > Thèmes. Vous verrez un nouveau thème enfant avec la description que vous avez insérée dans votre dossier Style.CSS !
Et c'est ainsi que vous créez un thème enfant dans WordPress par programmation. Voyons maintenant comment le personnaliser.
Comment personnaliser votre thème enfant WordPress ?
Dans cette section, nous verrons ce que vous pouvez faire pour personnaliser l'apparence de votre thème enfant à un niveau plus profond. D'une part, modifions les paramètres de police et la couleur d'arrière-plan en utilisant un peu de CSS.
Personnalisez votre thème CSS
Tout d'abord, accédez à Apparence > Personnaliser pour ouvrir votre personnalisateur de thème. Ensuite, cliquez sur CSS supplémentaire dans le menu de la barre latérale.
Ici, vous pouvez ajouter des codes CSS qui écraseront directement les paramètres de votre thème. Par exemple, vous pouvez ajouter ce petit code :
p { couleur : gris ; } p { famille de polices : Helvetica ; taille de police : 18 px ; }
Et au fur et à mesure que vous insérez ce petit extrait de code, vous verrez les changements sur le personnalisateur Live. Nous avons besoin d'un peu plus de couleur, alors changeons la couleur d'arrière-plan de la barre de widgets de votre site :
.widget { arrière-plan : #00FFFF ; rembourrage : 25px ; }
Maintenant, ajoutons une ligne de code supplémentaire pour supprimer le pied de page de copyright "Powered by WordPress":
.site-info { display: none; }
Et voilà, vous avez personnalisé votre thème enfant avec un peu de CSS. Cela ne fait qu'effleurer la surface de ces modifications. Vous pouvez faire beaucoup plus.
Personnalisez votre fichier Theme Functions.php
Vous pouvez personnaliser directement vos fichiers de thème en allant dans Apparence > Éditeur de thème . Ensuite, cliquez sur votre fichier Functions.php pour ajouter des fonctions personnalisées à votre thème.
Par exemple, pour désactiver le clic droit sur votre site Web, ajoutez ces lignes de code à votre fichier Functions.php :
function votre_fonction() { ?> <script> jQuery(document).ready(fonction(){ jQuery(document).bind("contextmenu",function(e){ retourner faux ; }); }); </script> <?php } add_action('wp_footer', 'votre_fonction');
Cliquez ensuite sur Mettre à jour le fichier.
Enfin, si vous gâchez quelque chose, vous pouvez simplement supprimer votre thème enfant, en créer un nouveau, puis recommencer à zéro sans affecter votre thème parent.
Conclusion
Dans l'ensemble, la création et la personnalisation de thèmes enfants ouvrent une toute nouvelle voie de modifications de thème pour chaque type d'utilisateur WordPress. La meilleure chose à ce sujet est la flexibilité qu'il offre car vous pouvez annuler tout ce qui aurait pu gâcher votre thème. De plus, toutes vos personnalisations restent séparées du thème parent et ne sont pas perdues après les mises à jour. Nous vous encourageons donc vivement à créer un thème enfant et à jouer avec pour améliorer votre site.
Cela peut sembler compliqué, mais ce n'est pas le cas. Il suffit d'ajouter un peu de code à vos fichiers de thème et de gérer quelques dossiers.
Cependant, tous les utilisateurs ne trouveront peut-être pas facile de créer et de construire des thèmes enfants par programmation, en particulier les débutants. Si c'est votre cas, vous pouvez utiliser un plugin pour créer votre thème. Si vous rencontrez des problèmes à tout moment, n'hésitez pas à nous laisser un commentaire, et nous y reviendrons.
Enfin, si vous souhaitez personnaliser encore plus votre thème, vous pouvez consulter nos guides sur la modification des pieds de page et la personnalisation des en-têtes dans WordPress .