Gutenberg is not only a block-based editor to create blog posts, but you can use Gutenberg as a page designer for your WordPress site. But, Gutenberg has a limitation on customization, and it can be a deal-breaker for us to use Gutenberg as a page designer. Here are the main weaknesses of Gutenberg as below:
- Lack of setting options for blocks (especially for typography and spacing)
- There is no responsive editing. By default, Gutenberg can’t optimize responsive viewing on tablets and smartphones.
- Unable to set the page layout.
Given the lack of elements and features, you need to install plugins to get more blocks. One of the plugins that we recommend to you is Kadence Blocks.
A Brief Intro About Kadence Blocks
Kadence Block is one of the most popular Gutenberg block plugins for WordPress, with over 200,000 users, and it has a good rating (5/5) in the WordPress directory.
With Kadence Blocks, you can add more creative elements to your Gutenberg-powered page using the block collections it offers. Kadence Blocks also comes with a feature to add dynamic content to Gutenberg and responsive editing capability.
What’s Offered by Kadence Blocks?
Kadence Blocks offers additional blocks to expand the default Gutenberg blocks library and more features, which means it will improve Gutenberg’s editing capabilities. So, you can create an excellent web page with ease – no need to write a single line of code. With Kadence Blocks, you can make the WordPress block editor (Gutenberg) capable of creating excellent content that is usually only possible if you use a page builder plugin.
Kadence Blocks Key Features of Setting Options
1. Gutenberg Blocks
After installing and activating Kadence Blocks, by default (free version), you will get 16 blocks that you can use to design your web page in Gutenberg. The sixteen blocks are below:
- Row Layout
- You can create rows with nested blocks either in columns or as a container. It will give style to your rows with background, overlay, padding, etc.
- Form
- You can create a contact form or marketing form and style it within the block editor.
- Advanced Gallery
- Photo galleries, carousels, and sliders! You can enable custom links, captions, and more. Plus, you can select image sizes.
- Advanced Button
- You can create an advanced button or a row of buttons. Style each one, including hover controls, plus you can use an icon and display them side by side.
- Lottie Animations
- A Lottie is a JSON-based animation file format. You can add an extra “wow” factor to your site with engaging Lottie animations.
- Icon
- You can select from over 1500+ SVG Icons to add to your page and style the size, colors, background, border, etc.
- Spacer/ Divider
- You can easily create a divider and determine the space around it or create some space in your content.
- Advanced Text
- You can create a heading or paragraph and define desktop, tablet, and mobile sizes, font family, colors, etc.
- Tabs
- It enables you to create custom vertical or horizontal tabs with advanced styling controls. Each tab content is an empty canvas able to contain any other blocks.
- Info Box
- You can create a box containing an icon or image and, optionally, a title, description, and learn more text. Style static and hover separately.
- Accordion
- Now you can create beautiful accordions! Each pane can contain any other block and customize title styles, content background, and borders.
- Icon List
- You can easily add beautiful icons to your lists and make them more engaging—over 1500 icons to choose from and unlimited styles.
- Table of Contents
- Allow your readers to navigate your content easily with a table of contents block. Includes smooth scroll to anchor.
- Posts
- Display a clean grid of posts anywhere on your site, great for your home page where you want to tease your blog.
- Countdown
- This block will help you increase your conversions by adding a sense of urgency to your offering.
- Testimonials
- With this block, you can create confidence in your brand or product by showing off beautiful, unique testimonials, add as a carousel or a grid.
2. Pre-made Templates
With pre-made templates provided by Kadence Blocks, you don’t need to build your page from scratch. It allows you to seamlessly when you’re creating a page or post layouts by selecting from any pre-made templates. So, it’s like a jump start on your blank canvas.
Accessing pre-made templates is very easy. First of all, make sure that you have already installed Kadence Blocks. Go to the Gutenberg, and you will see the Design Library button. Click it then you will find plenty of pre-made templates that you can pick.
3. Typography Controls
Kadence Blocks give you more setting options for typography. There are many options that you can set which is you can’t do only with default Gutenberg blocks, as below:
- Line Height
- Letter Spacing
- Text Transform
- Font Family
- Font Weight
You can access those options on the Block settings of Kadence Blocks.
4. Responsive Editing
Responsive editing is a feature that you can use to customize your website interface so that visitors look at it on the desktop, tablet, or smartphone. This feature can make your website look great on any device. Sometimes people call Mobile Optimization or Responsive Control. Why is this feature essential to us? Because as you know, today most people access the internet from mobile devices. So, optimizing for responsive viewing on mobile devices is a must.
Same as typography controls, you can access responsive editing on the Block settings of Kadence Blocks
5. Spacing Controls
Kadence Blocks give you more flexibility to control spacing of an element when designing a page. What’s even more impressive is that it turns out that you can also control the spacing on the responsive editing. Meaning that you can use a different spacing for each device type (desktop, tablet, smartphone).
6. Visibility Controls
This feature helps you to hide block settings from specific user roles so they can focus on content, and you can keep them out of the block designs. As a role-based setting that the admin has access to, it can be helpful for websites with multiple authors or when you’re handing the site off to the clients and you don’t want them to change the design.
So, it’s based on the user role in WordPress, whether they’re an admin, editor, author, or contributor or available for non-users. Visibility control options are only available on Row Layout and Section blocks.
Kadence Blocks Free vs. Kadence Blocks Pro
We all know that the pro version is better than the free version in every product or service. Compared to Kadence Blocks, the pro version provides more features and blocks. You can check all the comparisons below:
| Custom Features | Free | Pro |
|---|---|---|
| Design Library | Yes | Yes |
| Intelligent Load | Yes | Yes |
| Responsive Controls | Yes | Yes |
| Layout Controls | Yes | Yes |
| Typography Controls | Yes | Yes |
| 1500+ SVG Icons | Yes | Yes |
| Color and Background Controls | Yes | Yes |
| Configurable Default | Yes | Yes |
| Setting Visibility Controls | Yes | Yes |
| Spacing Controls | Yes | Yes |
| Animation Scroll | No | Yes |
| Custom Icons | No | Yes |
| Dynamic Content | No | Yes |
| Custom Fonts | No | Yes |
| Pro Design Library Items | No | Yes |
| Page-Specific CSS and JS | No | Yes |
| Custom Blocks | Free | Pro |
|---|---|---|
| Row Layout | Yes | Yes |
| Advanced Heading | Yes | Yes |
| Advanced Gallery | Yes | Yes |
| Tabs | Yes | Yes |
| Accordions | Yes | Yes |
| Countdown | Yes | Yes |
| Table of Contents | Yes | Yes |
| Testimonials | Yes | Yes |
| Info Box | Yes | Yes |
| Post | Yes | Yes |
| Icon List | Yes | Yes |
| Icons | Yes | Yes |
| Form | Yes | Yes |
| Advanced Button | Yes | Yes |
| Spacing/ Divider | Yes | Yes |
| Post Grid/ Carousel | No | Yes |
| Product Carousel | No | Yes |
| Portofolio Grid/ Carousel | No | Yes |
| Image Overlay | No | Yes |
| Modal | No | Yes |
| Split Content | No | Yes |
| Video Popup | No | Yes |
| User Info | No | Yes |
| Advanced Slider | No | Yes |
| Pro Gallery Addons | No | Yes |
| Pro Countdown Addons | No | Yes |
| ProForm Addons | No | Yes |
As you can see above, the difference between the free and pro versions is not too significant. But, there is one thing that you need to concern about; that is optimization. Some features are available on the free and pro versions, but you can do more customization and optimize the functionality, such as Form block. When you’re on the free version, you only have three options on the Actions After Submit option. But when you upgrade to Kadence Blocks Pro, you will get more options. Such as Auto Respond Email, Database Entry, SendInBlue, and MailChimp.
The Bottom Line
Whether we like it or not, people judge Gutenberg based on their experience using some page builders such as Elementor, Divi Builder, Brizy, and other page builders. They have flexible editing experience with many layouts and design choices and with a module or widgets for everything. To take Gutenberg to the next level, Kadence Blocks is the answer.
