Comment supprimer les CSS et JS inutilisés dans WordPress (très facile)

Avoir beaucoup de CSS inutilisés peut ralentir votre site. Si vous testez votre site Web avec Google PageSpeed ​​Insight, vous pourriez recevoir un avertissement pour supprimer le CSS inutilisé. Il existe un moyen simple de le faire sans codage ni technicité.

Avoir beaucoup de CSS et de JS inutilisés sur votre site Web peut nuire au temps de chargement de votre site Web. Si vous gérez votre site Web via un outils de test de vitesse tel que Google PageSpeed ​​Insight, vous pouvez recevoir un avertissement pour supprimer le CSS inutilisé.

Heureusement, il existe un moyen très simple de le faire. Vous n'avez pas besoin de connaissances techniques particulières pour pouvoir supprimer les CSS et JS inutilisés de votre site WordPress.

C'est à cause d'un plugin incroyable connu sous le nom de Asset CleanUp : accélérateur de vitesse de page. Avec ce plugin, supprimer les CSS inutilisés est aussi simple que de cliquer sur quelques boutons. Alternativement, si cela ne vous dérange pas de dépenser quelques dollars par an, avec WP Rocket, il y a un bouton CSS inutilisé supprimé, il suffit de l'activer et le plugin supprimera automatiquement tous les CSS inutilisés.

Commander: Top 7 des hébergements WordPress Google Cloud gérés

Qu'est-ce qu'un CSS inutilisé ?

Le CSS inutilisé est un fichier CSS qui est présent dans une page mais qui n'est généralement pas nécessaire au chargement de la page. Lorsqu'un visiteur ouvre un site Web, le navigateur doit généralement télécharger, analyser et traiter toutes les feuilles de style externes sur la page visitée avant de pouvoir afficher le contenu de la page au visiteur. Si un CSS existe sur une telle page qui n'est pas utilisé sur la page, le navigateur y perdra son temps.

Un exemple classique de ceci est la plupart des plugins de formulaire de contact qui sont utilisés. Bien que ces plugins ne soient principalement utilisés que sur la page Contactez-nous, chargez son CSS sur tout le site Web. Peu importe si c'est la page d'accueil où il n'est pas utilisé, le CSS se chargera.

S'il y a trop de CSS qui ne sont pas nécessaires mais qui se chargent et ralentissent le temps du navigateur pour lire et afficher une page, cela peut devenir un problème.

Outre les plugins, les développeurs de thèmes écrivent beaucoup de choses dans le style.css qui ne sont généralement pas nécessaires. Mais que cela soit nécessaire ou non, ils se chargent chaque fois que votre site est chargé !

Un CSS inutilisé peut ne pas être un problème, mais beaucoup de CSS inutilisés peuvent affecter le temps de chargement de votre site Web.

Commander: Top 10 des thèmes WordPress les plus rapides et les meilleurs 

Comment identifier les CSS inutilisés

Trouver des CSS et JS inutilisés est une chose très facile à faire. Il y a deux approches que je recommanderai.

L'une consiste à analyser votre site Web via Google PageSpeed ​​Insight. Vérifiez si votre site Web présente un problème de suppression de CSS inutilisé. Cliquez dessus et vous pourrez identifier le composant de votre site qui en est responsable.

CSS inutilisé

Vous pouvez voir ci-dessus qu'il y a un cas de CSS inutilisé enregistré. Je peux voir le plugin et l'emplacement du CSS inutilisé en regardant ceci.

La deuxième option consiste à obtenir une analyse plus détaillée. Vous pouvez y parvenir en utilisant les outils de développement Chrome.

Sur votre navigateur Chrome, ouvrez les outils de développement Chrome, puis accédez à la couverture. Cliquez ensuite sur le bouton de rechargement à l'intérieur de la zone de couverture. Vous pouvez trouver un guide complet sur la façon de procéder dans l'outil Google Developers.

L'autre option est d'utiliser jitbit pour rechercher les sélecteurs CSS inutilisés. Vous pouvez aussi utiliser PurifierCSS pour trouver les CSS inutilisés

Comment supprimer le CSS inutilisé

Suivez ces étapes pour supprimer les CSS inutilisés de WordPress :

1. Installez Asset CleanUp

Allez dans plugin puis Ajouter nouveau. Ensuite, vous tapez "Asset CleanUp" dans la zone de recherche de la page Ajouter un nouveau plugin. Installez et activez le plugin.

2. Accédez aux paramètres du plug-in

Pour accéder aux paramètres du plugin, à partir du tableau de bord WordPress, cliquez sur paramètres puis cliquez sur Asset CleanUp.

3. Déchargez les CSS et JS indésirables

Sur les paramètres du plugin, vous devrez peut-être accepter que vous sachiez comment le plugin fonctionne sous le gros robinet de décapage avant de commencer.

Pour décharger CSS et JS, cliquez sur Gestionnaire CSS et JSS. De là, vous pouvez supprimer tous les CSS et JS dont vous n'avez pas besoin. Vous pouvez le supprimer uniquement pour la page d'accueil, pour l'ensemble du site ou pour une URL spécifique. Vous pouvez également supprimer des publications, des pages ou des catégories.

