Home » WordPress Tutorials » Basics » How to Use WordPress Reusable Blocks

How to Use WordPress Reusable Blocks

The WordPress Gutenberg Editor, known also as the Block editor comes with numerous features that can make the creation of your WordPress website and its maintenance as easy as possible.

One of the handy features Gutenberg includes is reusable blocks. With them, you can select and save various block settings and instantly use them on a different page or a blog post.


What are the WordPress Reusable Blocks

The idea behind reusable blocks is to save time and effort when adding the same content structure across several pages and blog posts. This feature eliminates the need to insert and individually set up each block you use for your site content.


How to Use WordPress Reusable Blocks

To benefit from the Gutenberg reusable blocks, you should first create some.

To create a reusable block, the first thing you should do is enter your WordPress admin panel.

Then, you should open a webpage or a blog post you wish to edit (Page->All Pages->Edit Page or Posts->All Posts->Edit Post).

The process of creating reusable blocks is the same regardless of if you are editing a page or a blog post.

For this demonstration we will create a new page (Admin Dashboard->Pages->Add New):

WordPress Gutenberg Reusable Blocks Add New Page


Once the Gutenberg interface is activated, you can start adding blocks with content. For this demonstration, we will create a sample page with a heading block, an image block, and two paragraph blocks. You can add any kind of blocks to your content, such as adding image blocks and codes containing code snippets.

If you are new to the Block Editor, then check out how to insert blocks with Gutenberg. Also, have a look at how to Set Full-Width Alignment in the WordPress Gutenberg block

Here’s how the layout turned out to be:

WordPress Gutenberg Reusable Blocks Layout


Now, tweak each block the way you want it to look. For example, change the font in the paragraph blocks, add text highlights, change the text color, and change the image formatting and size.

Once you have finished with the setup, it is time to make these Gutenberg blocks into reusable ones.

To make any of the blocks reusable, first click on one of them, and from the menu that pops up, click the three dots:

WordPress Gutenberg Reusable Blocks Settings


Clicking the three dots will open more menu options. From there select Create a Reusable Block:

WordPress Gutenberg Create Reusable Blocks Menu


After you click on Reusable Block, Gutenberg will prompt you to come up with a name for the soon-to-be reusable block. As a rule of thumb, add a description that includes more details about the settings you choose for this particular block. This will help you identify reusable blocks faster when there are more of them:

WordPress Gutenberg Reusable Blocks Add Block Name


WordPress Gutenberg Reusable Blocks details


Then, do the same with the rest of the blocks you would wish to reuse across your website.

Now, to use the newly-created reusable blocks, create a new page or a blog post you wish to edit:

WordPress Gutenberg Reusable Blocks New Sample Page


Now, click the black + button to add a new block within the page/post:

WordPress Gutenberg Reusable Blocks add Block


This button allows you to quickly insert Gutenberg blocks that are being used the most:

WordPress Gutenberg Reusable Blocks list


Within this list, you can see the reusable blocks you already set up, colored in purple and bearing the names you gave them:

WordPress Gutenberg Reusable Blocks


You can include them in your page/post right away by clicking on them. Once you do, they will appear with all the settings you made when creating the reusable blocks:

WordPress Gutenberg Reusable Blocks Layout


Without any additional setup and effort, these blocks appear in your content structure with all the settings you made and saved when creating the reusable blocks.



By making reusable Gutenberg blocks, you can save time and effort when crafting web pages with similar content structures.

Luckily, Gutenberg Block Editor makes the process simple and intuitive.


Was this article useful?

Click on a star to rate it!

Average rating 0 / 5. Vote count: 0

No votes so far! Be the first to rate this post.

Newest Articles:

How to Add a Site Logo Block in WordPress with Gutenberg

Adding a site logo in WordPress with Gutenberg is straightforward and requires only a few mouse clicks and just several minutes of your time. In the following paragraphs, you will read how to add a site logo to your WordPress website via the Gutenberg editor step by...

How to Add Images to WordPress with Gutenberg

Adding images with Gutenberg is quite simple. The block editor is very user-friendly and allows you to add images in several ways. In the following paragraphs, you will read about 4 methods you can instantly use to upload the media files you want.   How to Add...

How to Disable Gutenberg in WordPress

If Gutenberg is not suitable for your needs and wish to switch back to the Classic Editor, continue reading, as in this article we will show you 3 simple methods of how to disable the block editor. In the following sections, you will read how to disable Gutenberg by:...

5 Best Gutenberg Plugins for WordPress

One of the fastest and most convenient ways of enhancing the functionalities of Gutenberg is by using various WordPress plugins. Although Gutenberg is very versatile and feature-rich by itself, the open-source nature of WordPress has inspired developers all around the...

How to Add a Contact Form with WordPress Gutenberg Editor

If you are using Gutenberg to craft your WordPress website, then you should know that the process is very easy, especially by using the block editor. In the following paragraphs, you will read how to add one to your pages.   How to Add a Contact Form with...

Ready to Create Your Website?