Reusable Blocks
Reusable Blocks
Reusable blocks are a powerful tool within the WordPress editor. They create a template-like block that will be used in multiple areas throughout the website. This allows you to create a block that can be syndicated in other areas of the site and modified from one location. This is handy for common items shared throughout the website that are not connected to a dedicated manager.
Note
Careful not to overuse reusable blocks. Consider how many instances of the block might be required before creating a new one.
Examples
The below example shows the "Finance Your Degree" block which is used on many pages throughout the site. By creating the element as a reusable block, it can managed in one unique place but used on multiple pages. If an edit is made to the block, it will be made to all instances of it across the website.
Example of a reusable block in the WordPress editor:
Example of same reusable block on a live page:
Reusable blocks directory
All reusable blocks are stored in the Reusable Blocks directory. Here you can quickly glance at all reusable blocks that have been created. You can also see where each block is used within the IHPME website.
To navigate the Reusable Blocks directory, select "Reusable Blocks" from the WordPress left-hand navigation menu.
Example of Reusable Blocks directory:
Editing Reusable Blocks
Editing existing blocks
A reusable block looks like any other block within the editor. It can also contain many blocks within it. To edit a block, select either the existing reusable block within a page, or navigate to the specific block from the Reusable Blocks directory.
Reusable block example:
In this example of a reusable block within the editor, you can see that this is a collection of several elements - a card with an accordion and a series of links.
Blocks in use
When navigating the Reusable Blocks directory, beside the name of each block is some extra data. To the right of the reusable block name, you will see if the block is currently in use on any page within the IHPME website. If the reusable block is in use, it will provide a link and name to the pages that the reusable block currently exists on. If a block is not in use, no extra data is provided beside its name.
Example of Reusable block in use and not in use.
Saving Reusable blocks
Saving reusable blocks is no different than saving/publishing a page within the WordPress editor. Make edits to an existing block or new block and select publish from the upper right-hand corner.
Note
Be mindful of editing reusable blocks. If the block is used in more than one place, any edits saved will effect all blocks across the entire IHPME website.
Creating new blocks
There are two methods to create new reusable blocks:
Creating a new blank reusable block
You can create blank reusable block directly from the Reusable Blocks directory by selecting "Add New" from the upper toolbar area. This creates what looks like a new blank page. Here you can add whatever block elements you wish to create on the page.
When your block is complete, you can publish the new block to the Reusable Blocks directory by selecting "Publish" in the upper right-hand corner of the editor. This will allow the block access across the website via the block inserter.
Creating a new reusable block from existing blocks
You can also convert existing blocks on any page into a reusable block. This method is often preferred as it lets you construct the block within the context of all the content of a page.
To convert an existing block to a reusable block, select the three dot menu from the floating tool bar of the block you wish to convert and hit "Create Reusable block".
After creating your new reusable block, you'll be asked to give it a name. Make sure to choose something that is easily understood and accurately describes the block.
