Category: Gutenberg Resources

Best curated resources for Gutenberg WordPress editor. Gutenberg tutorials, Gutenberg plugins, Gutenberg themes and more.

How to Create Interactive Scroll Effect to Columns in Gutenberg Editor

How about creating a scroll effect to your multi-column content? It's pretty easy and adds a nice visual attraction to your web page. So here is the sneak peek of what we are going to create in this quick tutorial. So let's learn how you can create this nice effect in Gutenberg. This is to work with multi-columns, so you may create any number of columns content as you like. And can have anything as… Read More »

How to Display Gutenberg Blocks in Other Page Builders (Elementor, Divi, etc)

Learn how to display any content or sections you have created in Gutenberg Editor into a Wordpress page builder like elementor, divi, beaver, etc. Why would you need to do that? Honestly, I am not sure. 😇I got this question via one of my plugins "ACF Blocks" support forum. So, I am creating this quick guide on how this can be achieved. Well, this is easily doable. We need to install a plugin which makes… Read More »

Best Gutenberg Black Friday Deals 2019

Black Friday 2019 is almost here. It is the best time to shop for your favorite stuff. And the best part is that it is no more only for the US as it has now become a global event. WordPress world also adapted it to offer amazing discounts and deals during these days. As we all know Gutenberg is the new editor for WordPress, and you may have seen a lot of great plugins and… Read More »

Gutenberg VS Page Builders – Performance Test

I am starting a series of tests comparing the WordPress editor Gutenberg with the Page Builders. The idea is to test Gutenberg in comparison to page builders which are dominating the WordPress world these days. I will try to be completely unbiased and fair as much possible. Whatever the result comes, my intention here is only to see the real difference of how Gutenberg is already better than the page builders. And to also see… Read More »

Built-in handling of big images in WordPress 5.3

So you got a WordPress website with a lot of images? And you always struggle to optimize them, resize theme for the web before manually uploading it to your website? Not anymore, as WordPress 5.3 is introducing a built-in mechanism to handle big images automatically for you. Check out the official post for more details on how it works. Read More »

Block Editor Theme-related updates in WordPress 5.3

A must read for Theme Developers. WordPress 5.3 includes a lot of additions and refactoring to existing blocks in order to support new features. Some of this features require special care from theme authors in order to optimize the Block Editor theme integration. Check out the details. Read More »

How to Add Button to the Rich Text Toolbar

Learn how to create a custom button to the Rich Text Editor used by Gutenberg. By default, it has alignments, bold, italic and link buttons. Learn how to add a text highlighter button (and similarly any other option) to the rich text toolbar. Read More »

How to apply a gradient background in Gutenberg

You can easily apply a gradient background to any Gutenberg block via custom CSS. I have already explain how to add custom CSS to any Gutenberg block in a previous tutorial. Go through that tutorial as it explains it well, and you will need to know that to follow this one. Free Online CSS Gradient Code Generator Now you must be thinking that you must know CSS to create a gradient color, but worry not.… Read More »

How to apply custom CSS to any Gutenberg Block

What if you need to apply some custom styling using CSS to your content in Gutenberg editor. There are a few ways you can apply custom CSS to any Gutenberg block. Let's find out how to do it. 1. Via WordPress Customizer You can simply put your custom CSS into the Additional CSS section via WordPress Customizer targeting specific CSS class applied to the Gutenberg block. But, there is a downside to this approach. Your… Read More »