How To Minify Javascript And CSS In WordPress

by

Minifying your WordPress CSS and Javascript files will reduce the overall size of your page and can make them load faster and speed up your WordPress site.

In this article, we will show you how to minify Javascript and CSS files with a free plugin in WordPress to improve performance and speed.

In case you missed: How to Inline Critical CSS above-the-fold With Autoptimize

What is Minify and why do you need it?

Minify is a term used to describe a method that makes your website file size smaller.

Minification of Javascript and CSS is achieved by removing white spaces, lines, and unnecessary characters from the source code of your webpage.

Minnification of CSS and JS files necessary for sites to load fast. The reason being fast loading site makes visitors and search engines happy.

Word Press by itself is lightweight and is optimized for speed. But when we start installing plugins , performance can suffer a lot, making your site slow.

Having said that let’s take a look at how to easily minify CSS and JavaScript on the WordPress site.

Better WordPress Minify Plugin

Better WordPress minify plugin, allows you to combine and minify your CSS and JS files, which is vital to improve page load time.

It relies on WordPress enqueueing system rather than the output buffer. Which means it will not break your site (in most cases). Very customizable and easy to use.

minify js and css

You don’t need to change any settings. The default settings enabled after activating the plugin, will work for most cases.

On the settings page under General options, you need to check the first two options to automatically minify JavaScript and CSS files on your WordPress site.

You can then click on the Save Changes button to store your settings.

There are of course advanced settings too for the advanced users.

Some Notable Features

  1. Uses an enqueueing system of WordPress which improves compatibility with other plugins and themes
  2. Allows you to move enqueued files to desired locations (header, footer, oblivion, etc.) via a dedicated management page
  3. Allows you to change various Minify settings (cache directory, cache age, debug mode, etc.) directly in admin
  4. Allows you to use CDN for minified contents, one CDN host for JS and one for CSS with SSL support
  5. Allows you to split long Minify strings into shorter ones
  6. Supports script localization (wp_localize_script())
  7. Supports inline styles
  8. Supports media-specific stylesheets (e.g. ‘screen’, ‘print’, etc.)
  9. Supports conditional stylesheets (e.g. <!–[if lt IE 7]>)
  10. Provides hooks for further customization
  11. WordPress Multi-site compatible

If you are on a shared hosting plan, I would recommend this plugin, definitely, the best WordPress minify plugin.

Related Posts: