1 - Création du fichier style.css
Le fichier style.css est un composant essentiel d’un thème WordPress personnalisé. Il sert à définir des métadonnées importantes sur le thème. Ces métadonnées incluent notamment le nom du thème, l’URL du thème, le nom de l’auteur, l’URL de l’auteur, une description du thème et sa version. Ces informations permettent à WordPress de reconnaître et de gérer le thème correctement.
Le fichier style.css est structuré de manière spécifique avec un commentaire en haut du fichier qui commence par /* et se termine par */. À l’intérieur de ce commentaire, vous devez remplir les champs appropriés avec les détails de votre thème. Cela permet à WordPress de reconnaître et de présenter votre thème dans son interface d’administration.
/*
Theme Name: INSEREZ ICI LE NOM DE VOTRE THEME
Theme URI: INSEREZ ICI L’URL DE VOTRE THEME
Author: INSEREZ ICI VOTRE NOM
Author URI: INSEREZ ICI L’URL DE VOTRE SITE
Description: INSEREZ ICI UNE DESCRIPTION DE VOTRE THÈME
Version: INSEREZ ICI LA VERSION DE VOTRE THÈME
*/
2 - Création du fichier index.php
L’utilité du fichier index.php réside dans le fait qu’il sert de modèle de secours ou par défaut lorsque WordPress ne trouve pas de modèle de page ou d’article spécifique correspondant à la page demandée.
Bien que index.php soit un modèle de secours, il est important de le personnaliser pour correspondre au style de votre thème et pour inclure des éléments de navigation et de mise en page qui correspondent à votre design global. Cependant, si vous avez des modèles plus spécifiques comme page.php pour les pages statiques ou single.php pour les articles individuels, WordPress les utilisera en priorité lorsque ces types de contenu sont affichés, ce qui vous permet de personnaliser davantage la mise en page et la structure pour ces pages spécifiques.
3 - Création du fichier functions.php
Le fichier functions.php est essentiel dans un thème WordPress car il permet d’ajouter des fonctionnalités personnalisées et de personnaliser le comportement de votre site.
Il permet d’ajouter des fonctionnalités personnalisées, telles que l’inclusion de feuilles de style, la création de widgets personnalisés, la définition de hooks pour des actions spécifiques, et bien plus encore. C’est un élément central de la personnalisation de votre thème WordPress pour répondre à vos besoins spécifiques.
<?php
function enqueue_theme_styles() {
// Cette fonction inclut un fichier ‘theme.css’ du dossier ‘css’ dans le thème
wp_enqueue_style(‘theme-style’, get_template_directory_uri() . ‘/css/theme.css’);
}
add_action(‘wp_enqueue_scripts’, ‘enqueue_theme_styles’);
function custom_theme_features() {
// Cette fonction inclut la prise en charge des images à la une
add_theme_support(‘post-thumbnails’);
}
add_action(‘after_setup_theme’, ‘custom_theme_features’);
?>
4 - Création du screenshot du thème
Le screenshot (capture d’écran) du site est une miniature d’aperçu du thème WordPress qui sert généralement à l’identifier dans l’interface d’administration. Il est généralement au format PNG ou JPEG (1200px par 900px), et vous pouvez facilement le créer avec des outils tels que Canva.
A ce stade, nous avons créé les fichiers de base pour notre thème WordPress personnalisé : style.css, index.php, functions.php , et même ajouté une miniature screenshot.png.
Cependant, ne vous inquiétez pas si votre thème ne ressemble pas encore à grand-chose. La personnalisation approfondie viendra par la suite, à mesure que nous ajouterons des éléments de design, des modèles de page spécifiques, et d’autres fonctionnalités pour donner à notre thème l’apparence et la convivialité que nous souhaitons. Dans les prochaines étapes de ce tutoriel, nous plongerons plus profondément dans le développement de notre thème WordPress sur mesure pour le rendre unique et fonctionnel pour notre projet.
Cliquez ici pour accéder à l’étape 2.
Envie de gagner du temps ?
Retrouvez les fichiers directement sur mon Github.