brand-lws-red brand-lws-white
Tutoriels

WordPress
time_read62mn de lecture

Créer et personnaliser un thème enfant WordPress

16 mai 2022

Créer et personnaliser un thème enfant WordPress

Un thème enfant WordPress est un thème qui a hérité des fonctionnalités, design et mise en page d’un thème déjà existant et installé sur un site. Ce dernier est appelé thème parent. Concevoir un thème enfant permet de personnaliser en profondeur le thème de base.

Le thème d’origine (parent) ne change pas, toutes les modifications effectuées seront apportées au thème enfant WordPress. Il s’agit surtout d’un moyen très simple et rapide de créer un nouveau thème sur la base d’un autre déjà existant. Les mises à jour pourront ainsi se faire sans crainte de perdre tout votre travail.

La véritable question est comment créer et personnaliser un thème enfant WordPress ? Pour répondre à cette question, il est nécessaire de savoir pourquoi utiliser un thème enfant et comment il fonctionne.

Les Raisons d’utiliser un thème enfant WordPress

Le thème enfant est l’une des manœuvres les plus efficaces dans la création d’un nouveau thème WordPress fondé sur un thème déjà existant. Il permet de créer un nouveau thème tout en gardant la plupart des caractéristiques de base du thème parent. De ce fait, vous ne seriez pas obligé de tout coder à partir de zéro.
Étant donné que le thème enfant tire ses caractéristiques de base d’un thème maître, il est devenu plus facile et possible de personnaliser le code sans pour autant casser les diverses fonctionnalités de l’original. De cette manière, les mises à jour ne pourront pas effacer les modifications que vous avez apportées.
La construction d’un thème enfant se fait aisément puisqu’il n’est pas nécessaire de creuser profondément dans les fichiers racine de votre site. Le transfert de fichiers et la personnalisation des fichiers CSS peuvent se faire dans le gestionnaire de fichiers de votre panneau de contrôle et du tableau de bord WordPress.
Utiliser les thèmes enfants permet également de garder quelques aspects visuels du thème parent.
Les aspects importants, entre autres, les mises à jour et les correctifs de sécurité du thème d’origine, seront aussi pris en charge.
En plus de sa praticité, l’utilisation d’un thème enfant est une conception de sécurité. Vous ne risquez pas de perturber le bon fonctionnement du site, comme dans le cas d’une mauvaise configuration. Aussi, il vous permet le bon suivi des parties modifiées, car les fichiers d’un thème enfant sont séparés de son origine.

Mode de fonctionnement des thèmes enfants WordPress

Il faut d’abord savoir que le thème enfant possède son propre stockage, entre autres, son répertoire est séparé du thème parent et il dispose de ses propres fichiers (style.css et functions.php). Les fichiers des deux thèmes sont nécessaires pour le bon fonctionnement de votre thème WordPress, mais le dossier enfant peut contenir d’autres fichiers en plus. Grâce aux fichiers .css et .php pertinents, il est possible de tout modifier. Les paramètres de style de mise en page aux codes et aux scripts utilisés par un thème enfant WordPress peuvent être différents des attributs dans son thème parent. Quand quelqu’un accède à votre site, que se passe-t-il ? WordPress charge d’abord le thème enfant et après il remplit les styles et fonctions qui manquent en utilisant des parties d’un thème existant.

Création d’un thème enfant dans WordPress

La création d’un thème enfant dans WordPress nécessite une bonne compréhension de base de HTML, CSS et PHP. En effet, le processus de création comprend quelques codages. Pour le thème, vous devez choisir parmi les thèmes parents disponibles qui convient le plus à vos besoins. Vous avez à votre disposition deux méthodes courantes pour créer un thème WordPress. Vous pouvez soit utiliser un plug-in ou extension, soit vous recourir à un code personnalisé. 

Pour créer le thème enfant, vous devez d’abord vous connecter en FTP à votre hébergement web. 

Pour cela, utilisez un logiciel de transfert FTP de type FileZilla ou utilisez le gestionnaire de fichiers qui se trouve dans votre espace d’administration LWS Panel.

Trouver le gestionnaire de fichier

 

 

Dans le dossier « wp-content », accédez au dossier « themes ». Vous trouverez le répertoire de votre thème parent et de votre thème enfant.

Ouvrer le dossier thème

Créez un nouveau répertoire pour le thème enfant, en cliquant sur l’icône indiquant la création d’un nouveau dossier se trouvant dans le menu supérieur.

Création enfant Ashe

 

Puis entrez le nom de ce dossier. Lors de la création du fichier, veillez à remplacer les espaces par « – (6) »

Créez un fichier « style.css » et un fichier « functions.php ».

Créer les fichiers functions.php et style.css
Complétez le fichier ‘« style.css » avec :

/*Nom du thème : Votre nom de thème enfant
URI du thème: https: //votresite.com
Description: Enfant Ashe
Auteur du thème: votre nom
URI de l’auteur: https: //votresite.com
Template: ashe
Version: 0.1.0
*/

