Twenty Twenty: Minify style.css

[beenni09052005]

The style.css of the twenty-twenty theme can be minified.
To edit it in Theme-Editor, you can keep a unminified version, and when the user saves the changes, this version can be minfied and used in production.

Then there are 2 files style.css (editable in the Theme-Editor) and style.min.css (used in production on the website)

[audrasjb]

Hi @beenni09052005 and welcome to WordPress Trac!

Unfortunately, there is currently no mecanism to minify files in a theme after edition in the Theme Editor.
For the moment, file minification/concatenation falls under plugin s territory.

[ianbelanger]

@audrasjb is correct

There is currently no mechanism to minify files in a theme after edition in the Theme Editor.

I'm going to close this ticket as stylesheet minification is plugin territory.

[westonruter]

@audrasjb I realize that this ticket is about runtime minification after editing a CSS file in the theme file editor, but I wanted to raise a related point:

Since core has CSS minification as part of the build process, shouldn't this be used by themes as well? This would help address things like #47925, where the stylesheet for T19 is 224K but after going through cssmin it is reduced to 196K. It doesn't really make sense for themes to serve the WP theme metadata CSS comment block to browsers. I should think that all .css files in a theme should also have a corresponding .min.css file. Maybe minification has been discouraged in the past to facilitate authors forking a theme and making changes to the CSS, with there being an unexpected result where the minified CSS wouldn't also be updated. Nevertheless, themes like T19, T20, and T21 are already using a build step for the CSS so authors shouldn't be directly modifying the style.css file directly anyway. They should be using the build process to re-generate the CSS instead.

Minifying the CSS will facilitate allowing the stylesheets to be inlined, for example in #63007. Without minification, enqueued CSS will more quickly reach the styles_inline_size_limit.

This ticket was the only one I could find related to minification of theme CSS files, so this is why I'm raising this here. Can you direct me to anywhere that this has been discussed before?

[karmatosed]

@westonruter I would also support minification for themes if this is correctly documented. I think historically it has been as you noted not done because of confusion where to update. However, in many real world situations this is part of the development process.

[sabernhardt]

Classic themes from Twenty Ten to Twenty Twenty call get_stylesheet_uri() for their main stylesheets, so a child theme's style.css would replace its parent stylesheet.

I expect that a patch would need an is_child_theme() check to avoid looking for a minified file in the child theme directory (and/or printing the parent stylesheet inline).

[westonruter]

@karmatosed @sabernhardt Thanks for the feedback! I've filed this all as #63012 where we can take it from here.