Since WordPress 5.9, whether you use full site editing or not, whether your active theme is FSE ready or not, WordPress loads everything needed for global styles from theme.json
on every page of your website.
And I assure you, that’s a lot of styles, that you don’t need.
Why is it a problem to load the global-styles of the complete site edition?
In addition to loading a number of unnecessary styles, which increases the weight of all your pages, it does so inline
(integrated into the code), which is an additional security problem, being a practice not recommended by the OWASP CSP security policy, to the point that if you have this security policy active you may be blocking the loading of your pages because of these styles.
So, if you do not have an FSE-compliant, block theme active, if your theme does not need font sizes, gradients or global colors of the full site edition, it is recommended that you disable the loading of Gutenberg global styles.
How to deactivate Gutenberg FSE global-styles
To disable the loading of all these unnecessary styles from the global-styles
, just execute the following function:
/* Remove FSE global-styles */
add_action( 'wp_enqueue_scripts', 'remove_global_styles' );
function remove_global_styles(){
wp_dequeue_style( 'global-styles' );
}
Code language: JavaScript (javascript)
You can execute the function by adding it to the end of the functions.php
file of the active (child) theme, to your customizations plugin or via some code snippet plugin.
In this guide I explain how to do it if you haven’t done it before:
Save the changes and the global-styles
of the full site edition will no longer be loaded on your pages.