Make WordPress Core

Opened 5 years ago

Closed 5 years ago

Last modified 5 years ago

#37141 closed defect (bug) (maybelater)

SVG image used as featured images set to 0px by 0px

Reported by: theMikeD Owned by:
Milestone: Priority: normal
Severity: normal Version: 4.5.2
Component: Media Keywords:
Focuses: Cc:


This is a follow-up to #26256.

What I see when an SVG is used as a featured image is this:

<a href="http://insights.dev/wordpress/wp-admin/media-upload.php?post_id=13&amp;type=image&amp;TB_iframe=1" id="set-post-thumbnail" aria-describedby="set-post-thumbnail-desc" class="thickbox">
<img width="1" height="1" src="http://insights.dev/wp-content/uploads/2015/06/Gen.Demo_Icon-01.svg" class="attachment-266x266 size-266x266" alt="Gen.Demo_Icon-01">

Selecting the img tag in chrome inspector shows width and height as 0px, actual value auto.

If I set a width manually on the <a> tag, I see the svg just fine

twentyfifteen theme, no plugins active.

Change History (3)

#1 @theMikeD
5 years ago

#postimagediv .inside p:first-of-type a { min-width: 300px; }

That fixes it FTR. But that's clearly a hack.

#2 @joemcgill
5 years ago

  • Milestone Awaiting Review deleted
  • Resolution set to maybelater
  • Status changed from new to closed

Hi @theMikeD,

Thanks for the report. WordPress doesn't currently support uploading SVG files natively to the media library due to security concerns over allowing users to upload XML (see #24251). For that reason, I don't think this is a bug core necessarily needs to fix for now.

However, in the mean time I would suggest filtering the output of the image markup for featured images using the post_thumbnail_html filter to strip off the height and width attributes if needed (or to modify them to your liking).

#3 @theMikeD
5 years ago

To be clear, I'm talking about the display of the SVG file in the admin area. Setting a width and height on the svg file doesn't work, setting a width on the containing <a> works. So the only thing I found that does it is to add an admin-specific css file that contains

#postimagediv .inside p:first-of-type a { min-width: 300px; !important; }
#postimagediv .inside img { max-width: 300px; }

If you're saying this is a wontfix then I'll leave my hack in place. Thanks for the guidance.

Note: See TracTickets for help on using tickets.