Review of GenerateBlocks Pro – Blocks Based Page Builder Plugin

WordPress was using TinyMCE classic editor for many years before introducing Gutenberg block editor with version 5.0. Gutenberg was first introduced as a plugin before finally making it as part of the core. Though there were lot of hesitation from users to switch from classic editor, it was clear that Gutenberg is the future of WordPress. The blocks world is continuously evolving and GenerateBlocks is one of the finest piece to make full use of the Gutenberg editor. In this article, we will explore more about the functionalities and features of GenerateBlocks free and Pro versions.

GenerateBlocks Vs Page Builder Plugins

We are using WordPress for almost a decade and used many popular page builder plugins like WPBakery, Elementor, SiteOrigin, etc. Most of these plugins are heavy weight relying on JavaScript and drastically pull down site’s speed. After Gutenberg, we completely get rid of page builders and started using the blocks instead. Since we are also using GeneratePress theme, just thought of trying out GenerateBlocks Pro to check how that works.

• The plugin was developed by the same author of GeneratePress theme. If you are using GeneratePress theme, this plugin will work seamlessly though it will work with other themes as well.
• This is a lightweight plugin and the downloaded zip file is of merely 180KB in size.

• It does not use any JavaScript and only adds a simple CSS file to the page and makes use of the core WordPress blocks. Therefore, you do not to worry about your page speed impacting with this plugin.

• The plugin does not dump shortcodes at the backend, it offers multiple blocks which you can use within Gutenberg editor. If you disable the plugin, your content will still be there without the CSS styles and without any visible shortcodes.

If you are fed up with heavy page builders and looking for lightweight block based page builder experience then GenerateBlocks Pro is for you.

GenerateBlocks Free Vs Pro Version

GenerateBlocks follows the same logic of GeneratePress theme. You have to install and activate the free version in order to use the premium Pro version. Single site license for Pro version will cost you $39 with one year free update and support. After that you have to renew for getting support/update or use the plugin without updates. You can use credit card or PayPal for payment and complete the purchase.

After completing the purchase, download the plugin zip file and note down your license key for activation.

Good part is that there is 30 days moneyback guarantee that you can make use if needed to get the full refund.

Installing GenerateBlocks Pro Version

As mentioned, you need to first install GenerateBlocks free plugin in order to use the Pro version. Login to your WordPress admin panel and go to “Plugins > Add New” section. Search for “generateblocks” to find and install the plugin in your site. After that, you can upload the Pro version zip file and activate it also.

GenerateBlocks Plugin Settings

The plugin will add set of menus under “GenerateBlocks” heading in the sidebar and go to settings section to activate the license key.

Other than license activation, you can choose whether to load CSS file externally or inline embedding. We will discuss local templates, global styles and asset library options later after understanding how to use the blocks.

Features of Free Version

The free version of the plugin as such offers simply 4 blocks – container, grid, button and headline.

Though you can fine-tune the typography, spacing and other settings for each of these blocks, they are redundant to the default Gutenberg blocks. You can insert any of these blocks in Gutenberg editor similar to the regular blocks.

• Container – create container with fullwidth, add backgrounds and insert multiple blocks inside the container.
• Grid – create column layout with multiple grid options.
• Headline – create headline and adjust the parameters.
• Buttons – create single, fullwidth, stacked (horizontal/vertical) buttons.

Features of Pro Version

The Pro version offers a single “Template Library” block in the editor in addition to the four free blocks. You can type /gene and filter all five blocks for quick selection.

The template library block contains 150+ individual blocks categorized into the following groups.

You can insert hero section, call to action, buttons, pricing table, team member or any other blocks as shown on their demo page. For example, there are more than 20 buttons which you can insert with few clicks and customize the style.

Customizing Blocks

The advantage of GenerateBlocks is that you can adjust block parameters as per your design all within Gutenberg editor. You can preview the changes live in desktop, tablet and mobile to check the look of the block before publishing it online.

Here are the customizing options available for each block element:

• Typography – set font size, family, weight and transform for text content.
• Spacing – adjust padding, margin, border, border radius and z-index properties.
• Colors – setup background, text, link and border colors for normal and hover view.
• Backgrounds – apply image or gradient color background to selected element.
• Shapes – the plugin offers predefined shapes for curves, angles, waves and triangles. You can insert an adjust the properties as per your need.

