Gutenberg is a block based editor launched with WordPress 5.0. The folks from WordPress want to make it a fully featured website builder in the next couple of years.
So far, it’s been received with mixed feelings. I thinks that it’s way behind Elementor and I described the difference between these two earlier. The idea behind Gutenberg is great and I hope we’ll see it evolving and delivering the promised capabilities.
Anyway, today we’ll talk about reusable Gutenberg blocks and how to create and save them.
I don’t use them very much and didn’t even know about their existence until I accidentally discovered them. I’m not sure if this is a widely used feature, but it’s surely a useful one. Especially if you want to save some custom made blocks and use them on another page or even website.
Here is how to works: let’s say you need a call to action block comprised of an image, some text and a link and you need to use this block across multiple pages. Follow these steps to create and save a reusable block:
1. Create your block in Gutenberg editor
2. Click on 3 dots to display more options, click on Add to Reusable blocks
3. Name your block and click on Save
That’s it, you now have a new reusable block. You’ll be able to see it under Reusable section, when you create a new block in Gutenberg editor. You can edit the block and insert it on any page or post on your site. All the changes will be updated globally (on every page or post this block is present).
If you want to edit your Reusable blocks, simply click on Manage all reusable blocks as shown in the image below:
You can also import/export Gutenberg blocks and used them in other WordPress websites. Reusable blocks are exporter as JSON files and can be imported in any other website which is powered by WordPress.org.
If you want to insert a reusable block in another website, simply click on Export as JSON to export the block and then click on Import from JSON to import the block to another website.
Update: it turns out that this is a global option, which means that if you create a reusable block and later adjust that block, it will be updated on all pages/posts. So, make sure you always convert a reusable block to a regular block.
Here is how to do it:
- Add a reusable block to your post or page
- Click on Convert to regular blocks from the block’s toolbar
- Make changes if required and save your post/page
If you want your block to be global, then don’t covert it to regular blocks.
Example: you have a button on multiple pages and want to update its color. Simply edit that reusable block and save the changes, and those will be applied on all pages where you have that button.
That’s it, let me know if it worked for you. I’m really excited about this feature and find it very handy!
