How to Setup CSS & JS Minification with Better WP Minify

Posted OnDec 31, 2014     CategoryPlugins     CommentsNo comment

The second part of the guide to the Better WP Minify WordPress plugin will show you how to setup CSS & JavaScript minifcation.

Step 1) Login to the WordPress Dashboard.

Step 2) Scroll down the left-hand sidebar of your websites Dashboard and choose BWP Minify -> General Options.

1

Step 3) The General Options start with the plugin functionality. From here, you can set whether or not you want JS and CSS files to be minified automatically. You can also choose to minify the bloginfo() sylesheets, if your theme uses this stylesheet. Some themes don’t have a separate stylesheet for this, so check first.

2

Step 4) Enabling the Leave external files at their original positions function will improve compatibility with plugins and themes that print external CSS and JS files directly and avoid any confusion between plugins.

3

Step 5) You can create a URL path to your minified library, or leave it blank to use the default provided by the plugin. You can also edit the maximum number of files the minified string can contain.

4

Step 6) When you want to refresh your cache, choose one of the cache buster options provided in the dropdown menu. You can choose between your WordPress current version, the cache folders last modified time and your themes latest version.

5

Step 7) A WordPress root document is need to ensure that Minify can find all of your JS and CSS files and minify them. Leave this section blank if you want to use the default value, or enter your own. Only use your own if you are absolutely certain that you know what you’re doing, or files might be missed out when you minify them.

6

Step 8) The cache directory is where your combined and minified files are cached and stored. You can keep the default value, or change the Cache directory setting to your desired directory. To do this, you will have to make sure the new directory is writable by your webserver. This will mean that Minify will be able to serve minified contents faster.

7

Step 9) By enabling the bubble CSS import, this will move all @import rules in CSS files to the top. These occur sometimes when CSS files are combined, and can destabilise and sometimes invalidate stylesheets. By moving them to the top, you can view them right away and straighten them out. Enabling cache locking will prevent multiple servers creating a cached copy of your files. You only need to enable debugging it minification doesn’t work as expected.

8

Step 10) At the bottom of the page, you can save your changes, save changes and flush the cache, or simply flush the cache as you see fit.

9

The next step of the guide will focus on How to Configure Better WP Minify for Friendly URLs and CDN Support.

 


Leave a Reply

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

Send this to friend