• Effects – additional effects for elements like transition, opacity, box shadow, text shadow, transform and filter.
• Documentation – link to help documentation page.
• Advanced – default Gutenberg option to add HTML anchors and additional CSS classes. In addition, the plugin will add options here for adding custom attributes and hiding on desktop/mobile/tablet.

Some blocks will have additional layout option to adjust the width and other parameters.

As you can see, it is possible to customize each pixel of block elements with GenerateBlocks Pro version. If you feel exhausted with too many options, simply insert one of the demo block as it is and update your content directly on it.  

Global Styles, Local Templates and Asset Library

In addition to simply inserting the blocks, GenerateBlocks also make it easy for reusing the templates.

Using Global Styles

This is ideal when you need to customize the style of any existing block. For example, you like to add an additional style to one of the heading blocks and use that all over your site. In this case, it does not make sense to edit the block and customize each time. The ideal way is to create a global style and give it a name. go to “GenerateBlocks > Global Styles” and create a new style with your heading block and customize it. On the sidebar block options, you can see the plugin automatically assigns a global style identifier. You can rename the identifier with the name that you can easily remember, for example we name it as style-1.

When you create a page/post, you can then choose this global style when inserting the block on the editor. You have to enable the “Use Global Style” slider and choose the name you have provided from the dropdown. Now, all your custom styles will be applied to the block instantly.

Using global style option will save you plenty of time when you want to customize multiple blocks with additional styles. You can apply the global style only for desktop and use different style for mobile and use any such combination.

Local Templates

This is another time saving option similar to creating reusable blocks in Gutenberg. Go to “GenerateBlocks > Local Templates” and create your custom template. You can use any blocks from core Gutenberg editor, GenerateBlocks Pro or any other plugin for that matter. It is also possible to assign a featured image so that you can easily identify when inserting from the editor.

After creating your local template, you can insert that template on any page using the same “Template Library Block”. Click on the “Local Template” tab and select your template to insert in your page.

Asset Library

GenerateBlocks Pro uses two type of assets – predefined shapes and icons both in SVG format. The difference is that shapes are dynamic elements served from the library and icons are loaded from that particular page. You can add your own shapes and icons by going to “GenerateBlocks > Asset Library” section.

It is possible to create groups and add your favorite shapes or icons under single name. You can then choose these group from the sidebar options when inserting the blocks in editor.

You can use the Safe SVG plugin to upload SVG images to the library and GenerateBlocks Pro will grab the HTML content from the uploaded .svg file and create an asset for you. Remember, modifying the shapes in asset library will change that shape throughout your site. However, modifying the icons in asset library will not change the same icons already used on your site.

Support and Documentation

Each block has a link to the GenerateBlocks Pro documentation section. The documentation is a knowledge base which can help you to understand how the plugin works.

In addition, you can raise your query in their forum or post a support ticket by logging into your account.

Some Problems

Well, you can’t have everything perfect with a plugin designed keeping a specific way of use in mind.

• The biggest confusion you will find is the wording “Template Library” used on GenerateBlocks site. Users can easily think these are full page templates that you will get with any other page builder plugin. However, these are only Gutenberg template blocks as explained above. Though their demo section is clear, it will be appropriate to use something like “Block Templates Library” or something like that (Block Library term is already used in WordPress, so it needs to be something different).

• Same block names like heading, buttons may also confuse users as they are already part of core Gutenberg editor.
• You need two plugins (free and Pro) versions in order to use these blocks. In addition, you also need an additional plugin for uploading SVG assets. It ends up with minimum three plugins to completely use the features. This is the same problem with GeneratePress theme that you need to install multiple plugins that some users may not prefer.
• You can get the theme for $59 while the plugin costs $39 which is bit costlier in our opinion.
• The plugin may not work properly with other page builders and themes.

These are some minor glitches we have noticed. Probably they are not big deals when you like the functions of the plugin.

Summary

GenerateBlocks Pro is a complete CSS magic for Gutenberg block editor. The plugin will not affect the page loading speed and help to create beautiful layouts similar to any other page builder plugins. Give GenerateBlocks Pro a try and you will never turn back to any heavy page builders again. Below are some of pros and cons we found when using the plugin.