WordPress Block Patterns

I’m not a WordPress expert, but I’m happy to share information about features which I enjoy using on my site. This particular post relates to use of block patterns.

In order to use block patterns, you must be using the block editor to compose content. Haven’t tried it, yet? Well, here’s information on converting from the classic to the block editor.

Footnote: As a result of this fundamental change, theme updates regarding compatibility have ensued, and several themes have been discontinued. These themes remain in use, however, until such time as owners change the theme used on their respective sites; after which, the previously used (discontinued) theme will no longer be available.

Here is a list of themes which “fully support use of the new block editor to create and edit content”.

I use the free Twenty Twenty-One (default) theme on my site.

Block Patterns are a collection of predefined blocks that you can insert into posts and pages and then customize with your own content.

Source: Support

Here’s a video demonstrating how you can add block patterns into a post or page on your web site:

Examples

One of my favorite block patterns serving to complement use of a vertical perspective photograph, can be found at Patterns > Images > Images And Text. You can see an example post, and I’ve also included a screenshot below:

After replacing the provided image with my own photograph, I select the desired image size to use from the right sidebar. Then, add text.

If you should decide to delete the block pattern you’ve selected, simply click in the editor on the top edge of the block pattern, then on the three (vertical) dots & choose “Remove block”.

Here’s another one of my favorite block patterns to use. It’s can be found at Patterns > Images > Two Images And Quote. Screenshot:

You can adjust the spacing of your image in Column 1 by changing the Offset numbers (from 0 to 1 shifts the image right, towards center). To do so, first select “Block” at top of the right sidebar. Next, you’ll need to click within the block itself, in between the two columns. Having done so, you’ll see the aforementioned spacing options become available in the right sidebar. Adjust as desired.

Here are linked examples of other block patterns I commonly use:

  • Example: Patterns > List > Numbered List
  • Example: Patterns > Quote > Image And Quote

Conclusion

Though many themes in the past have provided WordPress users with varied aesthetic and functional capacities, the new block editor with block patterns has changed the extensibility of what is possible.

Now, users have the opportunity to create content in a myriad of manners, using block patterns individually, or in combination with other blocks (i.e., Media, YouTube, Lists, Quotes, etc.).

There are presently dozens of block patterns available, with many more in the pipeline. This is the likely future of WordPress, one in which users will have much greater control over their content.

I hope you’ve found this post informative & useful. Thanks for reading!

By Phil

I'm a self-taught graphic artist with a penchant for all things creative, and feature an eclectic collection of unusually imaginative designs available through various print-on-demand galleries. Enjoy a look around my portfolio, collections and blog, and follow me on Twitter for more updates - thanks!

12 comments

    1. It’s my pleasure, dear Luisa ~ I think block patterns are a wonderful feature and hope you found the information useful. Have a great weekend, my friend 🤗🌹

  1. This is great information & you’re super to share it! I’d try it but I’m using the Classic editor – the old, old one from a thousand years ago not the hybrid Classic Block – until it’s gone. They make it tricky to access but it’s still there. I’ve fav’d this post in Safari so it’ll be there for when the time comes. Thank you for sharing it!! 🥰👋

Leave a comment

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s