This content originally appeared on Geoff Graham and was authored by Geoff Graham
WordPress has a duotone feature for styling elements — like images — with an SVG filter that overlays and colorizes the thing.

It’s a nice feature! But I can honestly do without it on my own little website. Plus, it does this thing where it injects individual <svg>
elements right above after the <body>
.

That’s a lot more markup than I need for something I ain’t using, and I think it’s more than a little heavy-handed for WordPress to enable this by default.
So how do we nix those SVGs? There’s nothing of the sort in the Block Themes Handbook. There was a debate over this in a related WordPress 5.9 ticket that offers a few possible hooks we could use in functions.php
. Buuuuut none of those seem to work, at least when I try them in WordPress 6.0.2.
In between then and now, though, the theme.json
file seems to have gained the ability to stop those SVGs from being injected:
"settings": {
"color": {
"duotone": null,
"customDuotone": false,
// etc.
Tada!

It’s great we can do this at the theme configuration level. But I also wish it was an opt-in feature rather than something that’s enabled by default.
This content originally appeared on Geoff Graham and was authored by Geoff Graham

Geoff Graham | Sciencx (2022-10-07T18:42:29+00:00) How to remove the SVGs WordPress injects for duotone support. Retrieved from https://www.scien.cx/2022/10/07/how-to-remove-the-svgs-wordpress-injects-for-duotone-support/
Please log in to upload a file.
There are no updates yet.
Click the Upload button above to add an update.