NO BUG: SVG Favicons missing image/svg+xml type

Bugs
1

Currently when using an svg rel=“icon” for favicons, the spec calls for declaring a type="image/svg+xml"

Notice all the examples with woff or png links in the spec add the type attribute as well: <link>: The External Resource Link element - HTML: HyperText Markup Language | MDN.

In current release of Bricks

<link rel="icon" href="https://wppopupmaker.com/wp-content/uploads/2022/11/mark-light.svg" sizes="32x32">

Should be

<link rel="icon" href="https://wppopupmaker.com/wp-content/uploads/2022/11/mark-light.svg" sizes="32x32" type="image/svg+xml">

It is marked as optional in moz docs, but really it should define the type for png/gif etc as well.

Not a huge deal in Chrome or modern western browsers, but other browsers and even search engines like Yandex don’t recognize them appropriately.

https://yandex.ru/support/webmaster/search-results/create-favicon.html

2

Hi Daniel,
Thanks so much for your report!

Can you please explain briefly or show in the form of screenshots/screencast where and how you add the favicon?

Best regards,
timmse

3

Sure thing. Found the settings in the theme customizer for site icon

image
image712×1098 94.3 KB

So I’m assuming these come from Bricks

image
image1556×146 49.4 KB

Got notices from our Yandex SEO account about the favicons using SVG without the appropriate type attr.

If you guys don’t want to make the change I can understand, but if that is the case can you point me at a filter so I can tweak it or unhook/replace it?

4

Ok, I see. The customizer settings are WordPress’ own functions that we don’t change. Apart from that, WordPress does not seem to provide for the use of SVGs - I fail at the cropping process at the latest.

However, you can also leave the customizer out completely and use a function:

Overall, it’s not a bug :v:

5

Sweet, sorry for the confusion, was following the answer here, just assumed customizer outputs were handled by the Bricks theme directly.

Thanks for the heads up.

6

I encountered this issue today. When attempting to use SVG as a site icon WordPress tries to crop but fails with, “There has been an error cropping your image.”

Using WP-CLI is a workaround:

wp option update site_icon 123

In this example 123 is the ID for the file. You can find the ID by clicking the image in the Media Library and hovering over the “Edit more details” link. Look for the post= value in the URL.

1 Like
7

I was getting the same cropping error when trying to upload an SVG site icon the normal way. Your workaround got it done. Thank you!

1 Like