Obsolete: About using Dark Reader extension while composing Blogger posts without creating darkreader CSS and data attr bloat

Last updated on 28 April 2026

Update: Late April 2026

The findings and "No Bloat" strategies detailed in this March 2026 post are no longer considered reliable. In late April 2026, I did some tests and analysis which are covered in this post: In Dark Reader extension On state, sometimes Blogger Edit Post HTML temporarily shows Dark Reader attributes and styles. This revealed that if the Dark Reader extension is On, and we switch from Compose to Edit HTML view in Blogger, attributes (such as `data-darkreader-`) and CSS variables of Dark Reader extension are added by Blogger in the HTML view temporarily. But if we make some changes to the post and save it, in all probability, these injected Dark Reader attributes and styles would be saved to the post on the server and thus become hardcoded post bloat. 

Because it is difficult to predict or control exactly when Blogger performs DOM serialization behind the scenes which is probably what introduces these Dark Reader attributes and styles, leaving the Dark Reader extension turned "On" while composing, makes it nearly impossible to guarantee clean HTML. To definitively prevent this extension-induced bloat, the Dark Reader extension must be disabled entirely while editing posts in Blogger. 

The post contents below must be considered obsolete.

==============================

Dark Reader extension is very helpful in giving dark mode in Blogger Compose window. If we know exactly in which use cases Dark Reader injects its CSS and data attributes bloat to the post HTML and in which use cases it does not, we can avoid the former and use only the latter.


With Dark Reader extension in "On" state:
  • No Bloat: Typing directly in Compose mode in a div block which does not have Dark Reader styles (--darkreader-) or custom data attributes (data-darkreader-), does NOT inject Dark Reader styles and custom data attributes in the post HTML. So creating a fresh div block in with few dummy characters in 'Edit HTML' mode and then switching back to Compose mode and typing within those dummy characters should result in no Dark Reader styles and data attributes being injected.
  • No Bloat: Special case of above is Compose mode for a new post which will not have any div blocks with Dark Reader CSS and data attributes.
  • No Bloat: Adding HTML code that does not have Dark Reader CSS and data attributes in 'Edit HTML' mode.
  • No Bloat: Special case of above is when Gemini or ChatGPT responses are copied as Markdown code into a Markdown to HTML editor like https://markdowntohtml.com/ and the 'raw HTML' of converted HTML is added to blog post in 'Edit HTML' mode. Note that preview pane rendered HTML should not be copied as that may bring in Dark Reader CSS and data attributes. Related post: How to copy-paste Gemini (and ChatGPT) Chats to Blogger posts without CSS bloat.

  • Bloat: Typing directly in Compose mode in a div block which already has Dark Reader styles and custom data attributes, injects Dark Reader styles and custom data attributes in the post HTML.
  • Bloat: Copy-pasting in Compose mode from another web page injects Dark Reader styles and custom data attributes.

Comments

Post a Comment