This tutorial explains how to remove unused CSS and Js files from WordPress website using Asset cleanup plugin. This will improve google page speed scores and solve the error provided by google page speed insight tool to remove unused CSS and js ;
Please take backup before perfomaring any major changes on your website.
Step 1) Install plugin ‘Asset Cleanup Page speed booster’. Click on install now and once installed click activate.
Step 2) Now edit the page from where you want to remove unused js and CSS files. For example Edit Home page of your website.
Step 3) Scroll the page you’ll find this option asset cleanup section here and here you can see all the JavaScript and css files which are loading on the page will be displayed here
Step 4) Now if you scroll the page you will see individual js and CSS files. This will take some logic now to identify which CSS and js are not used. but it is simple I promise. Let’s take example of this CSS file as shown in the screenshot below
Now as the name says it is used to add CSS for social profiles on my home page, but I am not using any social profile on my home page so this CSS is not being used on my home page, I can safely unlod this file using the ‘Unload on this page option’ as shown in screenshot below.
ONE MORE EXAMPLE OF IDENTIFYING UNUSED CSS AND JS FILES
take a look of below shown CSS and JS files by contact form 7
Step 5) Remove unused CSS files sitewide but keep on specific pages.
So as you seen above I am using contact form 7 only on contact page so I will edit the contact page and scroll until I find contact form 7 added CSS and js files and use two options.
First Unload Site wide ‘everywhere’ for all contact for 7 CSS and js file
Second Make an exception from any unload rule & always load it
check the screenshot for settings below
Hope this tutorial helped you a lot and increased your page speed scores. Check other useful blogs and resources on my website.
You can check my youtube channel to learn such amazing tips and tricks, link in menu and side bar 🙂
