Make WordPress Core

#26591 closed defect (bug) (invalid)

SVG logo doesn't display in WebKit/Blink browsers

Reported by: morganestes Owned by:
Milestone: Priority: normal
Severity: normal Version: 3.8
Component: Administration Keywords:
Focuses: ui Cc:


First noticed in 3.8 update, still happening in trunk. Tested using DesktopServer 3.6.1 (Apache/2.4.4 (Unix) PHP/5.4.19 OpenSSL/1.0.1e mod_perl/2.0.8-dev Perl/v5.16.3).

When viewing the wp-admin/about.php page, the WP logo is missing in Chrome, Safari, and Opera on Mac. Since those browsers supports SVG, the CSS falls through the PNG version and tries to display the SVG but it isn't recognized (lined out in the inspector). This doesn't happen in Firefox.

I'm running Apache, and adding the SVG support to .htaccess in the root directory works for me, but I don't think it's a solid solution for fixing across the board. Since it works in Firefox without adding these lines, I'm wondering if there's a better solution for general use.

http://www.w3.org/services/svg-server/ gives solutions to add support to servers, but I'd like to find something that works on first install if the browser supports it.

Attachments (4)

wp-missing-logo-screenshot.png (38.0 KB) - added by morganestes 21 months ago.
Missing logo in WebKit/Blink
svg-logo-ff-screenshot.png (67.0 KB) - added by morganestes 21 months ago.
Logo present in FF
3_9-about.png (55.8 KB) - added by pross 20 months ago.
Chrome Mac, server nginx/fpm
me-add-svg-support.php (1.8 KB) - added by morganestes 17 months ago.
The plugin I use to add SVG to my sites.

Download all attachments as: .zip

Change History (17)

@morganestes21 months ago

Missing logo in WebKit/Blink

@morganestes21 months ago

Logo present in FF

comment:2 @morganestes20 months ago

  • Keywords ux-feedback 2nd-opinion added

comment:3 @morganestes20 months ago

This also affects the login page, and anyplace else that SVG is being used.

comment:4 @morganestes20 months ago

  • Keywords 2nd-opinion removed

comment:5 @jaredatch20 months ago

  • Cc contact@… added

Yep, encountering this globally as well.

@pross20 months ago

Chrome Mac, server nginx/fpm

comment:6 @nacin19 months ago

  • Component changed from Graphic Design to Administration
  • Focuses ui added

comment:7 @iammattthomas18 months ago

Don't believe I have a suggestion here since it appears to be a server configuration issue from Sergey's comment here: https://core.trac.wordpress.org/ticket/25224#comment:10

If it's a persistent problem, there are two other possible solutions -- adding full-size versions of the W logo to Dashicons, and using dashicons there (the existing W logos in Dashicons are specially tweaked for small sizes only). Or, go retro with 1x and 2x PNGs.

comment:8 @morganestes18 months ago

The weird part of it is that FF displays it without any extra server configuration, but it takes adding a few lines to the .htaccess to enable SVG, even though Chrome says it supports it.

Just looked again at 3.9-alpha-27368-src and it's displaying the PNG, but the body class shows svg, so I'd expect the SVG to be displayed over the PNG. It's starting to make my head hurt thinking about all the ways this is so wrong.

comment:9 follow-up: @johnbillion18 months ago

  • Keywords close added; ux-feedback removed
  • Version changed from trunk to 3.8

I saw this too the other day one one particular shared host install. SVG files on the server are being served with mime type text/plain. The problem is on the server side, not the client side, although as you noted some browsers do still display the SVG file despite the mime type.

Not sure there is anything core can do here, short of adding a mime type declaration to .htaccess.

Any suggestions?

comment:10 @johnbillion18 months ago

#25224 was marked as a duplicate.

comment:11 in reply to: ↑ 9 @morganestes17 months ago

Replying to johnbillion:

Not sure there is anything core can do here, short of adding a mime type declaration to .htaccess.

I've written a plugin that does this, but it seems a bit of a hack since I can't guarantee it works on anything other than Chrome on Apache httpd, and it feels like that's overstepping core's bounds.

I'll work on cleaning it up and releasing it as a public plugin, but if I find a better solution I'll either reopen this ticket or create a new one.

comment:12 @morganestes17 months ago

I added the plugin code I use to https://gist.github.com/morganestes/10066447, along with instructions on how to use. I've gone ahead and attached it to this ticket, also.

@morganestes17 months ago

The plugin I use to add SVG to my sites.

comment:13 @johnbillion17 months ago

  • Keywords close removed
  • Milestone Awaiting Review deleted
  • Resolution set to invalid
  • Status changed from new to closed

As frustrating as it is, this is a server-level issue and not really up to WordPress to fix. Closing as invalid. If anyone thinks otherwise or has a suggestion how we could fix this in a nice cross-server way then please re-open.

Note: See TracTickets for help on using tickets.