wp_add_inline_style()

Définition : wp_add_inline_style() ajoute des règles CSS directement à une feuille de style déjà enregistrée et présente dans la file WordPress. Elle rattache ce code à un handle précis plutôt que de générer des balises isolées.

Terminologie

Nom technique : wp_add_inline_style()

Appellations : Nom principal utilisé

À quoi cela sert, concrètement

Elle sert à compléter ponctuellement un style existant, par exemple avec une valeur calculée côté serveur ou une petite variante de thème, sans créer une nouvelle ressource CSS pour quelques déclarations.

Fonctionnement détaillé

WordPress associe le CSS à une feuille identifiée par son handle. La ressource doit être déjà enregistrée et mise en file ; les blocs CSS successifs sont ajoutés dans leur ordre d’enregistrement.

Quand l’utiliser : contexte et choix techniques

L’utiliser pour des règles courtes et contrôlées. Pour un grand ensemble de styles, privilégier un fichier CSS versionné ou le système des styles globaux si la propriété est gérée par theme.json.

Situation professionnelle réaliste

Un thème définit la couleur d’un encadré de documentation avec une petite règle complémentaire, sans modifier la feuille principale distribuée.

Exemple pratique — PHP commenté

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.

<?php
add_action( 'wp_enqueue_scripts', function () {
    wp_enqueue_style(
        'atoolpha-base', get_stylesheet_uri(), array(), '1.0.0'
    );
    // CSS constant : aucune donnée visiteur injectée.
    wp_add_inline_style(
        'atoolpha-base',
        '.fiche-technique { border-left: 4px solid #245a81; }'
    );
} );

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

Le thème charge d’abord une feuille sous le handle atoolpha-base. wp_add_inline_style() ajoute une règle ciblée dans le bloc de styles associé. La règle n’est pas exécutée tant que la feuille n’est pas correctement placée dans la file.

Résultat observable

Les éléments ayant la classe fiche-technique obtiennent une bordure gauche bleue. Aucun script ou événement n’est généré et le contenu encyclopédique reste statique.

Exercice de vérification pratique

Inspecter les styles calculés d’une fiche de test. Retirer temporairement wp_enqueue_style() et constater que la règle inline n’est plus attachée comme prévu.

Pièges, limites et sécurité

Ne jamais concaténer une chaîne CSS arbitraire envoyée par un visiteur. Pour les valeurs dynamiques, appliquer des listes de valeurs admissibles et des règles de validation spécifiques.

Différences avec les notions voisines

wp_add_inline_style() attache du CSS à un handle ; wp_enqueue_style() charge un fichier CSS par son URL.

Diagnostic avancé et cas de maintenance

Cas avancé : la règle inline n’apparaît pas, alors que sa fonction retourne un résultat exploitable. Contrôler d’abord l’existence du handle et sa présence dans la file. L’ajout de CSS ne doit pas servir à contourner systématiquement une architecture de styles globale mal organisée.