Build With WordPress Block Patterns

If you’ve worked with WordPress, you know how you can make it do whatever you want with the right plugins and themes. In fact, we’ve regularly written about great themes and plugins.

But now with their block-based system, there’s a whole new way to customise your WordPress experience — block patterns.

What are block patterns?

When you use the latest versions of WordPress, you use the Block Editor. There are paragraph blocks, list blocks, image blocks, etc. And you can take individual blocks, and put them together to create a block pattern.

To use a home building metaphor, if a block is a single brick, a block pattern is an entire pre-fabricated wall. And rather than building your house brick-by-brick, you build it using your pre-fab walls.

You can create your own block patterns on WordPress’s Block Pattern page, under “Create a new pattern”. You’ll need a WordPress.org account for this, but once you log in, you can build your own patterns and submit them to the Block Pattern Gallery.

If you want to see what kind of block patterns you can make, here are five that we’ve found and like.

A screenshot of the demo version of the Three Pricing Columns block pattern by Oliver Juhas, showing three columns with prices and details inside. The middle column is a different colour and slightly higher than the other two.

Three Pricing Columns

A good three-column product table is ideal for a lot of different sites, and this one by Oliver Juhas not only gives you a great table, it also has the middle column slightly taller and in a different colour, making it stand out on the page. It’s been shown in UX studies that highlighting the “recommended” pricing plan makes more people purchase it, and this is a great way to really show off the right plan for your customers. This product table also works well at smaller dimensions, making it a breeze to use on your desktop and your phone.

A screenshot of the demo version of the Mixed Shape Gallery block pattern by Mel Choyce-Dwan, showing four photos, all slightly different shapes, all laid out in a grid pattern.

Mixed Shape Gallery

If you’re an artist, a photographer, or just want to show off beautiful things in a beautiful gallery, Mel Choyce-Dwan’s pattern will be a great addition to your site. Built for images that are different sizes and shapes, it gives you elegant style while also effortlessly responding to the browser size.

A screenshot of the demo version of the Team Column Grid block pattern by Anariel Design, showing four different team members, with photos, in a masonry layout. The team members photos are of cute animals.

Team Column Grid

Built to imitate a masonry effect (like you see on Pinterest and other sites), this pattern from Anariel Design gives you a simple and elegant solution to the problem of how to effectively introduce your team. And it’s not just good for showing off your team, it’d be great for anything that has images and brief descriptions, whether that’s a gallery of your work or items for sale.

A screenshot of the demo version of the Recipe block pattern by WordPress.org. It is a recipe for a tomato sauce, and includes the ingredients, the number of servings, the cooking time, and the caloric content.

Recipe

An easy way to post recipes has been a white whale for many food bloggers and web designers over the years, and this pattern from WordPress.org will have you posting your grandmother’s top secret family holiday biscuit recipes before you know it. The switching of the ingredients from two columns into one column when you switch to a narrow resolution is just the icing on the cake.

A screenshot of the demo version of the Full Width Photo Grid block pattern by donalirl. Square photos with a space theme are in a 3x2 grid with white text over each image.

Full Width Photo Grid

Sometimes you just want a whole bunch of images in a nice grid. Maybe it’s to show off your categories. Maybe you have a lot of artwork. Maybe you just want to have grids all over the place. With donalirl’s pattern, you’ll have more perfect squares than you know what to do with.

So those are five patterns that we found and like. And if you make your own, why not tell us on Twitter, Facebook, LinkedIn, or Instagram?