Il s’agit d’un code qui se compose des informations de base sur le thème enfant. Vous pouvez indiquer son nom, le thème utilisé comme parent. Des détails supplémentaires comme l’auteur et la description sont principalement utilisés comme identifiants dans le cas où vous aimeriez publier le thème. Parmi tous les champs à remplir, il ne faut surtout pas oublier le Template, son rôle est d’indiquer à WordPress le thème parent de ce thème enfant. Surtout faites bien attention à l’orthographe, respectez les minuscule et majuscule du nom. Quand vous avez terminé, cliquez sur « Enregistrer les modifications » et fermer.

compléter le fichier style.css

 

Ensuite complétez le function.php en commençant par une balise PHP d’ouverture, puis incluez les fonctions qui mettront en file d’attente la feuille de style du thème parent.

<?php
function enqueue_parent_styles(){
wp_enqueue_style( ‘parent-style’, get_template_directory_uri() . ‘/style.css’ );
}
add_action( ‘wp_enqueue_scripts’, ‘enqueue_parent_styles’ );
?>

compléter le fichier function.php

Une fois terminé, enregistrer le function.php et fermer le fichier. Puis connectez-vous à votre site Web et accédez à Apparence, puis Thème. Normalement, vous trouverez le thème que vous venez de créer parmi les thèmes. Activer le.

activer le thème enfant en cliquant sur activer

Si votre thème ne se trouve pas dans l’apparence de WordPress, il se peut que les informations fournies ont une erreur. Veillez à ce que le template soit parfaitement rempli. Si cette case est mal informée, vous aurez une indication comme celui-ci en bas de votre thème dans WordPress.

Le thème parent n'a pas été identifié

Si c’est le cas, vérifiez que vous n’avez pas fait de faute d’orthographe ou mal écrit le mot. Si c’est bien correcte, changer les majuscules en minuscules et réactualiser votre tableau de bord. Veillez à nommer correctement tous vos fichiers et documents. Avant modification, prenez le temps de bien comprendre le style et éléments qui constituent le thème parent de votre nouvel thème.

 

Personnalisation du thème enfant

Vous avez le choix entre diverses méthodes pour personnaliser votre thème enfant WordPress. Vous pouvez modifier la mise en page en ajoutant des fichiers modèles au dossier du thème enfant ou de changer le style en ajoutant un code CSS personnalisé. Ce nouveau thème peut aussi acquérir de nouvelles fonctionnalités qui remplacent leur thème parent.

Bases de la personnalisation

Pour personnaliser votre thème enfant WordPress, accédez au menu « Apparence » puis « Thèmes » et cliquez sur le bouton « Personnaliser » sur votre thème enfant actif. Dans l’éditeur, sélectionnez « CSS additionnel ».

Dans la personnalisation du thème enfant, trouver CSS additionnel

 

Changer la couleur de fond

Pour modifier la couleur, cliquez sur le bouton « Personnaliser », ensuite choisissez le bouton « Couleur » puis « Arrière-plan de l’en-tête » ou « Body Background ». Vous pouvez y sélectionner une couleur de fond ou une image de fond. Il existe deux moyens de changer la couleur, actionner la barre des couleurs ou entrer le code hexadécimal de la couleur.

changer la couleur de fond

Vous pouvez également utiliser le code ci-dessous à insérer dans le CSS additionnel pour changer la couleur de fond quand le menu cité plus haut n’est pas valable dans votre thème enfant.

.site-content-contain {
    couleur de fond : #DEF0F5 ;
    position: relative;
}
La valeur à mettre à côté de background-color correspond au code hexadécimal de la couleur souhaitée.

Modifier la couleur de la barre latérale du menu de WordPress

Il est possible de créer un affichage plaisant à vos widgets en ajoutant de la couleur à la barre latérale avec un code CSS. Il suffit d’ajouter :

.widget {
arrière-plan : #B9EBFA ;
rembourrage : 25px ;
}

Modifier les types, tailles et couleurs de police

Pour personnaliser votre site, utilisez le menu « Afficher » sur le côté gauche une fois que l’éditeur s’affiche. Dans le cas où vous ne trouvez pas le menu que vous souhaitez changer, utilisez le CSS additionnel, vous pouvez y placer des codes comme :

p {
couleur sarcelle;
}
p {
font-family: Georgia;
taille de police : 18 px ;
}

Ce code sert à modifier le type, la taille et la couleur de la police de votre paragraphe (p). Pour changer la police des autres parties de texte, par exemple, les titres ou les en-têtes, il faut d’abord inspecter les éléments afin de connaître leurs paramètres CSS. Pour modifier le titre, il faut cliquer avec le bouton droit sur le texte et sélectionnez Inspect. 

Par exemple pour H2, le code est

