fbpx

How to Import and Export Gutenberg Blocks in Your WordPress Website

Unless you have been living under a rock, you have probably noticed that the brand new Gutenberg Post Editor has taken over the WordPress industry by a storm. The 5.0 version has introduced the authors with a Block-based Editing Platform. It is completely different from what we have been using for years. Like, for each content you want to create, you will now have to insert a respective Block and customize it. The Reusable Blocks is one of the unique features offered by the new editor. In this article, we will talk about the significance of it and how you can easily Import and Export the Gutenberg Blocks in your WordPress website.

How to Import and Export Gutenberg Blocks in Your WordPress Website 1

Why You Should Definitely Try Out the Reusable Gutenberg Blocks Feature

Among all its features, Gutenberg offers you the chance to save your custom contents for later implications if needed. This is a fantastic time-saving technique which you must definitely try out to get the best out of this new WordPress Editor. The most amazing part is that it gives you the opportunity to reuse the Gutenberg Blocks you have created on other websites as well.

The Reusable Blocks feature allows you to customize each of your contents as per your preference and then save it for future usage. As a result, you don’t have to create the same template over & over again. With the help of this brilliant feature, you can simply just insert the saved Gutenberg Block in your post and then tweak it if needed. Thus, it will lessen a tremendous amount of time and make you more efficient.

For instance, The Reusable Blocks will come in very convenient for the generic contents which are required to be inserted in every single post/page. You can simply just save the templates for Call to Action Button, a certain Text, Banner Image or anything per your requirements. With the help of this feature, you will able to simply integrate these custom contents in any pages at any time you want.

Let’s check out this step-by-step Guidance to help you easily get started with the ‘Reusable Gutenberg Blocks’ feature:

Step 1: Create a Reusable Block

Before you begin, you will need to make sure that you have created a Gutenberg Block in your post or page. Simply just go ahead and customize the Block in a way you prefer. After you are done with the personalization, click on the ‘3 Dotted icon’ which shows above the block you want to save. You would see this option popup right down the menu: Add to Reusable Blocks.

The ‘Add to Reusable Blocks’ feature will come in very handy and will save a lot of your time than you can imagine. By including your contents in Reusable Blocks, you will have the luxury to use them everywhere in anytime. You will always just be a click away to take advantage of this awesome Gutenberg property.

Gutenberg Blocks

Now that, we have discussed the significance of the ‘Add to Reusable Blocks’ feature. You can simply just go ahead and click on the ‘Add to Reusable Blocks’ option from the menu as in the screenshot above. Afterward, you will be asked to give a unique name for the Content you are trying to save for the later use. Once it’s done, your Gutenberg Block will be ready to be easily accessible for the future.

How to Import and Export Gutenberg Blocks in Your WordPress Website 2

Step 2: Manage All Reusable Blocks

After you have finished the previous step, click on the ‘Add New Block’ option from your Post Editor. Keep on scrolling till you reach the bottom of the Menu. You will see the section called ‘Reusable’. From here, simply click on the ‘Manage All Reusable Blocks’ option which will redirect to the ‘Blocks’ page.

Gutenberg Blocks

The ‘Blocks Management’ page will display all the contents you have saved from the Gutenberg Editor. Besides, it allows you to make changes to the Blocks you have created anytime you want. On top of that, you will have the flexibility to import or export your contents only with a couple of clicks.

Gutenberg Blocks

Step 3: Import the Gutenberg Blocks

If you want to insert a particular Gutenberg template on your website, you can do so from the Block management page. Right click on the button ‘Import from JSON’ and a file upload message will pop up in your screen. Then, pick your desired content that you want to use on your website and hit on the ‘Import’ button. After you have successfully imported the Gutenberg Blocks, you will then be able to fully capitalize off this astonishing feature by reusing it throughout your website.

Gutenberg Blocks

Step 4: Export Your Saved Gutenberg Blocks

The best part of the whole concept of Gutenberg Blocks is that it’s not restricted to a certain website where it is created on. It means that you can easily export your contents and then insert them on another website without any hesitation. To export your templates, simply just click on ‘Export as JSON’ option from the ‘Blocks’ page. After you have saved the JSON file on your computer, you can then go ahead and upload it on any website you want. Thus, you can get the best out of the ‘Reusable Blocks’ feature of WordPress.

Gutenberg Blocks

Final Thoughts

To wrap this up, we have already given you a brief on how you can easily access the Reusable Gutenberg Blocks feature to be more efficient with your work. We hope that this tutorial will help you to easily import and export your custom contents on any website you want. If you want to learn more about the Gutenberg Editor, you can check out our blog on ‘What’s new with WordPress 5.0’.

If you have any questions, feel to free leave your feedback in the Comments section.

Picture of Rafin

Rafin

Computer Geek with Love for Arsenal Football Club. Bit of a Workaholic as well.

Share This Story

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

  • 00Days
  • 00Hours
  • 00Mins
  • 00Secs

Wait... before you go!

Checkout now to Save