Exporting and Importing Gutenberg Blocks in WordPress

WordPress users have had a mixed relationship with the WordPress block-based builder, but the new Gutenberg editor has proven to be a game-changer. With its amazing features, creating beautiful content has become easy and fun. Gutenberg offers enough features to create remarkable pages and posts without writing code. It has a battery of customization options that allow users to modify and style each content block extensively. Additionally, there are a ton of Gutenberg add-on plugins available for those who want even more blocks than what is available in the default editor.

One of Gutenberg’s brilliant features that many users are not aware of is Reusable Blocks. These are simply content blocks that users create, save, and reuse at will. For instance, if a user wants to add a call-to-action, thank you note, signature, form, or anything else at the end of each post or page, they can create a single reusable block and use it not only in their posts and pages but also on other WordPress websites. This feature can help users save a lot of time, especially if they create many websites or need to add special content to each post/page.

Creating a reusable block is incredibly easy. Users can navigate to Posts > Add New to launch the Gutenberg editor, click the Add Block (+) icon, choose their content block, customize and style it as per their needs, and then convert it into a reusable block by clicking the More Options icon and selecting Add to Reusable Blocks. Users can then name their reusable block and hit the Save button.

Adding the reusable block to posts or pages is also easy. Once users have added the required content to their post or page, they can click the Add Block (+) icon, scroll to the Reusable Blocks tab, and choose their block. They can then hit the Preview/Publish button to view their results in the front-end.

To export a reusable Gutenberg block, users can click the More tools & options icon inside the Gutenberg editor, select Manage All Reusable Blocks, mouse over the title of the block they want to export, and click the Export as JSON link that appears. They can then save the JSON file to their computer. To import the block to another WordPress site, users can open the Gutenberg editor, select Manage All Reusable Blocks, click Import from JSON, choose the file they downloaded earlier, and hit the Import button.

There is also a free plugin known as Blocks Export Import by ThemeIsle that allows users to skip the entire tutorial. Users can install and activate the plugin, design their block as desired, click the More options icon, and hit Export JSON to download the JSON file to their computer. To import the JSON file using the plugin, users can open the Gutenberg editor, click the Add Block icon, select Import Blocks from JSON under the Widgets tab, choose the file from their computer, and hit the Upload button.

In conclusion, reusable Gutenberg blocks are a lifesaver for users who create a lot of posts/pages and/or websites. Learning how to export Gutenberg blocks can come in handy and save users a lot of time. If users have any questions or suggestions about Gutenberg blocks, they can leave them in the comments below.

Stay in Touch


Related Articles