Un exemple consiste à décharger tout formulaire de contact du chargement pour l'ensemble du site, à l'exception de la page Contactez-nous

Décharger CSS

Prenez votre temps et déchargez tous les CSS et JS dont vous savez qu'ils ne sont pas nécessaires. Assurez-vous de tester votre site une fois que vous avez terminé pour vous assurer que tout va bien.

Supprimer les plugins WordPress CSS inutilisés

Voici quelques plugins que vous pouvez utiliser pour supprimer les CSS inutilisés dans WordpPress :

1. Asset CleanUp : accélérateur de vitesse de page

Nettoyage des actifs

Asset CleanUp : accélérateur de vitesse de page facilite la suppression des CSS et JS inutilisés dans WordPress, même pour les débutants. Tout ce que vous avez à faire est de désactiver un CSS particulier qui n'est pas nécessaire pour une page particulière.

Vous pouvez également désactiver pour des publications individuelles uniquement. Avec la version premium, vous pouvez désactiver les CSS/JS inutilisés par les plugins.

Ce plugin est un plugin de performance complet avec de nombreuses autres options pour accélérer WordPress. La suppression des CSS/JS inutilisés n'en est qu'une partie.

Dans ce post, j'ai utilisé ce plugin a un guide.

2. WP Rocket

WP Rocket est le plugin de performance premium WordPress numéro un. Si vous êtes un noob, je veux dire si vous n'êtes pas expérimenté ou à l'aise avec WordPress, alors WP Rocket est le moyen le plus simple de supprimer les CSS inutilisés.

Vous devez acheter le plugin, une fois que vous avez fait cela, vous pouvez le télécharger à partir de votre compte ou vérifier votre e-mail pour un lien de téléchargement.

Installez le plugin via Tableau de bord>plugins>Ajouter un nouveau>Télécharger.

Accédez simplement aux paramètres de WP Rocket, puis cliquez sur l'onglet "Optimisation des fichiers". Ensuite, faites défiler vers le bas et vous verrez "Supprimer le CSS inutilisé", cochez la case, enregistrez et effacez le cache.

Supprimer CSS WP Rocket inutilisé

3. Questions de performance

Perfmatters

Perfmatters est un plugin premium développé par Brian Jackson et son frère, Brett Jackson. Ce plugin peut aider à supprimer très facilement les CSS inutilisés.

Tout d'abord, vous devez acheter le plugin. Ensuite, installez-le. Activez la licence. Lorsque vous accédez aux paramètres, activez le gestionnaire de scripts.

Accédez simplement à n'importe quelle page ou publication sur votre site Web, vous verrez l'icône du gestionnaire de scripts dans le menu du tableau de bord, cliquez dessus. Vous pourrez supprimer les CSS et JS inutilisés de la page ou globalement.

Ce plugin est un plugin de performance, livré avec de nombreuses autres options pour accélérer WordPress. La suppression des CSS/JS inutilisés en fait partie.

4. Gestionnaire CSS JS

Gestionnaire CSS-JS

Gestionnaire CSS JS peut spécifiquement supprimer CSS ou JS de Mobile ou Desktop. Selon ce que vous voulez atteindre.

Ce plugin peut également différer le chargement des fichiers CSS ou JS.

Conclusion

Si vous avez beaucoup de CSS et JS inutilisés, vous remarquerez une grande amélioration des scores de vitesse et de performance.

Il peut être impossible de supprimer tous les CSS inutilisés, mais vous pouvez les réduire au minimum. J'utilise Asset CleanUp pour supprimer les CSS inutilisés pour TendanceCible.

Rappelez-vous, optimisez mais ne soyez pas trop obsédé par cela, à moins que vous ne vouliez que votre site ressemble à le site web le plus rapide au monde.

A lire également:

Comment éliminer les ressources bloquant le rendu dans WordPress

Comment rendre WordPress très rapide

Comment générer du trafic vers votre blog

Mfon Abel Ekene

Mfon Abel Ekene

J'aime créer des contenus utiles. Ma passion est d'aider les internautes à trouver ce dont ils ont besoin en les orientant dans la bonne direction. C'est ce que j'aime faire et j'ai consacré de nombreuses heures à la recherche et aux tests pour m'assurer de le faire grâce à mon contenu sur TargetTrend.

Articles : 50

Recevez des trucs techno

Tendances technologiques, tendances de démarrage, avis, revenus en ligne, outils Web et marketing une ou deux fois par mois

3 Commentaires

  1. Bonne liste. Le nettoyage des ressources n'est pas suffisant pour la plupart des thèmes car je ne peux pas supprimer le fichier CSS principal. Habituellement, le fichier CSS principal est également très volumineux.

    Le seul plugin gratuit qui le fait sans abonnement à un service externe est Debloat. Vous voudrez peut-être l'envisager : https://wordpress.org/plugins/debloat/

Laissez un commentaire

Votre adresse email n'apparaitra pas.