WordPress Reusable Blocks – An In-Depth Guide
The Reusable Block feature is a powerful tool that helps you build and maintain a WordPress site with less work and hassle.
Like much of the block editor, it’s quirky at first, but once you get the hang of it, you’ll appreciate how much time it saves you.
What’s a Reusable Block, anyway?
In short, a Reusable Block is a single block – or a grouping of blocks – that you save and can then deploy on any page or post with just a few clicks.
By default, a Reusable Block on one page is linked to any other instance of that reusable block on other pages.
So if you change the content or settings within that reusable block, the changes will automatically apply to other instances of the reusable block.
Reusable Blocks are a type of site-wide global styling (or snippet). This helps you automated repetitive design processes, tasks, and content. Examples include: adding the same content in multiple articles such as call-to-actions at the end of the blog post, related posts, or links to follow the blog in social media.
How to build your first Reusable Block.
Here’s an example. Let’s say I want to add a “Related Posts” section after the main content of my blog posts.
First, I need to build the element. There are many ways to achieve this. For this example, I’m going to use the Kadence “Posts” Block. Here are the steps (watch the video version, if you prefer):
1) Add a “Row” block.
This is the container that the Related Posts block will go inside. The Row allows you to add a background, padding, etc.
2) Add a “Related Posts” block.
This block will show a list of related posts based on the settings you select. You can show posts based on categories, tags, date, author etc. You can also customize the look of your titles, meta, etc (to a certain point).
I think related post sections should be as simple as possible. The goal is to allow the reader to quickly scan your titles so she can get on with reading.
With this in mind, I’ve used only one column, removed the excerpt and read more link. I doubt the meta info is important to the reader, but I like how it breaks up the titles, so I’ve kept it.
Ideally, I’d remove the title underline to improve readability and differentiate it from the post categories.
3) Select the outer row block and select “Add to Reusable Blocks.”
4) Give your reusable block a name and save the page.
Voila! You now have a reusable block that you can deploy onto any page or post. Remember, as long as this block remains reusable, you only have to edit it one place, and it will change everywhere. More on this below.
Here’s a look at the Related Post reusable block that I created:
How to add a Reusable Block.
Now that you’ve built a reusable block, how do you add it to a page or post. Here’s how:
1) Click the “Plus” icon to add a block.
2) Click the “Reusable” tab.
3) Select the reusable block you want to add.
How to edit a Reusable Block.
There are two ways to edit a Reusable Block.
The first and simplest is to change the content or settings within a reusable block on whatever page or post you’re working on. Save and update the page, and that Reusable Block will change across your site.
The second way is to access a Reusable Block from the “Manage All Reusable Blocks” section of your site.
1) Click on the three dot icon on the top right of your edit screen.
2) Select “Manage all reusable blocks”
3) Find and edit the block you’re looking for.
4) Click “Update” and your done.
Convert a Reusable Block back to a regular block.
There are times when you may want to convert a reusable block back into a regular block. Maybe you want to modify the content inside your block, but you don’t want those changes to apply across your entire site.
The post title “hero” sections on Block Clones are built this way. First, I add my reusable block.
Hi. I used to be a Reusable Block.
Then, I convert the Reusable Block back into a regular block. Now, when I edit the content inside the block, no site-wide changes occur.
- Are their limitations to where and when I can use reusable blocks?
- Are they selectively activated?
- Can I use conditional logic for where they appear like on posts with a certain classification or condition?
- If so how do I do those things?