The WordPress Block Pattern Directory

WordPress has announced that the Classic Editor plugin will be supported for one more year. The Classic Editor will also continue to be an option within the Block Editor. Still, your web team will have to get used to the Block Editor at some point. It is definitely the future of WordPress. One thing that might make you feel better about this: the new Block Pattern Directory.

Click the link to visit the directory. See a grid of patterns. Click “Copy” on one that you like and you will see the note “Copied” as in the screenshot below.

Now head to your WordPress website and paste the pattern into your block editor.

This is what happens: the block you chose appears on the page.

What’s a pattern?

Patterns are premade designs that you can use like a block in the block editor. If, for example, you were having an exhibit of art nouveau patterns at your gallery from July 14-21, you could stick the pattern above onto your home page and have a nice look all ready to go.

Once you’ve got the pattern in place, you can change the text just by typing.

You can make other changes, too, just as you would with a block in the block editor — or in online graphics tools like Canva. The screenshot below shows some of the tools you’ll see in the block editor for this particular pattern.

So a pattern is essentially a premade layout that you can use in the block editor for any page or post on your WordPress website.

What kinds of patterns are available?

Here are a few examples. Imagine you want to make a new header for your page. Here are some patterns you could use to get a specific layout quickly.

A simple call to action:

Get started with SEO

Strategy Document

A callout over a patterned background:

SEO Strategy

SEO provides the highest ROI of any marketing initiative.

Three columns of text with buttons:

Blogging helps your website rank for important keywords and brings visitors back.

Social media introduces you to new audiences and engages your regular visitors.

Analytics lets you know what works and what still needs work, when it comes to your website.

If you’ve had the experience of knowing what you want put on a page or in a post but not knowing how to accomplish it, patterns can make it easy. Or at least easier.

Play around with patterns

Take a little time to play around with patterns — or ask your designer to do so.

Patterns are not the same as repeating blocks, because they serve as a template, a starting point for your layout. If you change a repeating block, every example of that block will also change, and in the same way. You can use multiple instances of the same pattern and change each one into something completely different.

Find one you would use often and get to know it. Once you are comfortable with that pattern, choose another to practice with. Soon you will be an expert!


Posted

in

by

Tags:

Comments

One response to “The WordPress Block Pattern Directory”

  1. Akhil Avatar

    WOW! thanks for such a great article, it helps us to know how we can write an effective article in an appropriate way.

Leave a Reply