h2  {
  1. affichage : bloc ;
  2. taille de police : 1.5em ;
  3. marge-bloc-début : 0.83em ;
  4. margin-block-end : 0.83em ;
  5. margin-inline-start : 0px ;
  6. margin-inline-end : 0px ;
  7. font-weight : gras ;
Pour effectuer un changement, il faut copier et coller le code dans l’onglet CSS supplémentaire, puis modifier les valeurs en conséquence.
Cette méthode peut être appliquée avec tous les éléments de votre site.

Vous savez maintenant comment créer et comment modifier les éléments d’un thème enfant WordPress. Vous pouvez maintenant écrire vos premiers contenus ou bien personnaliser encore plus votre thème enfant.

Il faut comprendre que la réalisation d’un thème enfant est bénéfique, mais comporte aussi des problèmes potentiels. Il peut s’avérer que le temps de chargement du site devient plus lent, ce qui peut faire perdre votre place SEO sur les résultats de recherche de Google. Le thème enfant dépend de la base, en effet, celui-ci ne peut être utilisé que si le thème de base est intact et installé. En cas de grande modification des thèmes parents, il est possible que ce changement peut avoir un impact sur le thème de votre enfant d’une manière ou d’une autre. Des questions ? N’hésitez pas à les poser en commentaires !

Avatar de l'auteur

Auteur de l'article

Tatiana

Tatiana est rédactrice web depuis cinq ans. Elle écrit sur des thèmes variés, mais ses prédilections sont le bricolage, les high-tech et l'e-commerce. Dynamisme, rigueur et polyvalence sont les maîtres mots de son comportement professionnel. Ce qui lui permet d'accomplir pleinement toutes les tâches qui lui sont confiées.

Avis client de l'hébergeur LWS

Nos avis Trustpilot Nos avis Hostadvice Nos avis sur avis.lws.fr
Avis trustpilot 30/04/2022

LWS l'hébergeur par excellence !

LWS est pour moi l'hébergeur par excellence, que cela soit au niveau de l'hébergement qui est très performant, les mails qui sont d'une qualité professionnelle et de la gestion du domaine facile à comprendre.

PauseGreen

Avis hostadvice 27/04/2022

Super, au top !

Au top, prix attractif. Service très rapide et réactif. Je l'ai même personnellement recommandé à des proches. La vie est bien plus facile avec LWS

Masset Eliot

Avis avislws 26/04/2022

Support

Clair, efficace, rapide et à tarif abordable. J'ai maintenant un site superbe à mon image, puisque je le fais moi-même. L'équipe technique est au top, j'ai une réponse en 20 minutes, cela change d'autres hébergeurs pourtant plus connu.

Lady Whip

Avis hostadvice 24/04/2022

Bravo et merci

Bravo et merci aux équipes techniques pour leur réactivité et leur professionnalisme depuis plus de 10 ans chez eux et de nombreux sites !!! Merci

Olivier Delmas

Avis trustpilot 23/04/2022

Je suis très satisfait.

J'ai commandé un hébergement pour le site d'une association. Tout s'est passé très rapidement et sans la moindre embuche. La tarification est attractive et me parait très claire. Le panneau d'administration de l'hébergement est facile à utiliser et à comprendre. Je n'ai pas encore installé Wordpress car le contenu n'est pas prêt mais ce sera la prochaine étape et je suis très confiant. Merci !

Pierre-André Liné

Avis avislws 20/04/2022

Un service technique excellent

Je suis client chez LWS depuis 2011 avec une boutique OSCommerce qui tourne comme une horloge depuis cette date sur un hébergement mutualisé. La disponibilité de la boutique est très proche de 100%. Concernant les rares problèmes rencontrés en huit ans, j’ai eu à chaque fois un technicien compétent qui a résolu le problème très rapidement et efficacement. Je suis en train de migrer sur une plateforme Pretashop sur un VPS, avec l’offre LWS Debian 9 et Prestashop. Un technicien m’a grandement aidé pour finaliser l’installation de la boutique lors de la mise à jour vers la dernière version de Prestashop 1.7 qui posait problème. Je suis très satisfait de LWS, et ce sur la durée : réponses et réactions rapides et efficaces. Je recommande cet hébergeur et encore merci.

Alain

Avis trustpilot 16/04/2022

Une expérience jamais égalée !

Étant Développeur Web & Mobile Full-Stack depuis plus de 5 ans déjà, j'ai rarement eu un service client aussi rapide et efficace. Sans compter la qualité du service en ligne. Je recommande VIVEMENT LWS !

Chris KOUAKAM

Avis hostadvice 12/04/2022

Très bon hébergeur

J'ai un serveur VPS chez eux et je n'ai aucun problème, dès qu'il y a un problème le service technique est la pour vous aider et répond assez rapidement à votre demande. Je recommande vivement cet hébergeur.

Vanden Cruyce

Avis avislws 09/04/2022

Je suis ravie

Je suis ravie d'être avec LWS sur tous les plans, je remercie les Techniciens (Fabrice, Omar, Sandy-Mahitsison) depuis plus de 8 ans j'ai évolué avec LWS et toujours soutenue. Une véritable relation humaine même si les questions ou nos inquiétudes ne correspondent pas à leurs missions, ils sont là pour nous répondent et nous rassurent. Mon site c'est mon travail ma source de revenue donc il sont mes partenaires ! les travailleurs de l'ombre merci à eux ! Merci LWS

L'atelier-and-Co

Commentaires (0)

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée.