1. Home
  2. WordPress Tutorials
  3. How To Export and Import Gutenberg Blocks in WordPress

How To Export and Import Gutenberg Blocks in WordPress

You need a better, faster web host. Free Site Migration, Amazingly Fast, Secure & Eco-Friendly WordPress Hosting with 24/7 Support. Check Out Our Hosting Plans

There has been a lot of fuss made over the new WordPress block editor Gutenberg. People have had a hard time adjusting to it for a number of reasons, most specifically because most of us don’t like change.

However, the new block editor does come packed with features and gives you the ability to accomplish a lot of different things.

For instance, did you know that Gutenberg allows you to save your custom content blocks and export them to use on your other WordPress sites? In this article, I will show you how to easily export Gutenberg blocks so that they can be used on other WordPress sites.

Quick Rundown of Gutenberg

If you are reading this, chances are you know what Gutenberg is and at least a little about how to use it. For those of you who don’t, Gutenberg is a fully block-based WordPress editor where every piece of content you add is a block.

You can customize WordPress Gutenberg blocks and re-use it to quickly create content in the future. These re-usable blocks are extremely helpful for adding call-to-action buttons, feedback forms, banner ads, and much more.

What many of you don’t know is that you are able to actually export Gutenberg blocks and then import Gutenberg blocks and use them on other websites.

This is specifically helpful if you work on client websites and need to recreate the same info over and over. Technically, you can even sell your one of a kind Gutenberg block, but that is for another time.

Let’s take a look at how to export Gutenberg blocks so that they can be used on other sites.

Export Gutenberg Blocks

WordPress Gutenberg blocks are not restricted to the specific site you are working on. You can export these blocks to use on other WordPress sites.

The first thing you need to do is find your way to the block management page. To access that you need to be inside any post or page and running your WordPress editor.

Once you have navigated to a post or page and you are inside the editor click on the “Manage All Reusable Blocks” link inside the “Reusable” tab in your content editor.

Click on manage reusable blocks

Once you are on the block management page, you can edit, delete, export, and import your WordPress Gutenberg blocks.

Manage all your reusable gutenberg blocks

To export the block you choose just click on the “Export as JSON” option that is located beneath the block.

Click on the export as json link

Once you click on that option your block will be downloaded to your computer as a JSON file. Now, you can upload this JSON to any other WordPress site and use the block over and over.

Import Gutenberg Blocks

To import Gutenberg blocks you need to log into the website you want to have the reusable block available and head back to the block management screen.

Manage all your reusable gutenberg blocks

You can see the Import from JSON button at the top of the block management page. Simply click on that and you will be prompted to upload the JSON file you exported earlier.

Import the json file to reuse the block

Choose your file and click the Import button and WordPress will now import your new reusable block and save it in the database.

Once that is done, you can use it on your new WordPress site like you would any other block.

As you can see, this is just one of many great functions and operations that the WordPress Gutenberg block editor brings to the table. I hope this article was helpful and showed you how to easily export and import WordPress Gutenberg blocks to be used on any WordPress website.

Have you already started creating your own Gutenberg reusable blocks? Are you starting to settle into the new editor?

Author: Jeremy Holcombe

Updated on August 5, 2019

Was this article helpful?

Related Articles

Leave a Comment

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