Comment créer votre premier “theme enfant” dans WordPress?

Chez WP Expert, nous sommes souvent approchés par des clients potentiels qui ont déjà fait leurs recherches sur la manière de créer leur site WordPress, qui ont trouvé un theme WordPress qui leur plaît, mais qui aurait besoin d’être personnalisé pour tout à fait satisfaire leurs envies.

Comme vous le savez déjà si vous êtes un utilisateur régulier de WordPress, un theme est un modèle utilisé pour le rendu visuel de votre site WordPress. Il y a des milliers de themes disponibles gratuitement sur l’annuaire de themes de WordPress.org, mais également des themes premium qui vous coûteront un peu d’argent. Dans le cas des themes premium, ils sont toujours produits par des agences professionnels qui garantissent un bon design pour votre site. Cependant, ils sont rarement 100% satisfaisant et ont souvent besoin d’un travail de personnalisation.

Heureusement, WordPress vous offre la possibilité de créer des themes enfants qui remplissent justement cette tâche importante.

Que sont les themes enfants dans WordPress et pourquoi vous devriez les utiliser?

Un theme enfant est un sous-theme qui hérite des styles et des fonctionnalités d’un theme parent (comprendre: un theme normal), ce qui vous permet de faire des changement d’apparence ou de fonctionnalités sur votre site tout en laissant le theme parent intact, car les changements sont faits séparément dans les fichiers du theme enfant.

Le principal avantage de la création d’un theme enfant est qu’il vous permettra d’améliorer la maintenabilité de votre site. En effet, les changements effectués sur votre theme enfant ne seront pas affectés par les mises à jour faites sur le theme parent. Il est important d’être en mesure de faire toutes les mises à jour de vos themes rapidement, car ça rendra votre site plus sûr et vous donnera accès à toutes les fonctionnalités qui viennent avec la mise à jour.

Comment créer un theme enfant dans WordPress?

AVERTISSEMENT: cette partie de l’article part du principe que vous êtes à l’aise avec la structure de votre site WordPress, des themes en particuliers, et que vous savez créer, effacer, ou mettre à jour des dossiers et fichiers dans WordPress à l’aide d’un logiciel FTP ou de commandes SSH.

La création d’un theme enfant dans WordPress est assez simple, elle ne nécessite que quelques étapes.

Etape 1 – Créer le dossier du theme enfant

Dans le dossier themes de votre installation WordPress, créez un dossier pour le theme enfant comme vous le feriez pour un theme classique.

Etape 2 – Créer la feuille de style de votre theme enfant

Pour détecter votre theme, WordPress utilise les en-têtes de la feuille de styles du theme. Il vous faut donc créer une feuille de style nomme style.css (ça ne fonctionnera pas avec un autre nom) et inclure les en-têtes requis dans celle-ci. Les en-têtes de la feuille de style doivent se présenter ainsi:

/*
Theme Name: Twenty Twenty-Two theme enfant
Template: twentytwentytwo
Author URI: https://wordpress.org/
Description: Built on a solidly designed foundation, Twenty Twenty-Two...
*/

Les parties importantes sont en gras dans le code ci-dessus, il s’agit du nom du theme (theme enfant) et du template (theme parent).

Step 4 – Placez les feuilles de style en liste d’attente

Le code ci-dessous doit être placé dans le fichier functions.php de votre theme enfant pour vous assurer que les styles des themes parent et enfant sont chargés dans le bon ordre.


<?php

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

?>

Etape 4 – Activez le theme

Une fois que les trois premières étapes sont terminées, vous êtes prêt à installer votre theme et à l’activer.

Comment travailler sur votre theme enfant?

Une fois que vous êtes prêt et que votre theme enfant est installé, vous pouvez commencer à travailler dessus. Ce travail nécessitera évidemment des connaissances en matière de développement web. En bref, vous pourrez changer la plupart des couleurs et des visuels en personnalisant la feuille de styles, tandis que les modifications fonctionnelles se feront dans le fichier functions.php.