How to Import/Export Astra Reusable Blocks

Child's Blocks A, B, C stacked on top of each other with text: How to Import and Export Astra Reusable Blocks

In this post I’ll show you how to import and export Astra reusable blocks.

If you have a basic knowledge of the Gutenberg block editor, this tutorial will be easy for you to follow.

And the steps here are not unique to Astra but can be followed on any WordPress site that uses Gutenberg.

TIP ~ If you don’t know Gutenberg, I highly recommend you invest in this Gutenberg training. Gutenberg is the future of WordPress and you don’t want to miss out!

So assuming you do know Gutenberg, let’s dig in and see how to import and export Astra reusable blocks.

This tip is so handy if you’ve spent a lot of time customizing a block and want to reuse it on multiple websites.

Or if you are working in a development site and want to move the block to production.

So let’s see how it’s done.


Export Astra Reusable Block

In our last post I showed you how to create and save a reusable block.

Once that reusable block is created, you can easily export it by following the steps below.

From within the block editor, choose Manage All Reusable Blocks:

blank
Export Astra Reusable Block

Next, find the block you wish to export.

Then click the option to “export as JSON.”

Save the file locally. It will be stored with file name of the related block and .json extention.

blank
Export Astra Reusable Block

In this example, my exported file is named: “my-related-posts-block.json.”

Now the file can be imported into another website.


Import Astra Reusable Block

Head over the the website where you want to use this reusable block.

From the block editor, find the option to “Manage All Reusable Blocks” and click on it.

blank
Manage Astra Reusable Blocks

Next click on the “Import from JSON” button.

Browse to the file you want to import and click the “Import” button.

blank

If you don’t see the block in your list after the import, refresh the browser and it should appear.

Once you have that block imported, it is available for use on any of the pages and posts in your website.

And you can use it just like any other reusable blocks you may have created.


Using the Reusable Block

Add a new page or post in the editor.

As shown in the demo above, find “Manage all reusable blocks” and click it.

Search for your block and add it to your new post or page:

blank
Using the Reusable Block

That’s all there is to it!

Of course you can customize that reusable block as needed for your new post or page.

Simply convert the block to a regular block and make the changes you need.

It’s easy and time-saving to import and export Astra reusable blocks.


Remember there are just three simple steps:

The number 01 in blue

Save Block

Once you’ve created a block that you want to reuse, save it as a reusable block.

The number 02 in blue

Export Block

Next, export the block as a JSON file and save it locally where you can easily retrieve it.

The number 03 in blue

Import Block

In the dashboard of your other website, go to Manage Reusable Blocks and import the JSON file.

Video Demo

Check out this quick video tutorial to see how to import and export Astra reusable blocks.

Go ahead and try it now! It’s easy to do!

Any questions? Please feel free to leave a comment below.


Related Posts

Subscribe
Notify of
guest
0 Comments
Inline Feedbacks
View all comments
Scroll to Top