Since its introduction in late 2018, the WordPress Block Editor has completely transformed the WordPress content management experience. It’s now possible to build sophisticated page layouts without the use of “shortcode soup” or relying on proprietary page builders.
Despite all of these advancements, the Block Editor can still feel clumsy and inefficient if you’re doing a lot of content work. Whether you’re writing long form content that’s being edited heavily, or finding yourself setting up the same layouts over and over again, there can be an awful lot of clicking involved.
The following tips will make your content development experience faster and easier.
Adding Blocks with Slash Syntax
Adding Blocks with the Add Block button can require multiple clicks and scrolling to locate the block you want. You can insert a block at the new paragraph point without any clicks at all, by simply typing a slash /
followed immediately by the name of the block you want to add, like /column
or /heading
or /button
. Compare these two examples of inserting an Image block:
Creating Reusable Blocks
Do you find yourself setting up the same layouts over and over? Maybe your product pages have a consistent look to them, or your blog posts always have the same call-to-action at the bottom, or you add the same button group to certain page sections. Reusable blocks to the rescue!
To create a reusable block, take the following steps:
- Select the collection of blocks you’d like to re-use. You can do this with click and drag, or using the keyboard selection tools.
- In the Block Toolbar, click the ellipsis button, and choose Add to Reusable blocks.
- Give your new block a descriptive name and click the Save button.
- On a new page (or in a new section) you can now add your reusable block just like any other block. It will be available from all block selection tools, and will also be available with the slash syntax.
Important: Reusable blocks stay synchronized with one another. If you make a change in one instance of a reusable block, your changes will also propagate to other instances of that re-usable block. In some situations this is desirable, but in other cases you may want to customize each instance of a block. Fortunately, there’s an easy way to do that:
- Select an instance of your reusable block.
- In the Block Toolbar, click the ellipsis button, and choose Convert to regular blocks.
This action detaches your new block from its reusable parent block, which you will now be able to edit just like any other blocks.
Easier Block Management with List View
List View exposes the document structure of your post or page, allowing you to easily navigate to, select, and manage specific blocks in your document.
You can toggle List View on and off with the List View button in the Block Editor toolbar, with Shift+Alt+O
on Windows, or with Ctrl+Option+O
on a Mac.
Selecting Blocks in List View
When you’re working on advanced layouts with multiple nested blocks, it can be difficult to select the specific block you want to modify, particularly with “container” type blocks like the Columns block or Group block. List View makes it easy to find and select any block:
Moving Blocks in List View
Want to quickly swap the placement order of two columns? Using the mouse for this directly in the Block Editor can be tricky and slow. List View makes it easy: simply drag the Column block up or down, and presto! Reordered columns. You can move any blocks in the document to new locations with drag and drop.