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.
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.
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:
- 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.
- 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.
- 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:
- 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.
- 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.
- 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
*One word of caution! Any changes that you make to a pattern are global. All of the instances of that block will change across your site.
Here is the pattern that I created:
I decided to format the text in italics.
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.
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!
Love this! Reusable blocks can be so handy for similar posts but it’s not something many people are aware of but could really speed up their content creation! Thank you for sharing this!
Anything that allows me to save time and energy- I’m all for it! Plus it builds brand awareness. Thanks for sharing.
This is a very important guide, I think most users of WordPress don’t know about the reusable blocks, a post like this can help WP users understand the new editor and its features like reusable blocks.
Oh, I love reusable blocks!
I use them in my blog and they’re definitely a time saver.
The Gutenberg editor was a great change in WP.