This post may contain affiliate links, I receive a small commission if you make a purchase with this link.

GenerateBlocks review: build better WordPress websites

Use GenerateBlocks plugin to help you build better WordPress websites. GenerateBlocks gives you 6 lightweight blocks that help you create cool looking designs within your content. It’s great for non-designers like myself and other people who need to concentrate on writing content but also want their website to look visually pleasing.

I use GenerateBlocks in this article and throughout my website. It’s great in combination with GeneratePress WordPress theme, they both have the same principles of being lightweight and simple to use.

Table of Contents

Blocks available with GenerateBlocks

You get six blocks which can be used separately or combined to make bigger visual elements. The six blocks below are added to your block editor in WordPress:

CONTAINER

Organize your content into rows and sections.

GRID

Create advanced layouts with flexible grids.

image

Add static or dynamic images to your content.

HEADLINE

Craft text-rich static or dynamic content.

BUTTONS

Drive conversions with beautiful buttons.

query loop

Build a list of posts from any post type.

Container

It can be useful to start your content sections with a Container block. Set the container width, padding and margin, which helps when building content areas.

Advanced Backgrounds and Effects

Containers let you set an advanced background. As you can see in this section I’ve added background effects to the container.

This is available in the GenerateBlocks Pro version. You can add an image background or a color gradient, as I’ve used here.

Grid

The Grid block lets you split your content area into columns and rows. When you select the Grid you get the options below:

Grid block

After you select the layout for your grid you can then individual fill the cells with your content.

generatblocks grid block

Image

Add an image to your content. You can do this with the standard block editor but I prefer the GenerateBlocks version because of the improved settings. In particular I can easily set the padding and margin around the image.

generateblocks image block

You get the following options when adding an image:

  • Settings – image size and object fit
  • Spacing – padding, margin, border size and border radius
  • Colors – set border color
  • Dynamic Data
  • Effects (GenerateBlocks Pro) – Opacity/Blend, Transitions, Box Shadow, Transform and Filter
  • Advanced – add additional CSS classes and hide on mobile, tablet or desktop

Headline

Use the Headline block for headers or blocks on a single link of text, e.g. calls to action.

The GenerateBlocks Headline block is better than the standard header block because of the improved settings provided, particularly the margin and padding settings.

You can also add an SVG icon next to the headline which can be useful for tips or other content that you want to stand out.

headline block in GenerateBlocks
Headline block

In addition to the H1-H6 headers you can also select paragraph, div and figcaption. I only realised that recently. That’s useful when you don’t want a headline but need the extra options you get with a headline block, e.g. adding an SVG icon to the text.

In the Icon section you can select from a general list of icons or the social list.

You can also paste in the SVG from other sites.

You can find free SVG icons here:

https://icons.getbootstrap.com

or here:

https://www.svgrepo.com

Buttons

The Buttons block allows you to easily add one or more buttons to your content. Add spacing and margin to each button.

Stack the buttons vertically or space them out horizontally.

You can add a link to a button.

button block

Once you enter a URL in the button block you will get more options:

button block - more options

You can select a font family and size for each button you add.

Effects and Background Gradient options are available for the GenerateBlock Pro version.

Query Loop

The Query Loop block allows you to display posts based on some criteria.

query loop example

You get plenty of options to filter the list of posts that appear in the grid.

You can stack parameters that all have to be satisfied for the post to appear in the grid.

In the example here I add the following filters:

  • SEARCH set to “Mobile”
  • Post appears in the “Blogging” category

This block is useful if you want to add a “Related Posts” section in your content.

Just set the conditions to show only related posts.

GenerateBlocks Pro

The GenerateBlocks Pro version gives you more options and a pattern library of over 200 patterns you can easily add to your content.

To select from the pattern library select it from the block menu in your WordPress editor.

WordPress Block editor - GenerateBlocks options
Filtered list of blocks – select the Pattern Library to see all the patterns available

Selecting the Pattern Library will show a pop up dialog showing all the patterns available to choose from. You can filter the list of patterns by type using the drop down. Clicking on a pattern will add it to your page.

Pattern Library pop up filtered to show Info Box patterns only
Pattern Library – Filtered to show Info Box patterns only

Each pattern is a collection of pre-made blocks. You can modify any of the blocks to customize the display. Images are not imported so you will need to add your own images from the Media Library or upload them.

With over 200 patterns available you can find a suitable pattern usually.

Common patterns can be saved as a local pattern. Use local patterns to easily add common content (like this tip box).

GenerateBlocks Templates

You will usually find yourself using the same pattern or layout on multiple pages. Rather than having to create this pattern each time you can save it as a local pattern and easily drop it into future pages.

For instance, the tip pattern I just used in the previous section.

Local Pattern - GenerateBlocks Pro
Tip – Local pattern defined in GenerateBlocks Pro version

Once I have defined and saved this pattern it is now available for me to used from the pattern library.

Pattern Library - Local tab
Pattern Library – Local patterns, the Tip pattern is available for me to use

Clicking the pattern will add it to your content. Then you just need to edit the text and you have added a tip! Easy.

Creating local patterns helps keep your content and styles consistent.

GenerateBlocks Pro Prices

Personal

$39 / year

For 1 Site

200+ patterns

Build local patterns

Global Styles

Best Value

Plus

$69 / year

For 10 Sites

200+ patterns

Build local patterns

Global Styles

Professional

$99 / year

For 250 Sites

200+ patterns

Build local patterns

Global Styles

30 Day Money Back Guarantee

For peace of mind you get a 30 day money back guarantee on new sales when you purchase GenerateBlocks Pro version.

Final Thoughts

I use GenerateBlocks on this site. At first I used the free version of the plugin then I noticed the set of patterns that can be used on the Pro version.

For me, as a non-designer, I’m not able to create good looking designs easily so I benefit from using the many good designs available in the pattern library.

6 block elements added to your editor

save hours of design time with a couple of clicks

Simple to use.

30 day money back guarantee.

If you found this article helpful, please consider sharing it with your network by using the social media sharing buttons below. Thank you for your support!

Leave a Comment