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

srcset and sizes attributes missing from the featured image meta box #20795

Open
johnbillion opened this issue Mar 11, 2020 · 4 comments
Open
Labels
[Feature] Media Anything that impacts the experience of managing media Good First Issue An issue that's suitable for someone looking to contribute for the first time [Status] In Progress Tracking issues with work in progress [Type] Enhancement A suggestion for improvement.

Comments

@johnbillion
Copy link
Member

Describe the bug

When setting a featured image with the classic editor, the image in the meta box contains srcset and sizes attributes which means the potentially very large original image doesn't get displayed.

In Gutenberg these attributes are missing, meaning the original image is used and scaled down in the browser.

To reproduce

  1. Go to Posts -> Add New
  2. Upload a large image and set it as the featured image
  3. Observe that the large original image file is used in the img tag in the Featured Image meta box.

Expected behavior

The same srcset and sizes attributes that the classic editor use should be present.

@mtias mtias added the [Feature] Media Anything that impacts the experience of managing media label Mar 11, 2020
@johnbillion johnbillion added the Good First Issue An issue that's suitable for someone looking to contribute for the first time label Oct 1, 2020
@subject026
Copy link

could I have a look at this?

@johnbillion
Copy link
Member Author

@subject026 Sure, feel free, you don't need to ask!

@thomashigginbotham
Copy link

I submitted a pull request that resolves this issue. #29414

@skorasaurus
Copy link
Member

The current implementation doesn't use srcset; but instead uses the registered_image_sizes to calculate which image size to detect - https://github.com/WordPress/gutenberg/blob/trunk/packages/editor/src/components/post-featured-image/index.js

Any install that has the default register sizes will pick a smaller image; as shown in this example using gutenberg 12.8.1.
Selection_164

@skorasaurus skorasaurus added the [Status] In Progress Tracking issues with work in progress label Mar 20, 2023
@jordesign jordesign added the [Type] Enhancement A suggestion for improvement. label Aug 16, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Feature] Media Anything that impacts the experience of managing media Good First Issue An issue that's suitable for someone looking to contribute for the first time [Status] In Progress Tracking issues with work in progress [Type] Enhancement A suggestion for improvement.
Projects
None yet
Development

No branches or pull requests

6 participants