Disable Load CSS Asynchronously on mobile
If the Load CSS Asynchronously feature is causing layout issues on the mobile version of your site, you can disable this feature for mobile devices only while keeping it for the desktop version.
You'll need to use the following helper plugin:
📥 Download (.zip): WP Rocket | No Optimized CSS Delivery on Mobile
Developers: You can find the code for this plugin on GitHub.
To install and use the plugin please follow these steps:
- Download the helper plugin zip file.
- Install the helper plugin on your site - go to Plugins → Add New → Upload plugin and select the zip file.
- Activate the plugin.
- Clear WP Rocket's cache.
We also have this useful article on how to tackle Load CSS Asynchronously related layout issues: Critical CSS issues and FOUC. Those are the options we recommend trying first. However, if none of them work or if you simply prefer, you can use the helper plugin above.
WP Rocket versions older than 3.16
For the WP Rocket | No Optimized CSS Delivery on Mobile to work on WP Rocket versions older than 3.16, the Separate cache files for mobile devices sub-option must be enabled.