How to exclude specific inline CSS?

  • Resolved websevendev

    (@websevendev)


    2 years ago

    I have enabled JS, CSS and HTML minification, as well as “Also minify inline JS/ CSS?” under HTML.

    I have a <style id="specific-id">.bunch-of-css-already-minified{}</style> inside my pages that I want to exclude.

    Not to prevent double minification, but because the CSS is “modern” and the minification library that this plugin is using can’t handle it and it literally just deletes all the CSS.

    I tried to add the “specific-id” to “Exclude CSS from Autoptimize:” field, but it didn’t exclude.

    I tried to add <style id="specific-id" data-noptimize="1"> attribute but it didn’t exclude.

    I also tried to prepend the comment /* dont-optimize-this */ to the CSS contents and then added “dont-optimize-this” to the “Exclude CSS from Autoptimize” field, but no cigar. Does the field simply not work for inline CSS? What sort of value is it expecting?

    Any ideas how to exclude?

Viewing 4 replies - 1 through 4 (of 4 total)
  • Plugin Author Optimizing Matters

    (@optimizingmatters)

    2 years ago

    excluding by ID should work, so should data-noptimize, so my hunch is something’s broken somehow. can you share a link to a page that has that inline CSS?

    frank

    Thread Starter websevendev

    (@websevendev)

    2 years ago

    Well here’s a simple reproduction:

    add_action('wp_head', function() {
	printf('<style id="specific-id">body { color: red; }</style>');
}, 1000);

    Not minified, it produces:

    <style id="specific-id">body { color: red; }</style>

    enabling Autoptimize with “HTML -> Also minify inline JS/ CSS?” it produces:

    <style id="specific-id">body{color:red}</style>

    so it’s minified.

    Adding specific-id to “Exclude CSS from Autoptimize” doesn’t change that.

    Plugin Author Optimizing Matters

    (@optimizingmatters)

    2 years ago

    OK, I finally understand what’s going on (I’m slow like that) 🙂

    the issue indeed is that “also minify inline JS/CSS” is “stupid”, in the sense that it either minifies all or minifies nothing at all. the functionality is part of the HTML minifier and there (currently) is no way to make it honor the exclusions of the CSS & JS minifiers. that might change in the future, but I don’t have an ETA I’m afraid :-/

    Thread Starter websevendev

    (@websevendev)

    2 years ago

    I see, thanks!

Viewing 4 replies - 1 through 4 (of 4 total)

The topic ‘How to exclude specific inline CSS?’ is closed to new replies.