What’s New in WordPress 5.9 Patterns and the Patterns Library?
What’s New In WordPress 5.9 Patterns Library shows how to add and customize patterns. Patterns are done-for-you block layouts you are a mouse-click from adding to your site.
Here is a video version (pretty much) of this post:
What are WordPress block patterns?
Now, just a quick recap, block patterns are premade ready-to-use layouts made up of WordPress blocks.
These are huge time savers because, for one, they are so easy to add your posts and pages, and two, you do not have to be a design wizard to have a beautiful WordPress site now. With Block patterns or just patterns, you can harness the design powers of someone else by simply adding the pattern they crafted to your post or page.
Plus, this is one of those items in WordPress 5.9 that you can use without having a block-based theme active on your site.
So let us open up a post and have a look. A quick reminder that wherever your cursor is in your editor window is where your pattern will end up once you either click on it from within your patterns directory or paste it from the new patterns library, which I’ll get to in just a second. And, of course, this works with pages as well.
Let’s open up our block inserter, then click on patterns.
Are patterns theme specific?
Your available patterns are premade or done-for-you block groups, or layouts, containing elements within that active theme. The patterns you’re seeing are based on the theme that you have active. Each pattern contains blocks that are available in every WordPress 5.9 installation.
Different themes have different default color schemes and images. It is those theme colors, images, and font styles that are showing up in these patterns. Since there are so many patterns and more coming all the time, they’ve got them categorized just as they did in the prior version of WordPress 5.8.
So all you have to do again, wherever your cursor was in your editor window, come on through your selection of patterns, find the one that you think fits best for that particular part of your design needs and click on it. Boom automatically added.
Then you can come up to and open your List View tool. Select one of the elements within the pattern you just added. You will see a thin blue border around what you just selected. In the List View tool, you will see that selected block so you can make whatever adjustments you see fit.
Patterns are a big time saver and can make us all designers.
Again, patterns are a huge time saver, especially if, like me, your design skills are kind of minimal, if they exist at all.
Somebody that does have design skills, and the time, went ahead and created all these beautiful patterns. So all you have to do is click, that’s it – a mouse click, and you’ve got their expertise now added to your editor window.
Oh, and it gets better.
The built-in patterns available to you in the left sidebar or block inserter section are great, and all, but even better than that is when you click on the Explorer button next to the Patterns button, you have a pop-out model that shows you all those patterns in more of a full-screen mode. Now you can more easily see and compare the differences in the various patterns you have on your site.
But wait – there is more block pattern goodness!
Okay, so we can open our built-in patterns within the block inserter section. We have this pop-out model that displays all those patterns in a larger, more easily seen format. What could possibly be better than that?
It is called the Patterns Library at WordPress.org.While in your editor window, put your cursor at the end of where you want to add your pattern.
Now open a new browser tab and go over to wordpress.org. In prior versions of WordPress, the patterns library existed, but it was only in a beta stage. Now that it’s out of beta, they’re still constantly adding to it, but you can actually find it as a link in their new navigation bar.
When you click on the navigation link at WordPress.org for Patterns, on the Patterns library page, just like themes and plugins, there is a search box (2) for patterns. They have various categories (3), just like they do on the pattern section within your WordPress site. If you’re logged in (1), by the way, it doesn’t cost anything to have an account at wordpress.org. But if you’re logged in to your WordPress.org account, you can always add these patterns to your favorites (4).
But here’s the beauty part.
A copy button is displayed when you move your cursor over the different pattern thumbnails. All you have to do is click on the Copy button of the one that you want to add to your post or page. Go ahead and give it a try. Basically, when you click on that copy button, it’s now copied to your browser’s clipboard. Head on back to your site in that other browser tab. Make sure your cursor is where you want to add that pattern, then right-click and paste.
How beautiful is that?
And then, just like the patterns on my site, I can come into List View, click on that pattern, go to any of those blocks and make whatever design adjustments I see fit. Let’s go on back to our Patterns Library at WordPress.org.
Getting a closer look at the patterns in the patterns library.
Heading back to the patterns section at WordPress.org, we have looked at the patterns library but let us have a closer look at the individual patterns.
When you hover your cursor over a pattern, the copy button is displayed. When logged in at WordPress dot org, you also see the favorited heart displayed – white if not in your favorites, or red if it is in your favorites.
When you click on one of the patterns, it opens in its own page displaying the pattern in full size. This allows you to see it in detail much better than just the thumbnail image.
You have some adjustments you can make to the size before you copy it to your browser’s clipboard. And once it’s open, you can see these are the different categories (1) that this particular pattern can be found in. You have several preset sizes you can choose from within the drop-down list (2), or on either side of the pattern, you will see handles (3) that you can drag out to whatever size you want. That will change the size setting in the drop-down to custom.
Whatever you think might fit best on your site before you copy it from the patterns library and paste it onto your site. Then you just click on the Copy pattern button (4) and come on back to your site, right-click and paste into your editor window. It is that simple.
Not having many if any design skills, being able to use the expertise of others that do have those skills, is a big help to me. While the use of block patterns not only allows me to use someone else’s design skills, it also allows me to save a ton of time trying to decide on certain color schemes or image placements or any of the other half-zillion things that go into proper designs.