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

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.

Grid

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

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

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.

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.

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.

Once you enter a URL in the button block you will get 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.

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.

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.

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.

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

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

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.

If you liked this article please share with your network. You can use the social media sharing buttons below. Thanks!