Show a list of all block patterns registered in a WordPress installation

Discover in this tutorial how to get and display all the block patterns of a WordPress installation using code.

In some cases you may be interested in displaying (or getting) all the block patterns of a WordPress installation, including the internal name or the one shown in the interface.

So in this tutorial you are going to learn how to get a list of all the block patterns registered in a WordPress installation

This would be the result:

• Title: Standard | Name: core/query-standard-posts
• Title: Image at left | Name : core/query-medium-posts
• Title: Small image and title | Name : core/query-small-posts
• Title: Grid | Name : core/query-grid-posts
• Title: Large title | Name : core/query-large-title-posts
• Title: Offset | Name : core/query-offset-posts
• Title: Social links with a shared background color | Name : core/social-links-shared-background-color

Let’s see it:

Steps to display all registered block patterns in a WordPress site using a shortcode

1. Create the shortcode

First you are going to encapsulate the registered block patterns inside a shortcode so you can display the listing wherever you want.

Add the following code at the end of functions.php or in your functionality plugin:

With this code you create a shortcode that allows you to display a list with all the themes of the WordPress installation using the [pattern_list] shortcode.

To get the list of topics you use the WP_Block_Patterns_Registry class along with the get_instance and get_all_registered methods in combination with a loop (foreach).

In this case, only the name of the block pattern is displayed. In a basic WordPress installation the listing will look like this:

core/query-standard-posts
core/query-medium-posts
core/query-small-posts
core/query-grid-posts
core/query-query-large-title-posts
core/query-offset-posts
core/social-links-shared-background-color
woocommerce/mini-cart-empty-cart-message

Instead, if the theme adds its own patterns in addition to the native WordPress ones you will see the theme’s ones. Something like this:

core/query-standard-posts
core/query-medium-posts
core/query-small-posts
core/query-grid-posts
core/query-query-large-title-posts
core/query-offset-posts
core/social-links-shared-background-color
karma/osom-two-buttons
karma/osom-osom-text-two-columns-with-images
karma/osom-two-images
karma/osom-osom-text-three-columns-buttons
karma/osom-pricetable
karma/osom-team
karma/osom-boxes

In this case, the ones registered by the OsomPress Karma theme are also shown.

If you are interested in formatting the listing more and getting extra information, such as the title of the block pattern, use this code instead of the previous one:

With this modification you format the list and show two elements of the array of the pattern:

• Block pattern name[Name] > internal name which allows you to unregister it if you want.
• Block pattern title [Title] > the one displayed in the user interface.

This is how it would be displayed:

• Title: Standard | Name: core/query-standard-posts
• Title: Image at left | Name : core/query-medium-posts
• Title: Small image and title | Name : core/query-small-posts
• Title: Grid | Name : core/query-grid-posts
• Title: Large title | Name : core/query-large-title-posts
• Title: Offset | Name : core/query-offset-posts
• Title: Social links with a shared background color | Name : core/social-links-shared-background-color

In order to view the listing you have only one step left.

2. Insert the shortcode where you want

The advantage of shortcodes is that you can insert them anywhere on the web.

Just type [pattern_list] where you want it to be displayed.

Important;

• If you are using the classic editor, use the HTML tab to enter the shortcode.
• In case you are already using the new block editor (Gutenberg) you can add it to the normal paragraph block, the HTML block or the shortcode block. All of them will render the content correctly.

This would be an example of the listing that the shortcode would display:

• Title: Standard | Name: core/query-standard-posts
• Title: Image at left | Name : core/query-medium-posts
• Title: Small image and title | Name : core/query-small-posts
• Title: Grid | Name : core/query-grid-posts
• Title: Large title | Name : core/query-large-title-posts
• Title: Offset | Name : core/query-offset-posts
• Title: Social links with a shared background color | Name : core/social-links-shared-background-color

Conclusions

Now you know how to get and display a list of all the block patterns registered in a WordPress installation to decide if you need them all or not.

Any questions? I read you in the comments.

And if you want to give me any suggestion for future tutorials, leave it in the contact form. Advantages of being a subscriber. 😉