WordPress.org

Make WordPress Core

Opened 3 years ago

Closed 2 years ago

#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:

Description

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 3 years ago.
Missing logo in WebKit/Blink
svg-logo-ff-screenshot.png (67.0 KB) - added by morganestes 3 years ago.
Logo present in FF
3_9-about.png (55.8 KB) - added by pross 3 years ago.
Chrome Mac, server nginx/fpm
me-add-svg-support.php (1.8 KB) - added by morganestes 2 years ago.
The plugin I use to add SVG to my sites.

Download all attachments as: .zip

Change History (17)

@morganestes
3 years ago

Missing logo in WebKit/Blink

@morganestes
3 years ago

Logo present in FF

#2 @morganestes
3 years ago

  • Keywords ux-feedback 2nd-opinion added

#3 @morganestes
3 years ago

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

#4 @morganestes
3 years ago

  • Keywords 2nd-opinion removed

#5 @jaredatch
3 years ago

  • Cc contact@… added

Yep, encountering this globally as well.

@pross
3 years ago

Chrome Mac, server nginx/fpm

#6 @nacin
3 years ago

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

#7 @iammattthomas
3 years 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.

#8 @morganestes
3 years 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.

#9 follow-up: @johnbillion
3 years 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?

#10 @johnbillion
3 years ago

#25224 was marked as a duplicate.

#11 in reply to: ↑ 9 @morganestes
2 years 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.

#12 @morganestes
2 years 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.

@morganestes
2 years ago

The plugin I use to add SVG to my sites.

#13 @johnbillion
2 years 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.