This changeset implements the refined lazy-loading behavior outlined in https://make.wordpress.org/core/2021/07/15/refining-wordpress-cores-lazy-loading-implementation/ in order to improve the Largest Contentful Paint metric, which can see a regression from images or iframes above the fold being lazy-loaded. Adjusting this so far has been possible for developers via filters and still is, however this enhancement brings a more accurate behavior out of the box for the majority of themes.
Specifically, this changeset skips the very first "content image or iframe" on the page from being lazy-loaded. "Content image or iframe" denotes any image or iframe that is found within content of any post in the current main query loop as well as any featured image of such a post. This applies both to "singular" as well as "archive" content: On a "singular" page the first image/iframe of the post is not lazy-loaded, while on an "archive" page the first image/iframe of the _first_ post in the query is not lazy-loaded.
This approach refines the lazy-loading behavior correctly for the majority of themes, which use a single-column layout for post content. For themes with multi-column layouts, a new `wp_omit_loading_attr_threshold` filter can be used to change how many of the first images/iframes are being skipped from lazy-loaded (default is `1`). For example, a theme using a three-column grid of latest posts for archives could use the filter to override the threshold to `3` on archive pages, so that the first three content images/iframes would not be lazy-loaded.
Props adamsilverstein, azaozz, flixos90, hellofromtonya, jonoaldersonwp, mte90, rviscomi, tweetythierry, westonruter.
Fixes#53675. See #50425.
Built from https://develop.svn.wordpress.org/trunk@52065
git-svn-id: http://core.svn.wordpress.org/trunk@51657 1a063a9b-81f0-0310-95a4-ce76da25c4cd
* Audio
* Video
* Unattached
This allows for more homogeneous translations in languages where keeping a plural form is important.
Follow-up to [6910], [7397], [8901], [9556], [11749], [13100], [12110], [15491], [15578], [22743], [29426], [29625], [34256], [45651], [46437].
Props jdy68, audrasjb, SergeyBiryukov.
Fixes#54238.
Built from https://develop.svn.wordpress.org/trunk@51903
git-svn-id: http://core.svn.wordpress.org/trunk@51496 1a063a9b-81f0-0310-95a4-ce76da25c4cd
The shortcode content is expected to be a string, not `null`. `do_shortcode()` expects a string for `$content`.
The `img_caption_shortcode()` also expects a string for the `$content` parameter and is expected to return a string for the HTML content to display the caption.
Prior to this commit:
The default value for the `$content` parameter was set to `null`. If no `$content` was passed, the function:
- could return `null` when the `$atts['width'] < 1` or there was no caption
- else, it invoked `do_shortcode( $content )` passing `null` which on PHP 8.1+ triggers a deprecation notice:
{{{
strpos(): Passing null to parameter #1 ($haystack) of type string is deprecated
}}}
This commit:
- Fixes the default `$content` value to align to the expected shortcode content of `string`, not `null`.
- Fixes the PHP 8.1 deprecation notice when `null` was being passed to `do_shortcode()`.
- Changes the assertion in a couple of tests to check for the empty string instead of `null.
Follow-up to [8196], [8925], [8239], [26915], [31530], [42704].
Props jrf, hellofromTonya, azaozz, joedolson.
See #53635.
Built from https://develop.svn.wordpress.org/trunk@51816
git-svn-id: http://core.svn.wordpress.org/trunk@51423 1a063a9b-81f0-0310-95a4-ce76da25c4cd
Replace infinitely autoloading behavior on scroll with a user-controlled load more button. Fix a long standing accessibility issue in the media library. Infinite scroll poses a wide range of problems for accessibility, usability, and performance.
This change modifies the library to load 40 items in the initial view, with a load more button to load the next 40 items and a button to move focus from the load more region to the first of the most recently added items.
The text for communicating the jump target was broadly discussed, agreeing that the text incorporated here would most concisely and clearly convey the purpose of the button, and any further detail is learnable from use.
Props afercia, adamsilverstein, joedolson, audrasjb, francina
Fixes#50105. See #40330.
Built from https://develop.svn.wordpress.org/trunk@50829
git-svn-id: http://core.svn.wordpress.org/trunk@50438 1a063a9b-81f0-0310-95a4-ce76da25c4cd
* Document that WebP constants are only defined in PHP 7.1+.
* Correct the `$filename` parameter type in `wp_get_webp_info()`.
* Use a consistent message when skipping tests due to the lack of WebP support.
* Remove unnecessary `else` branches after `markTestSkipped()`.
* Replace `assertEquals()` with more appropriate assertions.
Follow-up to [50810].
See #35725.
Built from https://develop.svn.wordpress.org/trunk@50814
git-svn-id: http://core.svn.wordpress.org/trunk@50423 1a063a9b-81f0-0310-95a4-ce76da25c4cd
Add support for uploading, editing and saving WebP images when supported by the server.
Add 'image/webp' to supported mime types. Correctly identify WebP images and sizes even when PHP doesn't support WebP. Resize uploaded WebP files (when supported) and use for front end markup.
Props markoheijne, blobfolio, Clorith, joemcgill, atjn, desrosj, spacedmonkey, marylauc, mikeschroder, hellofromtonya, flixos90.
Fixes#35725.
Built from https://develop.svn.wordpress.org/trunk@50810
git-svn-id: http://core.svn.wordpress.org/trunk@50419 1a063a9b-81f0-0310-95a4-ce76da25c4cd
Improve the check for sourceless or dimensionless media when determining if the lazy loading attribute should be added to iframes and images. Never include the lazy loading attribute on embeds of WordPress posts as the iframe is initially hidden.
Including `loading="lazy"` on initially hidden iframes and images can prevent the media from loading in some browsers.
Props adamsilverstein, fabianpimminger, flixos90, johnbillion, jonkastonka, joyously, peterwilsoncc, SergeyBiryukov, SirStuey, swissspidy.
Fixes#52768.
Built from https://develop.svn.wordpress.org/trunk@50682
git-svn-id: http://core.svn.wordpress.org/trunk@50291 1a063a9b-81f0-0310-95a4-ce76da25c4cd
In the wrapper function `wp_getimagesize()` check if the second parameter was passed before sending it to the PHP function `getimagesize()`.
The PHP function has a different execution path depending on the number of parameters passed, this ensures the wrapper function follows the appropriate path.
Follow up to [50552].
Props azaozz, hellofromtonya, Mista-Flo, peterwilsoncc, rinatkhaziev, RogerTheriault, SergeyBiryukov, terriann, whyisjake.
Fixes#52826.
Built from https://develop.svn.wordpress.org/trunk@50586
git-svn-id: http://core.svn.wordpress.org/trunk@50199 1a063a9b-81f0-0310-95a4-ce76da25c4cd
When using the `adjacent_image_link()` function there is a condition that will return a linked image. Previously, the returned image was sent without alt attributes.
Now, `adjacent_image_link()` will include alt attributes of the image's title when an image is returned.
Props joedolson, Mista-Flo, sabernhardt.
Fixes#52387.
Built from https://develop.svn.wordpress.org/trunk@50274
git-svn-id: http://core.svn.wordpress.org/trunk@49919 1a063a9b-81f0-0310-95a4-ce76da25c4cd
Previously, we used `DIR_TESTDATA` to determine if a test should skip a newly silenced error in `wp_getimagesize()`.
We are now using `WP_RUN_CORE_TESTS` instead for consistency.
Props hellofromTonya, SergeyBiryukov.
See #49889.
Built from https://develop.svn.wordpress.org/trunk@50170
git-svn-id: http://core.svn.wordpress.org/trunk@49849 1a063a9b-81f0-0310-95a4-ce76da25c4cd
Previously, all logic utilizing `getimagesize()` was supressing errors making it difficult to debug usage of the function.
A new `wp_getimagesize()` function has been added to allow the errors to no longer be suppressed when `WP_DEBUG` is enabled.
Props Howdy_McGee, SergeyBiryukov, mukesh27, davidbaumwald, noisysocks, hellofromTonya.
Fixes#49889.
Built from https://develop.svn.wordpress.org/trunk@50146
git-svn-id: http://core.svn.wordpress.org/trunk@49825 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This adds a new filter, `wp_image_src_get_dimensions` to the `wp_image_src_get_dimensions()` function to correct the dimensions returned for a file whenever WordPress isn't able to correctly get the dimensions from attachment metadata.
Fixes#51865.
Built from https://develop.svn.wordpress.org/trunk@50134
git-svn-id: http://core.svn.wordpress.org/trunk@49813 1a063a9b-81f0-0310-95a4-ce76da25c4cd
* Expands the capabilities of `wp_filter_content_tags()` to add the attribute to iframe tags if enabled.
* Modifies the default behavior of `wp_lazy_loading_enabled()` so that it returns `true` for `iframe` tags.
* Introduces a `wp_iframe_tag_add_loading_attr()` function.
* Introduces a `wp_iframe_tag_add_loading_attr` filter.
Like for images, the attribute is only added to iframes which have both `width` and `height` specified (see related #50367).
Props azaozz, flixos90, westonruter.
Fixes#50756.
Built from https://develop.svn.wordpress.org/trunk@49808
git-svn-id: http://core.svn.wordpress.org/trunk@49531 1a063a9b-81f0-0310-95a4-ce76da25c4cd
Using the canonical function name for PHP functions is strongly recommended, as aliases may be deprecated or removed without (much) warning.
This replaces all uses of the following:
* `join()` with `implode()`
* `sizeof()` with `count()`
* `is_writeable()` with `is_writable()`
* `doubleval()` with a `(float)` cast
In part, this is a follow-up to #47746.
Props jrf.
See #50767.
Built from https://develop.svn.wordpress.org/trunk@49193
git-svn-id: http://core.svn.wordpress.org/trunk@48955 1a063a9b-81f0-0310-95a4-ce76da25c4cd
In PHP 8, the GD extension uses `GdImage` objects instead of resources for its underlying data structures.
This updates the existing `is_resource()` calls for image resources in core to accomodate for `GdImage` instances as well.
Props ayeshrajans, jrf.
Fixes#50833.
Built from https://develop.svn.wordpress.org/trunk@48798
git-svn-id: http://core.svn.wordpress.org/trunk@48560 1a063a9b-81f0-0310-95a4-ce76da25c4cd
- Introduce `wp_image_file_matches_image_meta()` utility function to check whether the image meta (retrieved by attachment ID) matches an image path or URI. A mismatch may happen in some cases, for example after the posts have been exported from one website and imported in another.
- Add unit tests for the new function.
- Improve `wp_image_src_get_dimensions()` a bit and use the new function to prevent these edge cases.
Fixes#50543.
Built from https://develop.svn.wordpress.org/trunk@48329
git-svn-id: http://core.svn.wordpress.org/trunk@48098 1a063a9b-81f0-0310-95a4-ce76da25c4cd
With this changeset, in addition to the already present `wp_lazy_loading_enabled` filter, developers can now opt out of lazy-loading template images via `wp_get_attachment_image()` by passing a `loading` attribute with boolean value `false`. This can be used e.g. by theme developers on images which are very likely to be in the initial viewport.
This changeset also improves related test coverage.
Props adamsilverstein, azaozz, joemcgill, johnbillion.
See #50425, #44427.
Built from https://develop.svn.wordpress.org/trunk@48272
git-svn-id: http://core.svn.wordpress.org/trunk@48041 1a063a9b-81f0-0310-95a4-ce76da25c4cd
Following up on [48170], this changeset moves the new logic to add missing `img` dimension attributes into a separate function that is run first within `wp_filter_content_tags()`. It also adds a utility function `wp_image_src_get_dimensions()` with logic reused from `wp_image_add_srcset_and_sizes()`, and it ensures that `width` and `height` attributes only get added if both of the attributes are missing on the original `img` tag.
This changeset furthermore improves test coverage and separates tests for the different aspects of `img` tag modification.
Props azaozz.
Fixes#50367. See #44427.
Built from https://develop.svn.wordpress.org/trunk@48237
git-svn-id: http://core.svn.wordpress.org/trunk@48006 1a063a9b-81f0-0310-95a4-ce76da25c4cd
The filter is the callback function added with `add_filter()`, therefore the hook passes a value to the filter, and the filter returns a value to change its behaviour.
The documentation is referring to the latter.
Props johnbillion.
See #49572, #16557.
Built from https://develop.svn.wordpress.org/trunk@48185
git-svn-id: http://core.svn.wordpress.org/trunk@47954 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This changeset ensures that attachment images which are inserted without `width` and `height` attributes still receive them in the frontend, to reduce cumulative layout shift. Adding the dimensions happens as part of the logic for adding `srcset` and `sizes` attributes, which already assume the specific width and height of the respective image.
Images are now only lazy-loaded if they have `width` and `height` attributes present. While missing these attributes itself is what causes layout shifts, lazy-loading such images can make this problem more apparent to the user.
Props adamsilverstein, westonruter.
Fixes#50367. See #44427.
Built from https://develop.svn.wordpress.org/trunk@48170
git-svn-id: http://core.svn.wordpress.org/trunk@47939 1a063a9b-81f0-0310-95a4-ce76da25c4cd
The tag was supported in phpDocumentor 1.x, but is no longer supported in 2.x and 3.x.
Usage of static variables is considered an internal implementation detail and has no information value for someone reading the docs.
Props alishanvr, jrf.
Fixes#50426.
Built from https://develop.svn.wordpress.org/trunk@48109
git-svn-id: http://core.svn.wordpress.org/trunk@47878 1a063a9b-81f0-0310-95a4-ce76da25c4cd
The array returned by this function previously included a fourth element only when an intermediate image size was used. This change ensures a consistent structure in the returned array regardless of the function's internal behaviour.
Props wido, joemcgill, johnbillion
Fixes#46113
Built from https://develop.svn.wordpress.org/trunk@47748
git-svn-id: http://core.svn.wordpress.org/trunk@47524 1a063a9b-81f0-0310-95a4-ce76da25c4cd
Visible `<label>` elements benefit all users. The `placeholder` attribute should not be used as a replacement for visible labels.
Instead, it's supposed to be used only for a short hint to aid users with data entry e.g. a sample value or a brief description of the expected format.
Screen readers may not announce a `placeholder` attribute at all. Other users may suffer from the lack of a visible label and a placeholder used as replacement, for example:
- users with cognitive disabilities may have trouble remembering what the filled field does
- speech recognition users cannot see the name they can speak to set focus on the field
- low-vision users with high text-size may not be able to see the whole placeholder even when it's visible, if its value is clipped by the edge of the input
Props anevins, audrasjb, karmatosed, azaozz, SergeyBiryukov, afercia.
See #40331.
Fixes#47138.
Built from https://develop.svn.wordpress.org/trunk@46418
git-svn-id: http://core.svn.wordpress.org/trunk@46216 1a063a9b-81f0-0310-95a4-ce76da25c4cd
Headings are the predominant mechanism for screen reader users to find information in a page. They also help all users to better identify the main sections of user interfaces.
- adds three new headings within the media modal
- improves plural form translation for "item selected" by using `wp.i18n`
- horizontally centers the media modal menu in the responsive view
Props kjellr, karmatosed, melchoyce, afercia.
See #47149.
Fixes#47610.
Built from https://develop.svn.wordpress.org/trunk@46375
git-svn-id: http://core.svn.wordpress.org/trunk@46174 1a063a9b-81f0-0310-95a4-ce76da25c4cd
- adds audible messages via `wp.a11y.speak()` to announce the search results
- removes a `keyup` event that was there only to support old browsers
- removes `aria-modal="true"` from the media modal dialog as it prevents the ARIA live regions to be perceived by screen readers
- triggers the search only after 2 ASCII characters have been typed
Props anevins, antpb, aduth, loreleiaurora, afercia.
Fixes#47146.
Built from https://develop.svn.wordpress.org/trunk@46239
git-svn-id: http://core.svn.wordpress.org/trunk@46051 1a063a9b-81f0-0310-95a4-ce76da25c4cd
When a theme declares HTML5 support for script and styles via `add_theme_support( 'html5', array( 'script', 'style' ) )`, the `type="text/javascript"` and `type="text/css"` attributes are omitted.
These attributes are unnecessary in HTML5 and cause warnings in the W3C Markup Validation Service.
Props sasiddiqui, swissspidy, knutsp, SergeyBiryukov.
See #42804.
Built from https://develop.svn.wordpress.org/trunk@46164
git-svn-id: http://core.svn.wordpress.org/trunk@45976 1a063a9b-81f0-0310-95a4-ce76da25c4cd
Felix Arntz
Sergey Biryukov
hellofromTonya
Andrew Ozz
desrosj
whyisjake
joedolson
Adam Silverstein
Peter Wilson
John Blackbourn
antpb
Joe McGill
iandunn
Helen Hou-Sandí
Andrea Fercia