Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

WordPress image sizes for SVG #47

Open
1 task done
cadic opened this issue Mar 21, 2022 · 2 comments
Open
1 task done

WordPress image sizes for SVG #47

cadic opened this issue Mar 21, 2022 · 2 comments
Labels
help wanted Extra attention is needed type:bug Something isn't working.

Comments

@cadic
Copy link
Contributor

cadic commented Mar 21, 2022

Describe the bug

When inserting SVG to the post, or using wp_get_attachment_image() function with custom image size ('large', 'medium', 'thumbnail', etc.) we always receive the full SVG src (which is normal) and incorrect (full-size or square) image dimensions in width and height attributes.

Steps to Reproduce

Displaying SVG programmatically

$att_id = 454;
echo wp_get_attachment_image( $att_id, 'full' );
echo wp_get_attachment_image( $att_id, 'medium' );

Both resulting images have the same width and height. Expected to have 300x152 for medium size.

<img width="406" height="206" src=/wp-content/uploads/2022/03/image.svg" class="attachment-full size-full" alt="" loading="lazy">
<img width="406" height="206" src=/wp-content/uploads/2022/03/image.svg" class="attachment-medium size-medium" alt="" loading="lazy">

Adding SVG in Block Editor

Regardless of the selected Image Size in the Block Properties, the Image Dimensions remain the same (full size) and the resulting image still have full dimensions in width and height attributes. Expected to have width="300" height="152" in this example

<figure class="wp-block-image size-medium"><img width="406" height="206" src="/wp-content/uploads/2022/03/image.svg" alt="" class="wp-image-454"></figure>

Adding SVG in Classic Editor

The image width and height attributes respect the selected size (medium) but represent the square 300x300. Expected to have the height="152"

<img class="alignnone wp-image-454 size-medium" role="img" src="/wp-content/uploads/2022/03/image.svg" alt="" width="300" height="300" />

Environment information

Previous release Safe SVG 1.9.9
(or develop with merged fix/23)

Code of Conduct

  • I agree to follow this project's Code of Conduct
@cadic cadic added the type:bug Something isn't working. label Mar 21, 2022
@cadic
Copy link
Contributor Author

cadic commented Mar 21, 2022

As mentioned in my comments to the PR#44 #44 (comment) and #44 (comment), the root cause is WordPress core function image_downsize() which always returns square size for SVG images, even if they are rectangular.

The image_downsize filter allows us to make custom image size calculations.

@vikrampm1 vikrampm1 moved this to Incoming in Open Source Practice Mar 21, 2022
@jeffpaul jeffpaul moved this from Incoming to Backlog in Open Source Practice Apr 5, 2022
@jeffpaul jeffpaul added this to the Future Release milestone Apr 5, 2022
@jeffpaul
Copy link
Member

@darylldoyle any thoughts on how best to handle this issue?

@jeffpaul jeffpaul added the help wanted Extra attention is needed label Jan 16, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
help wanted Extra attention is needed type:bug Something isn't working.
Projects
None yet
Development

No branches or pull requests

2 participants