The highly anticipated release of WordPress 6.2, code named “Dolphy” is now on the market and we are excited to explore its new features and enhancements. So, what’s new in WordPress 6.2? Let’s delve in to find out!
The rollout of WordPress 6.2 is a crucial achievement in phase 2 of the Gutenberg Development Roadmap. Transitioning out of the beta phase, the block editor underwent several processes to reach stability.
What is the primary objective of this new release? To streamline the editing experience and improve the interface of the platform. With the latest release, we can witness a variety of updates, including a distraction-free writing mode, the capacity to import widgets into block themes, and a number of big and small improvements in performance and usability.
What is highlighted the most? The Navigation block – It’s the most notable feature in terms of ease of use. The streamlined editing experience is a result of several revisions since the initial release of the version. In the latest version, we can see many technical enhancements.
But the latest release is much more than just the improvement of the Navigation block.
Better Editing Experience
The whole site structure has been placed in the middle or centre, enhancing the editing experience. Adding to your ease, it lets you control and manage the navigation menus effortlessly, move between templates and template parts, and much more.
There are more refinements to the editor block! Let’s check them out.
1. Distraction Free Mode
The Distraction Free mode allows you to keep your focus on the page’s main content, reducing the mess. After the activation of Distraction Free mode, you will no longer get to see toolbars and sidebars.
How to activate this feature? Click on the three dots in the upper right corner, and the options panel will appear.
2. Shift Widgets to Block Themes
It’s easy to transfer the existing widget to the new theme if you want to transform your old-traditional theme to a fresh theme based on block. The sidebar widgets will be imported into template parts, which are reusable sections. You can use these template parts for multiple pages to retain content from the previous pages and functionality.
And how does it work?
In a classic theme, choose a widget area. You can activate Twenty-Eleven and add a calendar to the Footer Area One. In the next step, you can change this theme to Twenty-Twenty Three. Go to the Site Editor, and select a template to edit by adding the template part.
3. An Updated Block Inserter
Many changes have affected the Block inserter improving the editing experience. A fresh interface design has been introduced. It makes the navigation better between media categories and media patterns. Moreover, it also provides larger previews.
There is a Media tab in the Block Inserter that lets you simplify the media insertion for the content. You can click on the Media and add images to the content. Drag and drop is the other alternative.
If you want to go to the WordPress Media Library, there is the Open Media Library button in the Media tab to bring you there.
4. Block Inspector
A new Block Inspector is introduced in WordPress 6.2. It divides setting controls into separate panels bringing order to the sidebar. Other block settings and style settings are now divided by tabs.
If the Block Inspector tabs are available, they will get displayed in the following order;
- List View > Settings > Appearance
It is a remarkable change in the interface’s usability, specifically for advanced blocks having multiple configuration options.
What can’t you miss to know?
- If there is only one tab with the Block Inspector, it will be displayed in the same condition as it was in the previous version.
- When there are elements to display in the new Inspector, it will show a tab.
5. The Incorporation of Openverse
Openverse is integrated into the Block Inserter with WordPress 6.2 version. You can easily access this new feature by clicking on the Block Inserter’s Media tab.
A panel will show up, including image previews and a search field. These images are taken directly from the Openverse repository.
6. Combination of List View and Document Details
For Details and List View, two different buttons were in the Editor toolbar before WordPress 6.2. Now, they have moved to one particular Document Overview panel. This panel is categorised into two parts: List View and Outline. We expect this update to make document management more effortless.
7. Coloured Template Parts and Reusable Blocks
Different colours are being used to highlight Template Parts and Reusable blocks to differentiate them from blocks and groups.
8. Improved Site Editor
There are multiple sets of improvements added to the site editor interface. The new Browse Mode has made it easier to navigate through Template and its parts.
With the new update, you can now add the latest template or its parts from the editor’s sidebar. To do this, you are required to click on the plus (+) sign/icon. This icon is located at the right of the title’s menu.
Reinforced Design Tools
The styling and designing capabilities have witnessed an upgrowth in the latest version of WordPress. Here’s a list of all design-associated features in WordPress 6.2:
1. Minimum Height Dimensions Block Support
Themes that use the appearanceTools feature in theme.json will have the new control in Inspector controls. You can find it under Dimensions, as it is not shown by default.
The Dimensions panel’s menu enables access to control. The new minimum height control allows users to Post Content block or set a Group with a minimum height. It is just like the control for the Cover block.
To add support for minimum height, developers can add the minHeight setting to theme.json.
2. Apply Block Changes
A new button is introduced in WordPress 6.2 that lets you push your block style changes to global styles. It is available for individual blocks under the Advanced panel. The best part is that you can apply this change to your entire website.
All thanks to this feature as now you don’t have to edit individual templates and keep a consistent design.
3. Customised CSS in Styles Panel
The ability to add custom CSS Styles has been introduced. There is a text field in the Global Styles interface that allows you to add CSS custom rules.
How to add custom styles?
In the Styles toolbar, you can see the More Styles actions; click on the same. The alternative is to add on a per-block basis from the block style panel.
4. Add and Customise Shadows
You can add and customise shadows for some blocks by using theme.json or Global Styles. With themes that embrace this functionality, you can incorporate shadows through the Global Styles interface.
You can activate the Twenty Twenty-Three theme and move to:
Styles > Blocks > Button. Click on the Shadow button to proceed.
A shadow popup will appear, asking you to choose from the theme presets.
5. Enriched Design With Spacing Visualisers
What do Spacing Visualisers do? They allow checking and reviewing the amount of padding or margin applied to blocks. To make the editing experience even better, this feature has got improvement in the new version.
When you hover over the padding control or margin, the Spacing Visualisers show up. And as soon as you hover the cursor on the spacing setting, the Spacing Visualiser hides the block toolbar.
6. Style Book
The Style Book facilitates users to preview blocks. These blocks can be used on the users’ websites without the need to add blocks to the template/template part.
To launch the Style Book, click on the Open Style Book button. This Style Book button is present in the Styles header in the global styles.
7. Mirroring and Pasting Styles
Two buttons for copying and pasting are there in the Options menu of the block’s toolbar. They are named Copy Styles and Paste Styles. In the previous version, copying was possible, but not paste.
How to use it?
Add a new block. Change the style. Navigate to the block options menu and choose Copy Style.
Choose another block and select Paste Style.
And this is how you paste the copied styles to another block.
Expanded Block Capabilities
You will be privileged to see some expanded block capabilities of various block types with WordPress 6.2, specifically the Navigation block that underwent changes to give the improvised editing experience.
Let’s explore the major changes meticulously:
1. List-Based Editing
The reorganisation of Navigation Block elements is possible with WordPress 6.2. You can do it with a list view in the block settings.
Click on the menu item to take you to the settings sidebar of the selected Page Link. You can edit several link details in this space, including description, link title, etc.
2. Supplementary Improvements to Block Editing Experience
There are many useful improvements to help you with block editing.
- The calendar block’s link, text, colour, and background are changeable now.
- Images can be dragged and dropped across an empty paragraph.
- Using the [[ shortcut, you can autocomplete links in any block.
- To transform a paragraph into a heading, a new control + option + 1 – 6 shortcut is there.
- The letter spacing of the heading blocks is modifiable in the Global Styles interface.
- Typography controls have been consolidated into panels.
3. Refinements to Page List Block
For Page List Block, there are two particular improvements added:
- You can now expand the pages’ list in the List View panel.
- The block sidebar has a new option allowing you to set a starting page.
4. Append/Delete Caption Text from the Block Toolbar
A user can control captions for various blocks from the block toolbar. If you have already set it, the caption will get automatically included while adding images to your content.
5. Lock Navigation
Version 6.2 gives the ability to lock the menu editing. The previous version, which is 6.1, allowed only Disable movement options and Restrict Editing. The new version allows Prevent Removal in addition to the former features.
6. A New Position Block Support Feature
Presently applied to Group blocks only, you can access the sticky positioning in the Inspector control sidebar’s Position panel. Theme developers can also activate the sticky positioning in their themes with appearanceTools in theme.json.
For a granular control of appearance tools, you can change the settings.position.sticky to true.
Modifications for Developers
WordPress 6.2 offers some outstanding utilities to developers. From bug fixes to new APIs, there is much more to the list.
1. New Version of React Library
The React Library has updated to version 18.0 there are certainly new additions, including enhancements, APIs, bug fixes, etc.
What caught our attention the most was – The Concurrency Mode. It is newly introduced with a mechanism enabling React to draft many versions of your user interface simultaneously. Moreover, the Concurrent Mode is interruptible.
2. The HTML Tag Processor
The HTML tag processor is an HTML-5-spec-compliant parser. This processor is the new component in the HTML processing API. You can find the particular HTML tags or substitute, remove, or update any attribute using PHP.
3. More Changers for Developers
WordPress 6.2 has some notable changes for developers too.
- It has a new JavaScript filter. The blockEditor.useSetting.before is used to filter the block settings. It authorises developers to change settings based on the location of the block.
- From theme.json, developers can style the existing core block variations.
- They can include Google fonts locally, in place of fetching them as a bundle of themes from Google addresses.
Conclusion
There is significant progress towards completing Gutenberg’s project phase 2. The Gutenberg project focuses on customisation and additional improvements are always expected. If you are interested in upgrading your current version of WordPress to the latest and greatest, then get an expert web agency for WordPress development in Melbourne.
We have explored some very significant features afresh in WordPress 6.2. Having already ten versions of the Gutenberg plugin in the core, which are from 14.2 to 15.1, we are treated with remarkable features, including an improved site editor, list-based editing, an updated block inserter, and much more.
If you have your brand’s website built on WordPress and looking for an upgrade to the 6.2 version, Enterprise Monkey is your trusted partner.