Inline CSS Checker
Dear developer:
Inline CSS is the bane of our existence. But clients and marketing types love it and use it all the time. Probably because we aren't giving them the flexibility they need.
Inline CSS builds up over time and creates technical debt and visual inconsistencies in our website designs. These become more and more expensive to even identify, much less fix.
This tool makes finding inline CSS a little easier.
1. Install.
Turn on the module. It provides a permission called scan for inline css
. If necessary, grant this permission to a user.
2. Navigate to admin/content/inline-css-checker
You'll see nothing; you haven't scanned yet. Click the button. If your site has a lot of content, grab a coffee or work on something else for a couple minutes.
3. All nodes with inline CSS are ready for your review.
Specifically, all those that either use the <style>
tag or the style=""
attribute on another tag.
No shady regular expressions here; the module uses bona fide XPath selection. So you know it will find everything.
4. Rejoice.
You're one step closer to putting that inline CSS where it belongs.
Yours truly,
wizonesolutions
Related modules
Code per Node (CPN) — once you've found all the inline CSS lurking in your site's pages, consider letting your inline CSS lovers still add it (and/or JavaScript) using this module. If you have used CSS Injector, it's a similar concept, but it supports JavaScript as well, and it looks a bit more integrated with the publishing workflow.
Credit where credit is due
Sponsored by Project Ricochet.
Potential improvements
- Allow scanning more than just nodes (e.g. Panel Panes, Views, etc.) — not very hard since we just render the render array and then check that.
- Allow configuring how many nodes to scan at once.
- Make paging configurable.
- Actual tests (set up a test node with style tags/attributes, check if the module finds them like we expect). Needs some refactoring to make the functionality more testable. Not sure if Batch API stuff can be tested.
Patches welcome and will be committed with proper attribution to you.