Create your own global-styles-css file instead of global-styles-inline-css for WordPress Block Theme

[matteoFeduzi]

I am creating a block theme for some personal use sites and I want to optimize it as much as possible. So I don't need default colors and other stuff that Gutenberg injects unnecessarily for my purpose.

I am using this code in my functions.php file and it correctly removes the main files that are useless to me that Gutenberg injects:

function heisenberg_enqueue_scripts()
{
  wp_dequeue_style('wp-block-library');
  wp_dequeue_style('core-block-supports');
  wp_dequeue_style('global-styles');
}
add_action('wp_enqueue_scripts', 'heisenberg_enqueue_scripts');

Now, however, I want to create my global-styles-css file, perhaps via file and not inline so that it can also be managed simply from the cache.

I am using theme.json and would like to retrieve theme information from there along the lines of what Gutenberg already does, any ideas for code?

[aaronrobertshaw]

Hi @matteoFeduzi 👋

There's a good chance I'm not following your use case but if you are looking to generate your own CSS stylesheet based on theme.json data there are a few places within the Gutenberg code base that might provide some insight as to how you could achieve that.

The default global styles stylesheet you are dequeuing is initially setup via a wp_enqueue_scripts action gutenberg_enqueue_global_styles. The actual creation of the stylesheet is handled via gutenberg_get_global_stylesheet.

When generating the stylesheet you can restrict it to specific "types" of styles as well e.g. variables, presets, or styles. Also, there are some filters available for theme.json data in case you are interested in generating a stylesheet from a given subset of data.

As you marked this issue as [Type] Enhancement could you add some details on what particular enhancement you're proposing for Gutenberg itself?