Chapter 3. Getting Started
Prev   Next

Chapter 3. Getting Started

Table of Contents

Configure Plugin
Combining CSS and Javascript files
Automatic Settings Group
Excluding files and declaration blocks

Configuring and Using the Plugin

First Steps in Configuring the Plugin

The plugin comes with a number of features to optimize your site. Each feature performs a particular front end optimization technique to reduce http requests or reduce the size of the files to be downloaded by the browser so the download speed can be increased, or to simply speed up the rendering of your site so your visitors can start viewing your content quicker. Most features come with a number of options for you to configure on your site.

[Important]Important

While the default settings of each feature work well for most persons, there is a small chance that they may break your site. This doesn't mean the plugin is incompatible with your website or template, the plugin just needs to be configured individually for your site. This documentation attempts to arm you with all the information you need to get the plugin working well on your site. You can also make use of our various support options to get assistance in configuring the plugin to resolve conflicts.

The core feature of the plugin is to combine css and javascript files together in one to reduce http requests and you'll find this feature on the Basic Options tab. This feature is enabled by default so you generally start by configuring this feature first and ensure it works well before enabling the other features.

Disable caching

While configuring the plugin, disable all caching plugins or native caching functionalities in the site that caches the page of the site. Disabling cache ensures that you can view the changes made to the site immediately. After you've finished configuring the plugin, flush all your cache before re-enabling caching.

Also disable all other plugins and features that combine or minify your CSS, javascript or HTML files. Your template may have these features or you may have them enabled if you're using CloudFlare. Having two extensions performing these functions are just a waste of overheads and you increase the risks of conflicts between the extensions. You won't get more optimization from doing this twice.


  1. Configure the Combine files feature first

    After enabling the plugin, configure the Combine CSS and javascript files feature first before enabling any other feature because this feature is most likely to break your site. This feature comes with six Automatic Settings to configure your site. The settings are represented by six buttons labelled Minimum, Intermediate, Average, Deluxe, Premium, and Optimum.

    Automatic Settings

    The Automatic Settings

    The level of optimization increases as you move from Minimum to Optimum but the risks of conflicts also increases. Try each setting in turn, checking your site after each turn to ensure it works well. Choose the highest setting that works for your site.

    [Warning]Warning

    The Optimum setting doesn't work for every site. If that setting causes conflicts try using a lower setting like Premium or Deluxe.

  2. Ensure the plugin is working properly

    After enabling the plugin and selecting one of the Automatic Setting, you should ensure that the plugin is working properly and running on your site. You do that by checking the source of your page. The source is the actual text that was sent to the browser from the server and you can view this in most browsers by right clicking on the page and selecting View Source or equivalent menu item.

    Minimum Setting

    The source of the page using Minimum Setting

    If the plugin is working then you should see the JCH Optimize generated links to the combined files in place of the individual javascript and CSS files.

    [Note]Note

    You will probably see more than one JCH Optimize combined CSS or javascript files when using the Minimum, Intermediate, or Average setting. These settings attempt to preserve the original execution order of files on the page. To preserve the original execution order of the files, the plugin breaks the combined files around the excluded files/codes.

  3. Configure the other features

    After configuring the Combine CSS and javascript files feature, enable each of the other features one at a time, again checking your site after enabling each feature. If a feature doesn't work well with your site then you may need to configure the options of that feature to get it working or disable it.

What if there are conflicts?

If you experience any conflicts while configuring the plugin, read the section on how to resolve conflicts by excluding files. This section describes how to resolve conflicts by finding and excluding the offending file(s) from the combined files. You should be able to get up to the Average setting working, or possibly higher, using the method described in the section.

[Note]Note

Each setting is applied globally so you should ensure that the setting you choose works for all the pages of your website.

[Important]Important

Remember to flush your cache before re-enabling if you were using caching.

[Note]Note

The plugin doesn't make any changes to any codes on your site. Any apparent changes made by the plugin can be reversed by disabling the plugin. Any perceived persistent change will be due to caching so you just need to flush your website cache, server cache and browser cache to restore the original look of the site.


Prev   Next
Installing on WordPress Home Combining CSS and Javascript files