Créer et personnaliser un thème enfant WordPress
Publié: 2020-09-29Si vous souhaitez apporter des modifications à votre thème WordPress, vous avez probablement entendu dire qu'un bon moyen de le faire est de créer et de personnaliser un thème enfant WordPress . Mais savez-vous ce qu'est un thème enfant et pourquoi il est bon de les utiliser ? Sinon, vous êtes au bon endroit.
Thème enfant WordPress
Avoir un thème enfant implique qu'il y a aussi un thème parent. Une relation parent-enfant est quelque chose dont vous avez entendu parler si vous connaissez un peu le codage. En ce qui concerne WordPress, en particulier, nous avons une relation parent-enfant dans les types de publication personnalisés, par exemple. La classe ou le thème d'un enfant est quelque chose qui a les caractéristiques de son parent mais peut avoir des caractéristiques supplémentaires qui le rendront différent de son parent. Lorsque l'on parle de thèmes, un thème enfant est installé à côté de l'heure parent. Un thème enfant nous permet de changer les thèmes parents, mais de manière sécurisée, sans éditer directement le thème parent . Fondamentalement, un thème enfant aura l'essentiel de sa conception en définissant le même thème que le thème parent. Mais, si vous y apportez des modifications, ces modifications remplaceront les paramètres initiaux.
Raisons d'utiliser un thème enfant
Au cas où vous vous demanderiez pourquoi ne pas apporter des modifications directement au thème parent, nous l'expliquerons tout de suite. La principale raison pour laquelle ce n'est pas une bonne idée de le faire est à cause des mises à jour du thème. Pour que votre site Web fonctionne correctement, vous souhaitez appliquer les mises à jour . Cependant, si vous personnalisez le thème parent, vous perdrez toutes vos modifications à chaque mise à jour de votre thème, car les modifications seront écrasées.
Comment fonctionnent les thèmes enfants WordPress
Un thème enfant est stocké dans un répertoire séparé du thème parent. Chaque fois a ses propres fichiers style.css et functions.php. Bien que vous deviez avoir au moins deux fichiers dans le répertoire du thème enfant, pour qu'il fonctionne correctement, vous pouvez également ajouter d'autres fichiers. Les deux fichiers minimaux peuvent vous aider à modifier le style, le codage, les scripts et les paramètres de mise en page. Lorsqu'un utilisateur visite votre site Web, WordPress charge le thème enfant, puis remplit les styles et fonctions manquants en utilisant une partie du thème parent. Cela vous permet de tirer le meilleur parti de votre thème enfant et de le personnaliser, sans sacrifier les fonctionnalités de base du thème parent.
Comment créer un thème enfant
Il existe plusieurs façons de créer un thème enfant. Vous pouvez le faire manuellement, en utilisant un client FTP ou un répertoire de fichiers, ou vous pouvez créer un thème enfant en utilisant un plugin ou un générateur en ligne.
Manuellement
Pour créer manuellement un thème enfant, vous devrez utiliser un client FTP ou un gestionnaire de fichiers. Notez également que nous allons créer ici un fichier style.css basé sur le thème Twenty Seventeen.
- Via un client FTP ou un gestionnaire de fichiers, accédez à votre dossier public_html > wp-content > themes
- Ici, vous devez créer un nouveau dossier. Les conventions disent que vous devez nommer ce dossier, avec le nom du thème parent, mais ajouter -child comme suffixe. Ici, le nom du nouveau dossier sera vingt-sept-enfant.
- Créez un fichier style.css dans le dossier et ajoutez-y ce code :
/* Theme Name: Twenty Twenty Child Theme URL: http://yourdomain.com Description: Twenty Twenty Child Theme Author: Your Name Author URL: http://yourdomain.com Template: twentytwenty Version: 1.0.0 Text Domain: twentytwenty-child */- Ajustez les valeurs si nécessaire. Portez une attention particulière à la ligne Template, car elle indique à WordPress à quel thème parent votre thème enfant est lié. Une fois terminé, enregistrez vos modifications et fermez.
- À l'aide d'un éditeur de texte, créez un autre fichier nommé functions.php, mais ne copiez pas le code du thème parent. Copiez et collez ce code dans le fichier vide :
<?php add_action( 'wp_enqueue_scripts', 'enqueue_parent_styles' ); function enqueue_parent_styles() { wp_enqueue_style( 'parent-style', get_template_directory_uri().'/style.css' ); } ?>- Après avoir enregistré et fermé ce fichier, visitez votre site Web et accédez à Apparence> Thème. Activez le thème enfant et vous remarquerez qu'il ressemble à son thème parent.
Utiliser un plugin de thème enfant
L'utilisation d'un plugin de thème enfant peut être plus facile et plus intuitive. Voici quelques-uns des plugins que vous pouvez utiliser, par exemple, Child Theme Generator, Child Theme Configurator ou Child Theme Wizard. Gardez à l'esprit que l'utilisation de plugins nécessite également certaines connaissances. Par exemple, vous devrez peut-être désactiver un plugin, sans accéder à votre zone d'administration, car il peut arriver un moment où vous n'aurez plus cet accès. Et il faut une certaine habileté pour le faire. Cependant, dans l'ensemble, les plugins sont généralement faciles à utiliser, alors n'ayez pas peur de les utiliser.
Utiliser un générateur en ligne
L'utilisation d'un générateur de thème enfant en ligne rend ce processus encore plus facile. Il vous suffit d'aller sur https://childtheme-generator.com et de suivre les étapes. Lorsque vous créez et téléchargez le thème, accédez à Apparence> Thème et téléchargez et activez votre thème enfant.
Comment personnaliser le thème enfant
Afin de personnaliser votre thème enfant, vous devez savoir comment inspecter les éléments de la page Web et comprendre les règles CSS de base. Afin de personnaliser votre thème enfant, depuis le thème enfant actif, allez dans Personnaliser>CSS supplémentaires.
Changer la couleur de fond
Le bon arrière-plan joue un rôle important dans l'apparence du site Web. Bien que vous puissiez ajouter une image d'arrière-plan dans WordPress, nous ne parlerons ici que de la modification de la couleur d'arrière-plan de votre thème enfant. Pour ce faire, ajoutez cette règle CSS :
.site-content-contain {
couleur de fond : #DEF0F5 ;
position : relative ;
}
N'oubliez pas que vous pouvez modifier la valeur après la couleur d'arrière-plan. Cette valeur spécifique est une valeur de bleu clair.
Changer la couleur de la barre latérale
Voici la règle CSS que vous devez insérer pour changer la couleur de la barre latérale :
.widget {
arrière-plan : #B9EBFA ;
rembourrage : 25px ;
Personnaliser les types de police, la taille et la couleur
Pour modifier le type de police, la taille et la couleur de votre thème enfant WordPress, insérez le code ci-dessous. Notez que la balise p représente le texte du paragraphe.
p {
couleur sarcelle;
}
p {
famille de polices : Georgia ;
taille de police : 18 px ;
}
Vous pouvez également modifier le texte d'autres parties, comme le titre et l'en-tête, mais vous devez inspecter les éléments, localiser le lien de style CSS, le copier et modifier les valeurs selon vos besoins.
Conclusion
Si vous souhaitez personnaliser un thème, sans modifier directement son code, les thèmes enfants sont un excellent moyen de le faire. Avec ce guide, vous pourrez créer et personnaliser un thème enfant WordPress et les utiliser pour de nombreuses tâches différentes . La meilleure partie est que vous ne perdrez pas vos modifications après la mise à jour du thème parent.