Minifying CSS and JavaScript with LiteSpeed Cache

Minifying CSS and JavaScript with LiteSpeed Cache

Learn how to minify your website's code with the LiteSpeed Cache plugin. Minifying removes the spaces and comments from your CSS, JavaScript and HTML, which makes each page smaller to download. It does not change how your website looks.

Steps

  1. Log in to your WordPress admin dashboard. See Logging in to WordPress from the Zeniar Portal
  2. Select LiteSpeed Cache from the left-hand menu, then click Page Optimization
  3. On the CSS Settings tab, switch CSS Minify on and click Save Changes
  4. On the JS Settings tab, switch JS Minify on and click Save Changes
  5. On the HTML Settings tab, switch HTML Minify on and click Save Changes
  6. Purge the cache. See Purging the LiteSpeed Cache in WordPress
  7. Open your website in a private or incognito window and test it carefully, including menus, forms, sliders and, for a shop, the checkout

Important: If something stops working, switch off the setting you changed last, save and purge the cache again. Changing one setting at a time makes it easy to tell which one caused the problem.

Please note: Leave CSS Combine, JS Combine and Load JS Deferred switched off unless you are prepared to test thoroughly. They give a further gain but are the settings most likely to break a theme or plugin. Leave Generate UCSS and Load CSS Asynchronously off as well, as they rely on an outside online service.

Note: If one script causes the problem, you can leave it out by adding its file name to JS Excludes on the Tuning tab.

Your pages are now smaller and quicker to download.

If Your Layout Breaks