How to Create Patterns in WordPress – Formerly Known as Reusable Blocks – and Why You Need Them

Reusable blocks in WordPress – now called synced patterns – were introduced when the Gutenberg block editor became popular. Before the Gutenberg block editor was developed, all WordPress content was created using the classic editor, which was similar to many desktop publishing editors. With the advent of the Gutenberg editor, WordPress has undergone a significant transformation in terms of content creation and editing. One of the standout features of Gutenberg is the ability to create patterns.
Paterns provide a powerful tool for enhancing efficiency, consistency, and overall productivity when building and managing your WordPress website. Here’s how and why to create patterns in WordPress.

image of wooden blocks to illustrate the use of reusable blocks in WordPress

Affiliate Disclosure: This post may contain affiliate links, which means I receive a small commission at no cost to you when you make a purchase. Please note that I only get affiliate links for products that I use.

This affiliate disclosure is a pattern

What are Patterns in WordPress?

Before talking about the benefits and process of creating patterns, let's first understand what they are. In Gutenberg, a pattern is a predefined content element that can be saved and reused across multiple pages or posts. It can consist of any combination of text, images, media, and other Gutenberg blocks. Once created, a pattern can be easily added or edited from the block library, providing a convenient way to maintain consistency and make content updates across your website efficiently.

Advantages of Patterns (Reusable Blocks) in WordPress:

  1. Consistency and Branding: Patterns enable you to maintain a consistent design and branding throughout your website. By creating standardized blocks for elements such as headers, call-to-action sections, testimonials, or contact forms, you ensure that the look and feel of your content remains cohesive across different pages. This consistency reinforces your brand identity and enhances the user experience.
  2. Time Efficiency: With patterns, you can save substantial time and effort when building or updating your website. Instead of recreating similar content or formatting from scratch, you can simply insert a pattern block, making it an ideal solution for frequently used elements. Whether you need to update a promotional banner or replicate a pricing table, patterns reduce the time spent on repetitive tasks, enabling you to focus on more critical aspects of your website.
  3. Easy Updates: Website maintenance often involves making changes to common elements across multiple pages. Patterns simplify this process by allowing you to update a block in one place and have those changes automatically reflected wherever the block is used.* Whether it's fixing a typo, adding new information, or modifying a design element, you can ensure consistency and accuracy with just a few clicks.

Creating Patterns in Gutenberg:

Here's how I created a pattern with an about the author bio:

screenshot row layout
I started with a row layout and added two columns. I put my picture in one and my bio in the other
screenshot create pattern
After I got my block to look the way I wanted it to, I clicked on the three dots in the block editor and chose “Create Pattern”.
screenshot pattern
I named the pattern “My bio” and clicked “Create”.
  1. Build the Block: To create a pattern, start by adding a row layout block and add the desired content and formatting using the Gutenberg editor. Combine various blocks and elements to achieve the desired structure and appearance.
  2. Save as a Pattern: Once you're satisfied with the block, click on the entire row layout that you want to save as a pattern. Click the 3 dots in the editor toolbar, then select “Create Patterns.” Provide a name for the block, which should be descriptive and easy to remember.
  3. Utilize and Manage: To add a pattern, navigate to the block library and search for your saved block by its name. Click on it to insert it into your page or post. To make changes, edit the pattern directly from the library. The modifications will be automatically applied across all instances of that block.*

A great use of patterns for bloggers is an affiliate disclaimer block. Make it once and use it on every post where you have affiliate links.

Making Changes to a Pattern

Here is the pattern that I created:

I decided to format the text in italics.

WordPress Basics for Bloggers

Diane Houghton is a veteran web designer and WordPress fanatic. She has been using WordPress for over 20 years.

Diane likes to explain WordPress in plain English without the tech talk.

She lives with her husband just outside of Boston and spends her spare time doting on her two grandchildren, her dog and her two cats.

screenshot reusable blocks
Click on the block and then click “Edit original” in the block editor
screenshot italics
I made the text italic and then clicked “Update”. Once the pattern saved, I clicked the Back arrow located in the “My bio” toolbar.

My pattern now has text in italics, and this change happened in every instance of this pattern on my site.

Patterns in Gutenberg are a valuable asset for streamlining your website building process. They offer the advantages of consistency, time efficiency, and easy updates. Patterns are an indispensable tool for content creators and website administrators. By using patterns, you can enhance your workflow, maintain a cohesive design, and ultimately provide a better user experience on your WordPress site.

Need some help? Join our Facebook Group and get easy-to-follow, step-by-step answers to your WordPress issues!

Unlock the potential of your blogging journey with our easy, step-by-step WordPress tutorials designed specifically for beginners.

Join the WP Content and Conversions Club!

Similar Posts