WordPress 6.2 is just around the corner, due to be released on March 28th 2023. This is the first major release of 2023, it marks the completion of phase 2 from the official roadmap, and with it comes several improvements. Here is a list of things you can expect to see.
Usability Improvements in WordPress 6.2
You can expect a variety of usability improvements, designed to make it easier to navigate the Site Editor, Block Editor, and to make the overall experience of customising your website easier.
A New Site Editor Interface
In WordPress 6.2, when clicking on the Editor link (under Appearance), you will see a re-designed interface, compared to the previous version. Here is a list of notable changes:
- By default, the Site Editor’s side panel is open. Previously, you needed to manually open this.
- The Site Editor has a new aesthetic, with a redesigned side panel and preview section.
- You can now adjust the width of the Site Editor’s side panel by clicking and dragging.
- To get to the dashboard, click either the site logo or the back arrow (depending on which section you’re in).
- The Templates and Template Parts have a re-designed preview, allowing us to easily click through each one and preview without editing.
Distraction-Free Mode
The new Distraction free setting is available when clicking the options link when editing content. When active, this setting removes all panels on the screen, giving you a clean interface, and allowing you to focus only on the content you are editing.
Colored Template Parts and Reusable Blocks
WordPress 6.2 will make it easier to quickly identify any reusable block or template part, by colorizing these sections. Not only does it make these sections quicker and easier to find, but making them more obvious will also help to prevent any unwanted changes to reusable blocks or template parts.
You can see this in various places in the Block Editor, including the main editor canvas, the list view, the settings panel, and the block toolbar.
Post Outline
A detailed Outline section is now available in the List View when creating a post or page. This provides access to information such as Word Count, Character Count, and Time To Read. This section also breaks down the HTML elements on the page, in a document outline area.
Better Style Variations Preview
The interface for previewing style variations has been re-designed, with an improved UI. When you click the Browse Style button in WordPress 6.2, your preview panel will zoom out, giving you a fuller, more detailed preview compared to previous versions.
The New WordPress 6.2 Style Book
When using the Style area (within the Site Editor), you now have access to a feature called the Style Book. When clicking the Style Book button (an eye icon), a modal will open within the preview panel, containing a live preview of every block that can be inserted into the website.
The Style Book groups the blocks into the following tabs:
- Text – This tab contains all the text-based blocks that are available, such as the paragraph, heading, and list blocks.
- Media – This tab is where you will find the media-related blocks, such as the image, and gallery blocks.
- Design – This section holds the various blocks used to create the design of your site, such as the button, columns, and group blocks.
- Widgets – This tab holds all the widget block examples, such as the archives list, calendar, and custom HTML blocks.
- Theme – Here you will find all the theme-specific blocks, such as the site logo, site title, site tagline, and navigation blocks.
Copy & Paste Block Styles
WordPress 6.2 comes with the ability to copy and paste block styles in the Block Editor. This means you can apply the same style settings from one block to another with a simple copy/paste operation. To do this, click the three dots on the toolbar on any customised block, and select the Copy styles option. Then select the second block and click Paste styles from the same menu in the block toolbar.
Block Inspector Tabs
With the evolution of the Block Editor, the Block Inspector sidebar has become increasingly crowded because more settings have been added. WordPress 6.2 aims to fix this, by separating settings and options into tabs.
Block Settings – This tab contains all settings that are not related to the style of the block, such as size.
Style Settings – This tab relates to all settings that control the style of the block, such as colour, typography, margin, etc. Some blocks, like the Query block, are considered setting-only blocks and do not have a Style Settings tab. To style setting-only blocks, it is recommended that you wrap them in a block that supports styles, such as the Group block.
List View – The Navigation block has an additional tab called List View.
Apply Block Styles Globally
Sometimes, when making changes in the Site Editor to a block, it might make sense to apply these same changes to all blocks of the same type. There is now an option under the Advanced panel in the Block Inspector Sidebar called Apply globally.
The WordPress 6.2 Block Pattern Inserter
The way we add block patterns has been re-designed, with a new Block Pattern Inserter. Rather than selecting a pattern category from a drop-down, all pattern categories are now shown as clickable links – clicking on a category, will open a new panel, which will show a preview of every block within that specific category for you to insert.
Additionally, you will find a selection of new patterns, as well as some new pattern categories, such as Call to Action, and Banners.
This new approach offers a more intuitive way of switching between block categories, however, the pattern explorer is still accessible by clicking the Explore all patterns button.
Import Classic Widgets
WordPress 6.2 has a way for you to import all the widgets from a classic theme when switching to a Block theme. If you had a widget area in your previous theme, within your new Block theme’s Site Editor you can now:
- Insert a Template part block.
- Click Start Blank, and give the template a name.
- In the Block Inspector sidebar, under the Advanced drop-down, you will see a new select box titled Import Widget Area. This will list all the widget areas you had configured in your previous theme. Select one of these.
- Click the Import button.
This will populate the template part block with all the widgets you had previously configured within your selected widget area.
Openverse Integrates Directly Into WordPress 6.2
Openverse is an open-source platform that is part of the WordPress project, offering free-to-use media under public copyright. WordPress 6.2 has integrated Openverse directly into the Block Editor.
To add images from Openverse to the Block Editor, open the Block Inserter, and click on the Media tab. Here you can toggle between seeing the various kinds of media within your Media Library, such as Images, Audio, Video, etc. to insert as blocks. You will also see an option named Openverse – clicking this will open a preview window, allowing you to search through the images on Openverse, and insert them directly into the editor.
Preview Block Style
When modifying the styles of a block in the WordPress Styles area, WordPress 6.2 will add a convenient preview panel. This helps you see the changes you are making, before clicking the save button and applying them site-wide.
WordPress 6.2 Design Options
The Styles area in WordPress (previous referred to as Global Styles), has had a number of updates which give us much more flexibility when customising our sites.
Custom CSS
There are now two ways you can now add your own custom CSS from within the Block Editor:
- Globally – Within the Styles area (in the Site Editor), click the three dots icon at the top of the side panel. Click Additional CSS, under the Welcome Guide. This will open a text box so you can add your own custom CSS.
- On a per-block basis – Within the Styles area, click Blocks. Select a block (you can also perform a search). Click Additional block CSS. This will open a text box so you can add your own custom CSS.
Add Shadow
A long-awaited feature by theme developers is making its way into WordPress 6.2 – shadows. Currently, shadows can be added to buttons, and this can be done within the Styles area by clicking Blocks, selecting the Button block, clicking Shadow, and selecting one of the available shadow options. The options consist of Neutral, Deep, Sharp, Outlined, and Crisp. Theme developers are also able to add their own custom options here via the use of shadow presets, and are also able to define shadows for other blocks in their theme.json file, such as the image block.
Sticky Group Blocks
It is now possible in WordPress 6.2 to position a block so that it sticks to the top of the window when a user scrolls down the page. Currently, only root-level blocks support this feature, and it can apply to group, stack, or row blocks
To make a root-level block sticky, navigate to the Block Inspector side panel for the block, click Position, and change the dropdown to Sticky. Now, when you scroll down to this block on the front end, it will stick to the top of the window.
No More BETA Label
If you have been following the block editor for a while, this moment will have been a long time coming – the BETA label has now been removed and the Block Editor is officially fit for production. That being said, it continues to be refined and developed over time as part of WordPress core.
WordPress 6.2 Developer Info
Here is a list of the notable features in WordPress 6.2 for developers:
- Introducing the HTML API.
- Upgrading to React 18 and common pitfalls of concurrent mode.
- Add shadow presets to theme.json.
- Minimum height dimensions block support.
- Customize settings for any block.
- Add new prop to ServerSideRender component.
- Editor Components updates.
- Patterns API expanded to include template_types property.
- Miscellaneous Editor changes.
- I18N Improvements.
- Introducing move_dir().
- Escaping Table and Field names with wpdb::prepare().
- The “Style Variations” tag was added to the list of WordPress theme features. View ticket #56869.
- theme.json supports additional link-related pseudo-classes, such as :link and :any-link. View ticket #57053.
- Themes can now have a numeric theme name. View ticket #54645.
- Caching is added to WP_Theme::is_block_theme(). View ticket #57114.
- Miscellaneous developer changes in WordPress 6.2.
It might also interest you to read through the WordPress 6.2 Field Guide.
Note – the above updates for WordPress 6.2 are subject to any last-minute changes from the WordPress team.
Need Help Preparing for WordPress 6.2?
If you would like some assistance upgrading to WordPress 6.2 or would like to take advantage of the new developer features, we are here to help. Please feel free to browse through our expert profiles to find the perfect developer for you – alternatively, you can also open a project here for our experts to engage on.