wp_enqueue_style()

Définition : wp_enqueue_style() place une feuille de style CSS dans la file de chargement WordPress. Elle associe un identifiant stable, une source, des dépendances et une version pour organiser les ressources du site.

Terminologie

Nom technique : wp_enqueue_style()

Appellations : Nom principal utilisé

À quoi cela sert, concrètement

Elle évite de multiplier les balises link codées manuellement et permet de résoudre les dépendances, les chargements répétés et l’ordre général des feuilles de style.

Fonctionnement détaillé

WordPress enregistre ou réutilise une feuille via son handle puis l’intègre au gestionnaire des styles. Le fichier n’est chargé qu’aux endroits correspondant aux hooks utilisés et selon son état dans la file.

Quand l’utiliser : contexte et choix techniques

L’utiliser depuis wp_enqueue_scripts pour un style frontal, ou depuis un hook propre à l’administration pour les ressources qui y sont réservées. Employer un handle préfixé et une URL fiable.

Situation professionnelle réaliste

Le thème ajoute une feuille CSS contenant les styles de ses cartes documentaires sans la charger deux fois à partir de plusieurs templates.

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 () {
    $file = get_theme_file_path( 'assets/css/cartes.css' );
    $ver  = is_readable( $file ) ? filemtime( $file ) : '1.0.0';
    wp_enqueue_style(
        'atoolpha-cartes',
        get_theme_file_uri( 'assets/css/cartes.css' ),
        array(), $ver, 'all'
    );
} );

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

Le handle atoolpha-cartes identifie le style ; l’URL est calculée par WordPress et filemtime fournit une version liée au fichier quand il existe. Le tableau vide indique qu’aucun autre style n’est requis par cet exemple.

Résultat observable

WordPress produit une référence à la feuille CSS, si la page et le thème utilisent le hook correctement. Le chargement réel nécessite que le fichier soit présent et accessible.

Exercice de vérification pratique

Inspecter l’onglet Réseau du navigateur pour vérifier la réponse de cartes.css. Modifier le fichier en développement puis observer l’évolution de la version dans l’URL.

Pièges, limites et sécurité

Ne pas charger de CSS inutile sur toutes les pages. filemtime entraîne une opération locale de lecture de métadonnées : sur des sites à forte charge, une version de déploiement est parfois préférable.

Différences avec les notions voisines

wp_enqueue_style() place dans la file ; wp_register_style() déclare une ressource sans l’enfiler immédiatement.

Diagnostic avancé et cas de maintenance

Cas avancé : une feuille paraît chargée mais ses règles ne s’appliquent pas. Distinguer trois niveaux de diagnostic : handle bien mis en file, fichier HTTP disponible, sélecteurs effectivement prioritaires. Une erreur 404, une version de cache ou une spécificité CSS excessive exigent des corrections différentes.