Speed is of utmost importance to both users and search engines. Web visitors do not like waiting longer for the pages to load, and hence search engines rank them lower. To avoid this issue, consider minifying CSS and JavaScript files. It will considerably speed up the loading speed of your WordPress website. In this article, learn three ways you can minify these files in WP.
Use WP Rocket
The easiest way to minify CSS and JS files in WordPress is by using the WP Rocket plugin. It’s a popular plugin used by tens of thousands of WP sites.
To get started, install it and then activate it. Then follow the following steps:
Now, the CSS and JS files will get minified. Clear the plugin cache to make sure they don’t interrupt the transition.
Use SiteGround Optimizer
If you’re a SiteGround user, you can use the SiteGround Optimizer to minify the CSS and JS files. It’s a plugin developed specifically for the SiteGround platform.
So go ahead and install the plugin and activate it. Then, open SG Optimizer from the admin sidebar, which will take you to SG Optimizer settings. Under Other Optimizations, click on ‘Go to Frontend’ button. Here, you’ll have to find the ‘Minify CSS Files’ and ‘Minify JavaScript files’ option and turn on the toggle button.
Lastly, empty the cache and reload the website for the changes to take effect.
Use Autoptimize
For users who are not on SiteGround or cannot use WP Rocket, it’s recommended to use Autoptimizer plugin.
So proceed and download the plugin and then activate it.
Once done, follow these steps (which are not much different from the ones mentioned above):
Use WP Rocket
The easiest way to minify CSS and JS files in WordPress is by using the WP Rocket plugin. It’s a popular plugin used by tens of thousands of WP sites.
To get started, install it and then activate it. Then follow the following steps:
- Navigate to Settings > WP Rocket and open the File Optimization tab
- Find the ‘Minify CSS files’ option and tick the checkbox next to it. Click on the ‘Activate Minify CSS’ option when a warning popup opens.
- Next, scroll down till you see the ‘Minify JavaScript files’ option and click on the checkbox. Again, confirm in the warning popup box that you want to minify JS files
- Save the changes and exit
Now, the CSS and JS files will get minified. Clear the plugin cache to make sure they don’t interrupt the transition.
Use SiteGround Optimizer
If you’re a SiteGround user, you can use the SiteGround Optimizer to minify the CSS and JS files. It’s a plugin developed specifically for the SiteGround platform.
So go ahead and install the plugin and activate it. Then, open SG Optimizer from the admin sidebar, which will take you to SG Optimizer settings. Under Other Optimizations, click on ‘Go to Frontend’ button. Here, you’ll have to find the ‘Minify CSS Files’ and ‘Minify JavaScript files’ option and turn on the toggle button.
Lastly, empty the cache and reload the website for the changes to take effect.
Use Autoptimize
For users who are not on SiteGround or cannot use WP Rocket, it’s recommended to use Autoptimizer plugin.
So proceed and download the plugin and then activate it.
Once done, follow these steps (which are not much different from the ones mentioned above):
- Go to Settings > Autoptimizer
- Here you need to check the ‘Optimize JavaScript code’ option under JavaScript
- Similarly, scroll down to CSS Options and check the ‘Optimize CSS code’ option
- Save the changes and exit
