If you really enjoy creating pages on your WordPress site using Gutenberg, then Essential Blocks PRO is the plugin you should try. The plugin will enrich your editing experience with Gutenberg thanks to the features it offers.
As you have known, Gutenberg is really lack of features when it comes to page editing. Unless you install a third-party plugin, you can’t even set the spacing (margin and padding) of an element on your page. Also, there is no responsive editing feature available. Whereas it is essential in the modern page editing. Responsive editing feature allows you to adopt a mobile-first approach when editing a page.
With that said, relying on the built-in Gutenberg features may is not the best option, especially if you are an agency or freelancers. Your aspiring clients will not love it if the website design you propose is too basic.
Essential Blocks PRO: A Brief Intro
Essential Blocks PRO is a WordPress plugin developed by WPDeveloper, the same developer company behind Essential Addons. The plugin is built specifically for Gutenberg a.k.a. block editor — the default editor of WordPress. It fills all the gap that Gutenberg has when it comes to page editing, including responsive editing which becomes the main issue with Gutenberg. Also, it offers more design options such as the ability to add spacing, to set font family on text elements, and to set entrance animation.
You can also add more elements (blocks) to the page you are currently editing thanks to the blocks set that Essential Blocks PRO offers. Essential Blocks PRO itself requires Essential Blocks Free to work. In other words, Essential Blocks PRO is technically an add-on of Essential Blocks Free.
Essential Blocks PRO Features
— Blocks Set
Just like other Gutenberg-specific WordPress plugins, Essential Blocks PRO also offers a set of new Gutenberg blocks which you can add to your page. With these blocks, you can add more creative elements such as image compare, animated text, to form. As a result, you can create a more attractive page with Gutenberg.
One of the main blocks that Essential Blocks PRO offers is the Row block. The block is aimed at arranging the design layout of your page before you can add the actual design elements. It plays a role as a container on your design. When adding a new Row block, you can set the column structure as shown below:
If you have ever used Elementor before, the Row block of Essential Blocks PRO is pretty similar to Elementor’s section. The width of the Row block is adjustable via the settings panel. Also, you can apply other settings such as margin, padding, to entrance animation.
The are 51 more blocks offered by Essential Blocks PRO other than the Row block. They are divided into 7 categories as follows:
# Content Blocks
Accordion | Feature List | Slider |
Advanced Heading | Flipbox | Team Member |
Advanced Image | Infobox | Testimonial |
Advanced Tabs | Openverse | Testimonial Slider |
Advanced Video | Parallax Slider | Toggle Content |
Button | Row | Wrapper |
Dual Button | Shape Divider |
# Creative Blocks
Countdown | Number Counter |
Image Comparison | Popup |
Image Gallery | Progress Bar |
Interactive Promo | Stacked Cards |
Multicolumn Pricing Table | Typing Text |
Notice |
# Dynamic Blocks
Advanced Navigation | NFT Gallery |
Advanced Search | Post Carousel |
Data Table | Post Grid |
Fancy Chart | Table of Contents |
Google Maps | Timeline Slider |
News Ticker |
# Form Blocks
Fluent Forms | Form | WPForms |
# Marketing Blocks
Call To Action | Pricing Table |
# Social Blocks
Instagram Feed | Social Icons | Social Share |
# WooCommerce Blocks
Woo Product Carousel | Woo Product Grid |
To keep your block inserter panel uncluttered, you can disable the blocks you don’t need. To do so, you can go to the settings screen of Essential Blocks PRO on your WordPress dashboard.
— More Design Controls, Including Responsive Editing
Gutenberg has a dedicated section on the block settings panel aimed at applying style settings. But again, the available options are extremely limited, even for basic settings such as margin and padding. For instance, the Image block only has setting options like width, height, and aspect ratio. There are no options to set custom border, shadow, and other decorative options.
Essential Blocks PRO, on the other hand, offers nearly all styling options you can expect to be added to an image. Including all the mentioned settings above.
For blocks that contain text element, you also have more typography controls compared to the native Gutenberg blocks. Some of which, you can set font family, font size, font weight, letter spacing, line high, and so on.
Essential Blocks PRO itself is integrated with Google Fonts to offer you 1,400+ fonts to choose from. If you prefer using local fonts, you can disable the integration from the settings screen.
# Responsive Editing
Responsive editing is the feature that Gutenberg doesn’t have by default. You can get it from Essential Blocks PRO. With this feature, you can create a responsive page with Gutenberg. You can even apply the mobile-first methodology in case you want to create a page that specifically targets smartphone users.
On every block that Essential Blocks PRO offers, you will find the following settings:
1. Show/hide a block on a specific device (desktop, tablet, mobile/smartphone)
With the above setting options, you can show or hide a block — including the Row block and all blocks inside it — on specific device type. If you think a block doesn’t need to be shown on mobile devices, you can simply hide it.
2. Set different setting values on a specific device
A certain setting that looks great on desktop may looks cluttered on mobile. It often happens on font size and spacing (margin and padding). To address the issue, Essential Blocks PRO allows you to set different setting values on each device. For instance, you can set a font size to 42px on desktop and set it to 28px on mobile. If you know CSS, you can also use the EM and percent (%) units instead of pixel (px).
— Custom CSS
You can actually add custom CSS to a certain block in Gutenberg without needing to install a plugin. But the process is quite complex, especially if you use a block theme. With Essential Blocks PRO, you can add custom CSS to certain block directly via the settings panel. No need to back and forth between theme customizer and Gutenberg. The CSS editor even supports auto-complete feature.
— Form Builder (with a Submission Manager)
There are three blocks on the Form Blocks category on the above table as below:
- Fluent Forms
- WPForms
- Form
The Fluent Forms is a block dedicated to syling up the forms you created with the Fluent Forms plugin, while the WPForms block is dedicated to styling up the forms you created with the WPForms plugin. You can only use these blocks if you have both the Fluent Forms and WPForms plugins installed on your WordPress website.
The Form block, meanwhile, is a block that you can use to create a block directly on Gutenberg. It has no dependency with other plugins like the other blocks on the Forms Blocks category. You can use the Form block to create three form types: contact form, email opt-in form, and RSVP form.
You will be asked which form type you want to create every time you insert the Form block to Gutenberg.
The form can then be styled via the settings panel. There are plenty of styling options you can set. From typography of form labels, form fields width, colors, and so on. The Form block also allows you to set and customize confirmasion message, validation message, and error message.
Essential Blocks PRO offers a built-in submission manager which you can use to manage the form submissions. You can even export the submissions into a CSV file in case you want to further process the data.
The Form block also supports integration with a third-party email marketing tool. Unfortunately, the only email marketing tool it supports is Mailchimp. No support for other email marketing tools yet like MailerLite, GetResponse, or even ConverKit.
To protect your form from spammy submissions, the Form block support integration with Google reCAPTCHA, both version 2 and 3. If you prefer building a form from scratch, the Form block supports the following field types you can add to your form:
- Text Field
- Text Area
- Number
- Select
- Checkbox
- Radio
- Date Picker
— Table Builder
Another notable block offered by Essential Blocks PRO is Data Table. As the name suggests, the block is aimed at helping you create a table on Gutenberg.
Although Gutenberg already has a built-in block to create a table, the Data Table block offered by Essential Blocks PRO allows you to create a more advanced table. The block itself is suited to create a table that displays data consisting of plenty of entries. It is not suitable to create a comparison table.
You can insert the data entries manually or pull it from Google Sheets. Or you can also import data from a CSV file.
Two useful features you can add if the data you want to display consists of plenty of entries are pagination and search.
Since the table is aimed specifically at displaying data, you can only add text element to the table. There are no options to insert an icon to the table cell or other elements like image.
— Popup Builder
Want to add a popup on your website? No need to install a dedicated popup builder plugin if you have Essential Blocks PRO installed on your website. It comes with a block dedicated to creating a popup right from Gutenberg. The block is called Popup. After adding the Popup block to Gutenberg, you will have a new block dedicated to creating the popup. You can then add other blocks to this dedicated block — which technically a wrapper.
The Popup block itself is only visible on the backend (Gutenberg editor). It will not be displayed on the frontend until it fulfills the trigger you set. There are four trigger types you can set to call the Popup block as follows:
- Button click
- Page load
- Exit intent
- Element click (using CSS class)
You can set the position (on the screen) where the popup to show up. Whether in the center area, top-right, top-left, bottom-right, or bottom-left. You can also set the size of the Popup block to make it looks more proportional with the screen. You can use the responsive editing feature to create different popup sizes for different device types.
There are many other settings you can apply to your popup. Such as the close icon size, background color, entrance animation, and so on.
— Dynamic Content
If you often use the Site Editor feature of WordPress to edit site parts like header, footer, and templates, then you will love the fact that Essential Blocks PRO also comes with dynamic content feature. The feature allows you to pull dynamic content to blocks that contain text. Such as Advanced Heading, Advanced Button, Call To Action, and so on.
To populate a text content with dynamic content, you can simply click the dynamic icon which you can find on each text field on blocks offered by Essential Blocks Pro.
In addition to dynamic text, the dynamic content of Essential Blocks PRO also supports dynamic link. Here are the dynamic content types supported by Essential Blocks PRO:
Text:
- Site Title
- Site Tagline
- Post Title
- Post ID
- Post Slug
- Post Excerpt
- Post Date
- Post Modified
- Post Type
- Post Status
- Author Name
- Author ID
- Author Profile Picture
- Author Post Counts
- Author First Name
- Author Last Name
- Comment Number
Link:
- Site URL
- Post URL
- Author Post URL
— Icons Set
There is no built-in option offered by Gutenberg to add an icon. Two approaches you can choose to add an icon to a Gutenberg-powered page is by using a plugin or manually.
Essential Blocks PRo comes with a dedicated block — the Icon Picker block — that you can use to add an icon to your page. In addition, you can also add an icon to a button and form submit button. The best part, there are about 900 icons you can choose from. No need set an integration with an icon provider like Font Awesome and Bootstrap Icons.
Common icons like social media icons, arrow icons, shape icons are available on the icons set offered by Essential Blocks PRO.
— Ready-Made Gutenberg Templates
Essential Blocks PRO is a WordPress product from WPDeveloper. The company itself also owns Templately, a cloud-based service that provides ready-made Elementor templates and Gutenberg templates. When editing a page using Gutenberg for the first since you installed the Essential Blocks PRO plugin, you will see a Pattern Library button above the Gutenberg editor. Clicking this button will install the Templately plugin.
With the Templately plugin installed, you can load the Gutenberg templates from the cloud by simply clicking the button above the Gutenberg editor. The templates library window will appear after you click the button. You can filter the templates by type (page and block) and categories.
Ready-made templates allow you to create a website more quickly rather than start everything from scratch. In total, there are over 1,400 ready-made templates available on the Templately templates library.
Theme Compatibility
Essential Blocks PRO is not designed specifically for a specific theme. Meaning that you can use it regardless of the theme you use (unless you use the Classic Editor). We have tested Essential Blocks PRO on the following themes and everyting worked fine.
- Twenty Twenty-Four
- GeneratePress
- Kadence
Essential Blocks PRO Pricing
Essential Blocks PRO is available for everyone, not just agencies like some WordPress plugins. If you are a blogger who owns only a single blog, you can use the Starter plan, which can be activated on one website. The plan costs you $39 per year. If you hate subscription-based payment, there is also a one-time purchase option available.
In addition to the Starter plan, there two other plans offered by Essential Blocks PRO. Here are the plans available to get Essential Blocks PRO. Every Essential Blocks PRO plan is bundled with the Templately access.
Starter | Innovator | Visionary | |
---|---|---|---|
Price | $39/year ($99 for lifetime membership) | $129/year ($199 for lifetime membership) | $299/year ($399 for lifetime membership) |
Number of activations | 1 | 5 | 100 |
Templately access | 1 month (6 months for lifime membership) | 3 months (6 months for lifime membership) | 6 months |
To minimize the risk, Essential Blocks PRO offers a 14-day money guarantee, which is crucial since it offers no free trial.
The Verdict — Essential Blocks PRO Review
Despite the existence of page builders like Elementor and Divi Builder which offer a better page editing experience, some users prefer using Gutenberg for one main reason: it is the default WordPress editor and fully supported by the core developer team. However, merely relying on the built-in Gutenberg blocks and features can limit your creativity due to the limitations it has.
Essential Blocks PRO is a great plugin to unleash your creativity when editing a page with Gutenberg.
First, it offers more design options. You can set things like spacing, responsive setting units, entrance animation, and so on. Second, it offers extra blocks to allow you to add creative elements like flipbox, progress bar, adanced gallery, and so on. Third, features like popup builder and form builder are useful to create landing pages. Forth, its dynamic content support allows you to achive more if you plan to use Site Editor on your WordPress projects.
There are some minors, though. You can only integrate the Form block with Mailchimp. It would be great if you can also integrate the Form block with other email marketing tool, including MailPoet so that you can fully integrate your email marketing tool with your website. Also, the animation feature is still limited to entrance animation. No other animation options like exit animation and on-scroll animation. Also, there is no option to upload an SVG incon.
But overall, Essential Blocks PRO is a great plugin to enrich your page editing experience with Gutenberg.