Guide to Using Reusable Gutenberg Blocks in WordPress

Posted on

Since the 5.0 update in 2018, the WordPress editor has changed to Gutenberg which carries a Block Based User Interface. Where the editor view is composed of boxes (blocks) that can be moved simply by sliding them.

Well, one of Gutenberg’s “secret” features that not many people know about is reusable blocks. In fact, this feature can simplify your experience in making posts on WordPress, you know.

Curious about what reusable blocks are and how to use reusable blocks? Don’t worry, we’ll explain everything in this article.

What Are Reusable Blocks?

In short, reusable blocks are boxes that you can use again because they were saved before. So you can save time and effort because you don’t have to make the same boxes again from scratch.

You can store different types of boxes with reusable blocks. Starting from the simple ones like text, images and CTAs, to a combination of various website elements in one box.

In other words, you can store anything in Gutenberg with these reusable blocks. Very useful, right?

How to Use Reusable Gutenberg Blocks

We will divide our guide on how to use reusable blocks into four parts. Starting from making it to how to use the reusable block that was just made on another website.

1. Create a New Reusable Block

Before you can use a reusable block, you must first create it in the way below.

– First, you have to create or edit posts/pages on your website. After entering the Gutenberg Editor, click the Add Block button at the top left.

– You can select any block in the menu that opens. For example, we chose the Paragraph block because we want to save the closing paragraph of the article.

– When finished creating the block as needed, click your block and then click the three dots that appear above it. Then, select the Reusable Blocks option.

– You can give any name to the newly created reusable block. However, try to come up with a name that fits the block and the purpose for which it was created. So you can find it easily when you want to use it later. After that, click Save.

– Oh yes, you can also save reusable blocks for two blocks or more, you know. For example, in addition to the Paragraph above, we also want to save the Button block as a CTA.

– Then, click on the three dots above it and select Reusable Blocks. Give it a name, click Save and you’re done! Some of your blocks are already saved and ready to use with one click.

2. Insert Reusable Blocks

After the reusable block is created, here we provide a way to include it in your post or website page.

– Click Add Block on the top left. Then, scroll down until you find Reusable. Just click on the arrow next to it to open a menu containing the reusable blocks you’ve saved.

– Another faster way is to enter the name of your reusable block in the search box. Therefore, create a reusable block name that is easy to remember and as needed.

– Then, just click the reusable block you want to use. It will immediately appear in the editor afterwards. It’s easy, isn’t it?

3. How to Edit Reusable Blocks

What if you want to change the content of the reusable block? Maybe add some words or just change the color? No need to worry, you can do it too.

– First you have to click the Add Block button at the top left. Then, swipe down until you find Reusable. Click the arrow next to it, then select Manage all reusable blocks. You will be taken out of the Gutenberg Editor, so make sure you have saved the post/page first.

– Select which reusable block you want to change, then click Edit below it.

– After that, you will be taken to the editor. Make the changes you want, then click Update in the top right.

4. How to Use the Same Reusable Block on Other Websites

Another advantage of reusable blocks is that their use is not limited to one website. You can also use the same reusable block on other websites without having to create it from scratch. This is of course very useful for those of you who have many websites or business owners for website creation services.

– To do so, you must click Add Block in the Gutenberg Editor. Then, swipe down until you find the Reusable menu. Click the arrow next to it, then select Manage all reusable blocks

– Click Export as JSON right below the reusable block that you want to use on other websites. This way, the reusable block will be stored on your computer.

– Well, after that you login to another website. Repeat the steps above, but now you should select Import from JSON instead of Export as JSON. Then select the reusable block that you saved on the computer via Choose FIle, then click Import.

– Finished! Your reusable block is ready to be used on the website. Just follow step number two above to include it in your post/page.

Save Your Energy and Time with Reusable Blocks!

After reading this article, you no longer need to bother making the same block from scratch every time you create a post/page. Just save once with reusable blocks and you can use as many as you like with just a few clicks. Save time and effort!

We hope this article was useful to you. If you are still confused about what a reusable block is, don’t hesitate to leave a comment because we will be happy to answer it.

[hurrytimer id=”247″]