15/11/2024

WordPress

WordPress – Désenregistrer un style CSS ou un script JavaScript

I. Présentation

WordPress intègre deux fonctions qui permettent d'enregistrer les styles CSS et les scripts JavaScript afin de les appeler lors du chargement du site. La fonction pour le CSS est wp_register_style() et celle pour le JS est wp_register_script(). Cependant, si trop de feuilles de styles CSS et trop de JS sont chargés lors du chargement de la page cela peut considérablement réduire les performances du site.

Pour corriger cela, vous pouvez retirer la ligne d'enregistrement du script en cherchant dans les pages de votre thème ou aussi créer une fonction qui aura pour objectif de "dés-enregistrer" certaines feuilles CSS et certains scripts  JS, que vous aurez sélectionnez. Notamment si vous regroupez plusieurs feuilles CSS en une seule vous pourrez "dés-enregistrer" celle qui n'ont plus à être appelées.

II. Fonctions de dés-enregistrement

Nous avons vu les fonctions d'enregistrement, il existe à l'inverse celles qui permettent de dés-enregistrer un CSS ou un JS. La fonction wp_deregister_style() est utilisée pour les CSS tandis que wp_deregister_script() est utilisée pour les JS. Nous allons d'ailleurs utiliser ces fonctions dans le code PHP pour préciser ce qu'on souhaite ne plus appeler au chargement de la page.

II. Code PHP et explications

Voici le code PHP qui peut permettre de supprimer l'enregistrement de plusieurs feuilles CSS grâce à l'utilisation d'un tableau. Pour cet exemple, les feuilles ayant pour identifiant "style1" et "style2" sont concernées. La fonction quant à elle se nomme "my_deregister_css".

add_action( 'wp_print_styles', 'my_deregister_css', 100 );
function my_deregister_css() {
    $handles = array('style1', 'style2');

    foreach($handles as $mystyle){
        wp_deregister_style( $mystyle );
    }
}
  • add_action() : Cette fonction permet d'ajouter l'exécution d'une fonction au cœur de WordPress. Elle se constitue de trois paramètres : Le nom de l'action (appelée également hook), le nom de la fonction à utiliser et une priorité qui permet d'indiquer à WordPress les actions à exécutée de façon prioritaire. Si vous n'indiquez pas de priorité, les actions seront prises dans l'ordre chronologique.
  • Le tableau : La variable $handles est un tableau contenant l'identifiant de chacun des styles CSS que je souhaite dés-enregistrer.
  • La boucle : foreach permet d'exécuter une action pour chaque valeur du tableau, cette action est l'utilisation de la fonction wp_deregister_style() qui permet de dés-enregistrer un CSS selon son identifiant. En l'occurrence "style1" et "style2" sont concernés.

L'exemple ci-dessus est applicable pour des fichiers CSS, pour l'appliquer sur des fichiers JavaScript pensez à modifier le code pour utiliser la fonction appropriée et changez le nom de l'action.

Si vous souhaitez dés-enregistrer uniquement un élément, ne vous embêtez pas avec un tableau :

add_action( 'wp_print_styles', 'my_deregister_css', 100 );
function my_deregister_css() {
        wp_deregister_style( 'style1' );
}

 

author avatar
Florian BURNEL Co-founder of IT-Connect
Ingénieur système et réseau, cofondateur d'IT-Connect et Microsoft MVP "Cloud and Datacenter Management". Je souhaite partager mon expérience et mes découvertes au travers de mes articles. Généraliste avec une attirance particulière pour les solutions Microsoft et le scripting. Bonne lecture.
Partagez cet article Partager sur Twitter Partager sur Facebook Partager sur Linkedin Envoyer par mail

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.