style.css (en-tête de thème)

Définition : Le fichier style.css d’un thème WordPress contient un en-tête de métadonnées permettant au système de reconnaître le thème. Il peut également renfermer des règles CSS utilisées par le site.

Terminologie

Nom technique : style.css (en-tête de thème)

Appellations : Main Stylesheet, Theme Header

À quoi cela sert, concrètement

Son rôle est double : identifier le thème pour l’administration et éventuellement porter des règles de présentation. Un nom de thème, sa version et son domaine de traduction sont particulièrement utiles pour le suivi et la maintenance.

Fonctionnement détaillé

WordPress lit un commentaire spécial situé en tête du fichier pour récupérer les informations du thème. Les directives Theme Name ou Template ont un sens pour le Core, alors que les sélecteurs CSS qui suivent agissent sur l’affichage lorsqu’ils sont chargés.

Quand l’utiliser : contexte et choix techniques

Tout thème doit posséder un style.css valide. Dans un thème enfant, la directive Template devient essentielle ; dans un thème de blocs, ce fichier reste obligatoire même si l’essentiel des styles provient de theme.json.

Situation professionnelle réaliste

Un développeur prépare une variante de thème nommée « ATOOLPHA Démo » et souhaite qu’elle soit identifiable dans Apparence → Thèmes.

Exemple pratique — CSS et en-tête de thème

Exemple pédagogique : adapter le nom du thème, les fichiers et les conditions à un environnement de développement. Il ne constitue pas une preuve d’exécution sur ATOOLPHA.

/* En-tête à placer au début de style.css. */
/*
Theme Name: ATOOLPHA Démo
Description: Exemple éducatif de structure de thème.
Version: 1.0.0
Text Domain: atoolpha-demo
*/
/* Style chargé explicitement par le thème si nécessaire. */
.site-title { line-height: 1.2; }

Décryptage de l’exemple, étape par étape

Le commentaire d’en-tête fournit les métadonnées attendues. La règle .site-title est du CSS classique et ne s’applique que si la feuille est effectivement chargée et si l’élément possède cette classe.

Résultat observable

Le thème apparaît sous son nom déclaré. Si la feuille est chargée, les titres portant la classe site-title voient leur hauteur de ligne ajustée.

Exercice de vérification pratique

Dans un thème de test, modifier uniquement Description puis consulter les détails du thème. Vérifier ensuite dans les outils du navigateur que la feuille CSS est bien présente sur la page.

Pièges, limites et sécurité

Ne pas supposer que la présence de style.css implique son chargement frontal dans tous les thèmes. Le fichier n’est ni un script PHP ni un emplacement approprié pour des paramètres secrets.

Différences avec les notions voisines

L’en-tête style.css décrit le thème ; theme.json définit des paramètres globaux et des styles WordPress plus structurés.

Diagnostic avancé et cas de maintenance

Cas avancé : WordPress reconnaît un thème mais son design paraît absent. La lecture de l’en-tête prouve seulement que le thème est identifié. Vérifier séparément son chargement par wp_enqueue_style(), son URL, son éventuelle mise en cache et la priorité des feuilles concurrentes dans les outils du navigateur.