FacetWP works well with Cloudflare, but there are a few settings you can disable if you run into any issues. Within Cloudflare’s dashboard, browse to Speed > Optimization.

Auto Minify

If your facets are not loading, try un-checking the “JavaScript” and “HTML” boxes.

Using FacetWP with Cloudflare Auto Minify

HTML minification and the facetwp-template class

The above Auto Minify “HTML” setting strips HTML comments from listing pages. On all types of listing templates (except ones that use a FacetWP shortcode template) this will cause problems, because FacetWP needs the <!--fwp-loop--> HTML comment to automatically add a facetwp-template class on the element surrounding the results. This class is needed to dynamically replace the HTML within this element when filtering. Without this class, FacetWP does not know which content to dynamically replace.

Turning off HTML minification fixes this problem. However, if you want to keep HTML minification, you also can also add the facetwp-template class to your templates manually. Simply add the class to the parent element of your post loop. On WooCommerce shop pages, you can use these hooks that do the same.

If you manually add the “facetwp-template” class, make sure that all your facets are outside of it.

Rocket Loader™

Also try disabling Rocket Loader™. This setting forces all scripts to load asynchronously, which can cause issues with FacetWP.

Using FacetWP with Cloudflare Rocket Loader

See also