background img
Jun 25, 2020
0 0

How to Minify CSS and JavaScript in WordPress Site

Written by

You can improve your website performance and loading speed by Minify CSS and Javascript from your site. Website loading speed is a very important factor according to Google ranking. There are many ways to increase website loading speed including CSS and Javascript minify.

Today in this article I will show you how to minify CSS and Javascript from WordPress site.

Braga Why Minify CSS and Javascript Minify is important

You can move your website performance to a new level by minifying Javascript and CSS from your site. When you minify CSS and Javascript, it reduces your web page size so that your website is Fast Loaded.

Even Google recommends minifying JavaScript and CSS files from the website. The faster loading website performs better in search engine results and also improves user experience.

Now you must have understood why CSS and Javascript minify is necessary for any website.

How to Minify CSS and Javascript from WordPress Site

Page load speed is very important to get good ranking in Google search and increase traffic to your blog.

Before compressing CSS and Javascript, you need to know what the current score of your website is. There are several tools available to check this.

So let’s get straight to the main topic…

There are so many ways and plugins available to reduce CSS and javascript. Here I will minify CSS and javascript using some popular WordPress plugins.

# 1. W3 Total Cache (Minify CSS)

W3 Total Cache is the very popular WordPress caching plugin. This takes the performance of your website to a new level.

The plugin provides dozens of features including Minify. If you use W3 Total Cache on your site, you can minify CSS and JS files from your site using its minify feature.

Just go to the General Settings tab and scroll to Minify settings, then follow the screenshot,

Minify CSS
This is the basic setting. For advanced settings, click on the Minify option under the Performance tab and follow the screenshot below.

Minify CSS

#2. Autoptimize

Autoptimize is the most popular WordPress plugin that optimizes HTML, JavaScript, and CSS code on your site. This improves the performance of your site to a great extent.

First of all, install and activate this plugin. After activating the plugin, click Settings >> Autoptimize.

This will take you to the settings page of the plugin where you have to check the Optimize HTML Code, Optimize JavaScript Code, Optimize CSS option. Follow the screenshot below,

Minify CSS

Minify CSS
When you click on the Save button, it will start optimizing CSS, Javascript, and HTML on your website.

Apart from this, it offers features like CDN and Lazy load for Images, which improves your website Loading Speed and reduces server load.
Minify CSS wordpress

The Autoptimize WordPress plugin also allows you to remove query strings, emojis, and Google Fonts.

The plugin improves the PageSpeed by optimizing the HTML, CSS & JS file and reduces HTTP requests. In addition, the Autoptimize plugin works perfectly with WP Super Cache, HyperCache, Comet Cache, and KeyCDN Cache Enabler.

# 3. WP Fastest Cache

WP Fastest Cache is another popular caching plugin with a 5star rating. This plugin also includes a built-in minify option. Just, you need to check some boxes. Follow the screenshot below.

The plugin also allows you to enable Gzip compression which reduces the size of files sent from your server.

# 4. Fast Velocity Minify

This plugin is specially designed to minify javascript and CSS files. After activating the plugin, click Setting >> Fast Velocity Minify.

This will take you to the plugin’s setup page. Click on the “Setting” tab here and follow the screenshot below,

# 5. WP Super Minify

The WP Super Minify plugin combines JavaScript and CSS files on your WordPress site and speeds up page loads by minifying. Just install and activate the plugin then check both options.

  • Compress JavaScript
  • Compress CSS

Last Thought

Here I have explained the 5 Best Plugins that help in minimizing CSS and javascript in your WordPress site. You can use any plugin on your site.

If you use any of the Listed cache plugins on your site, you will not need to install the minify plugin separately. These Cache plugins will handle everything from caching to minifying.

Small request, if this article has been helpful for you, then don’t forget to share it!

Article Tags:
Article Categories:
WordPress Tricks and Tips

Leave a Reply

Your email address will not be published. Required fields are marked *

The maximum upload file size: 512 MB. You can upload: image, audio, video, document, text, other. Links to YouTube, Facebook, Twitter and other services inserted in the comment text will be automatically embedded. Drop file here