How to Fix Problems Caused by CSS/JS Optimization

Please Note: This wiki is valid for v2.9.x and below of the LiteSpeed Cache Plugin for WordPress. If you are using v3.0 or above, please see the new documentation.

For the purpose of speeding up your WordPress site, the LSCache plugin provides Optimization functions, which include Minify, Combine, and Push.

In some cases when all of the optimization functions are enabled, you may find that your page formatting is broken. This wiki will show you how to fix a CSS Combine issue by disabling it for the offending style sheets. Other cases,(e.g. JS Combine, Push, etc.) may be solved in a similar way.

Before we begin, please open your browser's developer tool to help you check the issue.

When only CSS Minify is ON, there is no issue

When both CSS Minify is ON and CSS Combine is ON, an issue occurrs: the product image does not display normally.

First, disable CSS Minify so that you may see the CSS file clearly.

You are going to want to find the CSS file that is causing the problem, and exclude it from optimization. There are a few ways to do that. You can exclude every CSS file that is associated with a particular plugin (option 1 below), or exclude one specific CSS file (option 2). Either way, you will use the CSS Excludes box on the LiteSpeed Cache > Settings > Tuning tab.

  1. Method 1: Click the name of the first CSS file on the left side, so you can see the full path of the plugin. One plugin may have multiple CSS files, so you can exclude every one of them by entering the plugin's partial path (in this case woocommerce-tm-extra-product-options) in the CSS Excludes box.
  2. Method 2: Alternately, you can try excluding just one CSS file by entering the file name (in this case woocommerce-smallscreen.css) in the CSS Excludes box.

Turn CSS Minify ON + CSS Combine ON again. Click Purge All button. The page now displays normally and we can see that woocommerce-smallscreen.css is not optimized.

If you didn't guess the right CSS file, and you are still seeing a badly-formatted page, try the process above again with another CSS file.

If you have any LSCache plugin suggestions or questions, you are welcome to visit the forum.

  • Admin
  • Last modified: 2020/05/04 13:51
  • by Shivam Saluja