How to Import / Export Your WordPress Gutenberg Blocks (2 Steps)

Did you know that the new WordPress block editor aka Gutenberg allows you to save your custom content blocks and export them to use on your other WordPress sites. This little-known feature is extremely useful and can you save you a lot of time specially… Read More »

The post How to Import / Export Your WordPress Gutenberg Blocks (2 Steps) appeared first on WPBeginner.

Did you know that the new WordPress block editor aka Gutenberg allows you to save your custom content blocks and export them to use on your other WordPress sites.

This little-known feature is extremely useful and can you save you a lot of time specially if you’re building websites for clients.

In this article, we’ll show you how to easily export your WordPress Gutenberg blocks and import them to use on other sites.

How to export your Gutenberg blocks

Reusable Gutenberg Blocks 101

Gutenberg is a fully block-based WordPress editor where every piece of content you add is a block.

You can customize each individual block styles 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, etc.

We created a step by step guide on how to create a reusable block in WordPress.

Giving a name to reusable block

What a lot of users don’t know is that you can actually export these re-usable blocks to use on your other sites, client websites, and technically you can even sell them if you want to.

Let’s take a look at how to export Gutenberg blocks to use on other sites.

Exporting Your WordPress Gutenberg Blocks to Use on Other Sites

WordPress’ reusable blocks are not just restricted for the website they’re created on. You can easily export them to use on any other WordPress site.

First, you’ll need to open the block management page. You can navigate to that page by clicking the Manage All Reusable Blocks link inside the Reusable tab in your content editor.

Manage all reusable blocks in Gutenberg

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

Gutenberg reusable blocks management page

Step 1. Export Your Gutenberg Block

To export your Gutenberg block, you simply need to click the Export as JSON option below the block.

Export your WordPress block as JSON file

Next, 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.

Gutenberg block downloaded

Step 2. Import Your Gutenberg Block

You need to log into the other WordPress site and go to its block management screen. You’ll see an Import from JSON button at the top.

Click Import from JSON in Gutenberg

Go ahead and click on that button to import.

Next, you’ll see a file upload box. You need to click on the Choose File button and select the block JSON file you downloaded earlier.

Choose file to import block in Gutenberg

After it’s uploaded, you’ll see an Import option. Simply click on that to proceed.

Import WordPress Gutenberg block

WordPress will now import your new reusable block and save it in the database. Once done, you can use it on your new WordPress site like you would any other block.

Gutenberg block imported

We hope this article helped you learn how to export your WordPress Gutenberg blocks to use on other sites. You may also want to see our list of the must have WordPress plugins for all websites.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

The post How to Import / Export Your WordPress Gutenberg Blocks (2 Steps) appeared first on WPBeginner.

Rojenx is a leading concept artist who work appears in games and publications

Check out his personal gallery here

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