Ever wished you could add a little something extra to a Gutenberg block’s HTML without resorting to hacky workarounds? Meet the WP_HTML_Tag_Processor – a powerful yet approachable tool in WordPress core that lets you modify HTML tag attributes on the fly. We’ll explore how to harness this new API to safely tweak the output of core blocks and make them do your bidding (no advanced wizardry required, but having some knowledge on how to customize blocks would be helpful!).
We’ll start with a quick intro to what WP_HTML_Tag_Processor is and why it makes customizing blocks easier (hint: no more fragile regex or heavy DOM parsing). Then we’ll dive into practical examples that developers of all levels can appreciate. For instance, you’ll learn how to lazy-load videos (both the core block and cover). Next, we’ll show how to sprinkle custom attributes on column blocks (imagine adding a role when the columns are more representative of a list) to adapt core layouts to your project’s needs.