How to import and export Reusable block in WordPress

by · Published · Updated

By using Reusable block feature in WordPress Block Editor, You have endless possibility of sharing, collecting and developing as your own and reusing block in your site. For this, you have to possess a clear understanding of how to effectively use Reusable block of Gutenberg editor.

In the meantime, we published a separate post on Creating, Saving, editing, reusing and Managing Reusable block. We suggest readers to read-out that post first for an unhesitating understanding of the present post. in this effort, we’re focusing on how to Import and Export Reusable block in detail.

Contextually, if you require a total understanding of how to use Block Editor or Gutenberg Editor confidently, check-out the list of our Block editor’s post collections.

Why to Export/Import Reusable block

First thing to know is here Export means Saving a block as .json file in your computer’s HD which makes that block Shareable to any media. And obviously, Import means uploading that file.

By Export/Import functions, Block Editor’s blocks are turned sharable, exchangeable and marketable. In short, by importing and exporting blocks, you can-

  • backup your Reusable blocks- created, saved or collected– in the Hard Drive of your PC.
  • share, exchange or market them.
  • collect block from any source and use in your site.
  • use the block collections to your other sites.

Where are Export/Import functionalities

‘Reusable Block Management’ page is your workplace regarding Import/Export as well as managing Reusable blocks. You can reach this page two ways-

  • In the Block Editor’s screen, click Three-dot menu on upper-right corner. Under Tools, click ‘Manage all Reusable Blocks’.
  • In the Block Insertion window, click Reusable menu. Scroll down to the bottom and Click ‘Manage all Reusable Blocks’.

On reaching the management page, you face the following interfaces.

C-panel File Manager

Here you see all of your reusable blocks listed. Now let’s find the Import/Export options.

Export

Below each block title, you see the ‘Export as JSON’. Click it and Open with/Save file window will appear. From here, select Save file and OK. Your block will be save as .json file in HD.

Import

On the upper-right corner, you see ‘Import from JSON‘ button.

  • Click it
  • Next, click Browse. You’ll be directed to the File Explorer window asking you to select the file you want to upload
  • Now find your desired .json file you saved earlier
  • Select it and click Open.
  • From the next screen, Click Import. Now Refresh the Browser and your .json file as well as the corresponding block will be shown listed

Hope you enjoyed the guidelines regarding Import/Export Reusable block in WordPress Block Editor.