Core Editor Improvement: Cascading impact of improvements to featured images

When a new feature is added, it’s easy to see what the feature does right now rather than the many things it allows you to do, particularly when combined with other tools. This is especially true as design tools continue to evolve! This post offers a quick dive into how improvements to the Featured ImageFeatured image A featured image is the main image used on your blog archive page and is pulled when the post or page is shared on social media. The image can be used to display in widget areas on your site or in a summary list of posts. blockBlock Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience. lead to more possibilities for content creation. 

Greater control of posts layout

Thanks to some recent changes to the Featured Image block, the Query LoopLoop The Loop is PHP code used by WordPress to display posts. Using The Loop, WordPress processes each post to be displayed on the current page, and formats it according to how it matches specified criteria within The Loop tags. Any HTML or PHP code in the Loop will be processed on each post. block just got even more powerful. As a reminder, the Query Loop block is an advanced block that allows you to display posts based on various parameters and was released in WordPress 5.8. Within the Query Loop block, different blocks, like the Featured Image block, can be placed within it to show the Featured Images for each post listed. While you’ve been able to control the general placement of the Featured Image, until GutenbergGutenberg The Gutenberg project is the new Editor Interface for WordPress. The editor improves the process and experience of creating new content, making writing rich content much simpler. It uses ‘blocks’ to add richness rather than shortcodes, custom HTML etc. 11.3, you couldn’t control the basics of the resulting image. This came up a few times during testing with the FSE Outreach Program as a pain point with folks wanting deeper customization options. Now, you can control the sizing and scale of the image to your liking opening up the beginnings of a new world of layout options!

Video showing the new Featured Image Block options within the Query Loop block.

More options when creating templates

This change also impacts anyone using the Template Editor as you can now customize how the Featured Image shows up in a template you created. This is just a start too with more size tooling planned for the Featured Image block. Most recently too, the ability to add duotone filters to spruce up your images with endless color options was included in Gutenberg 11.4. Just like with the Query Loop block example above, this allows you to add a Featured Image block with a duotone filterFilter Filters are one of the two types of Hooks They provide a way for functions to modify data of other functions. They are the counterpart to Actions. Unlike Actions, filters are meant to work in an isolated manner, and should never have side effects such as affecting global variables and output. added and then apply that to any post or page you’d like so all posts have the same duotone shading:

Video showing the new Featured Image Block options within the Template Editor.

Thank you @shaunandrews for the design assist & @kellychoffman for help with the copy.

#core-editor, #core-editor-improvement