Core Editor Improvement: Drag & Drop Blocks and Patterns from the Inserter

With the launch of Gutenberg 9.6 and Gutenberg 9.7 comes the ability to drag and drop blocks and 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. patterns from the Block Inserter. This new feature might be easy to miss if you’ve grown used to relying on the current ways to add blocks! Here’s a quick video showing how it’s done for both blocks and block patterns:

Video showing drag & drop from the inserter for first a block and then a block pattern.

Important Note: you need to use a theme with registered block patterns (ex: the current default theme and the prior 4 years) .

With this new addition, there are now seven ways to quickly add blocks to your content, whether it’s to write a compelling post, build out a fancy sidebarSidebar A sidebar in WordPress is referred to a widget-ready area used by WordPress themes to display information that is not a part of the main content. It is not always a vertical column on the side. It can be a horizontal rectangle below or above the content area, footer, header, or any where in the theme. with the in progress Widgets Editor, or create a site using the site editing experiment:

  • Drag and drop from the inserter.
  • Select from the inserter. 
  • Type a forward slash followed by the block name: /image or /paragraph.
  • Click the black + icon at the side of an empty block.
  • Using the + icon at the top left of the editor which opens Block Inserter.
  • Hit the Enter/Return key from a currently selected block to create a new block underneath it. 
  • Click on the three dots just above a selected block and choose to add a block above or below the current block.

This is a very new feature so, as you explore, know that feedback and bugbug A bug is an error or unexpected result. Performance improvements, code optimization, and are considered enhancements, not defects. After feature freeze, only bugs are dealt with, with regressions (adverse changes from the previous version) being the highest priority. reports are always welcome on GitHub

If you’re interested in working on features like this, make sure to join #core-editor, check out the current focuses, and attend the Core Editor weekly meeting on Wednesdays @ 14:00 UTC in core-editor

#core-editor-improvement #core-editor

Core Editor Improvement: Video Subtitles

While some people might think of the CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. Editor as being focused on the writing experience, it’s so much more than that, especially with what’s now possible thanks to numerous core blocks and the future site editing world. This post is about one of these new content tools that you might have missed in the last few months of recent releases: the ability to add video subtitles. With more and more people venturing into the video space thanks to them being easier than ever to create, this new feature packs powerful capabilities for content creators and their viewers alike. 

To take advantage of this new feature, just upload a video and use the Text Tracks setting to upload your subtitles as shown below: 

The Text Tracks setting options now included in the Video 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..

People viewing your site can enable captions through the settings of the video player. Here’s a screenshot of a video with captions on to get a sense of the experience: 

Example of a paused video with subtitles enabled.

Now you can engage with your audiences so they can catch what you’re up to whether they might have limited hearing, don’t want to wake a sleeping baby/pet/person nearby, or prefer reading along while watching your video. Happy creating! 

If you’re interested in working on features like this, make sure to join #core-editor, check out the current focuses, and attend the Core Editor weekly meeting @ 14:00 UTC in core-editor. 

#core-editor-improvement #core-editor #accessibility

Core Editor Improvement: Text Only Icons for the Toolbar

A lot of work has been done to improve the infrastructure of the CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. Editor and expand what’s possible technically. It is also important to pause and highlight improvements that make creating with the core editor easier than ever before. This post seeks to highlight one of those recent features that might have been missed in the flurry of recent releases: the ability to have descriptive text icons instead of an icon only view of the Block Toolbar. Since the Toolbar is currently one of the main ways we all interact with the Core Editor this is a big change that should have big benefits. Text icons unlock the ability for you to tailor your experience of the Toolbar and helps more people have the flexibility to create with the Core Editor. In particular, these icons improve settings from an accessibilityAccessibility Accessibility (commonly shortened to a11y) refers to the design of products, devices, services, or environments for people with disabilities. The concept of accessible design ensures both “direct access” (i.e. unassisted) and “indirect access” meaning compatibility with a person’s assistive technology (for example, computer screen readers). (https://en.wikipedia.org/wiki/Accessibility) standpoint for those relying on tooltips.

To get a sense of just how much of a difference this makes, check out the following screenshots showing the different options available: 

Icon Only: 

Icon Only view in the Core Editor Toolbar

Text Only: 

Text Only view in the Core Editor Toolbar

How to find this option

Here’s a helpful GIF that illustrates where you can easily find this setting in the Options menu under the Appearances section:

Settings can be adjusted under the Options menu in the Appearance section by toggling “Display Button Labels”.

Try out both and see which works best for you. If you’re like me, you might find times when it’s helpful to use each. Perhaps you’re teaching someone about the Core Editor for the first time, and they find the text-based options easier to understand! Or, you are trying to write a lengthy post and find Icon Only to feel less distracting. No matter the circumstance, the option is there for you to experience the toolbar in the way that works best for whatever you’re trying to do. 

If you’re interested in working on features like this, make sure to join #core-editor, check out the current focuses, and attend the Core Editor weekly meeting @ 14:00 UTC in core-editor. 

#core-editor-improvement #core-editor #accessibility