Recommended Plugins with Gutenberg Blocks

The new block editor in WordPress includes many core blocks, and you can add additional blocks through plugins. I’ve built quite a few Gutenberg websites, and these are the tools I recommend using.

For simple features like featuring a team member I like to build my own custom blocks. But for more advanced features, especially if my client will need the flexibility to customize it, I try to use high quality plugins.

I prefer plugins that focus on a single feature rather than “block library” plugins that include many different blocks. A focused product usually delivers a better solution. You also won’t pollute your block list with many blocks you never plan to use. If you do choose to install a block library, use one of these.

Many of the plugins I recommend include a premium / paid option. These have actual businesses behind the plugins, will be supported for a long time, and will continue to improve over time.

Here are my recommended plugins for forms, galleries, sliders, and block libraries. I plan to keep updating this article over time, so be sure to check back.

Forms

WPForms

WPForms is my favorite plugin for building any type of form. It’s incredibly easy to use, has plenty of addons, and can be extended through hooks and filters. I’ve used it on every site I’ve built for the past two years.

The free version is full-featured enough for most use cases, which is why it has over 1 million active installs. The paid versions include additional features and integrations with services like MailChimp, Aweber, Stripe, and Paypal.

Use their form builder to create your form (video demo), then embed it in a page using the WPForms block.

Jetpack Form

Jetpack is built by Automattic, the company behind WordPress.com. It includes a ton of features, so make sure you only enable those you actually need.

The Jetpack Form block lets you build your form directly in the Gutenberg block editor, which is unique among the form plugins.

Table of Contents

Guidepost is a single-block plugin that generates a live-updating table of contents for your content. As you add or edit headings on the page, they appear in the guidepost with anchor links. You can build a hierarchical structure by using different heading types (ex: h3 is under h2).

Galleries

Block Gallery

Block Gallery is a free gallery plugin built specifically for Gutenberg. It’s incredibly easy to use, allowing you to build and customize beautiful galleries directly in the Gutenberg block editor.

This plugin includes three different gallery blocks: Carousel, Masonry, and Stacked.

Envira Gallery

Envira Gallery is a premium WordPress gallery plugin. It’s Gutenberg integration is fairly basic currently, but it has the most extensive features and addons to implement almost anything you need.

For basic galleries, the free Envira Gallery Lite will work great. I built the demo below using the free version of the plugin.

First build your gallery in the Envira Gallery section of your WordPress site (video demo), then embed the gallery in your content using the Envira Gallery block. You can customize the gallery settings in the block panel on the right and see the gallery update live in Gutenberg.

Future versions of Envira Gallery will include even deeper Gutenberg integration. Soon you’ll likely be able to build the gallery directly in the Gutenberg editor rather than going to the separate gallery builder.

Sliders

Soliloquy

Soliloquy is premium slider plugin, produced by the same team as Envira. The free version, Soliloquy Lite, works great for most use cases. The premium version can be extended with many addons including image protection, slide scheduling, featured content, and more.

Go to the Soliloquy section of your backend to create a new slider (video demo). You can add images, then customize the settings for each image (title, alt text, caption, clickthrough URL…). You can also set the slider settings, like the image dimension, transition, and theme.

Embed the slider using the Soliloquy block. There is no visual preview of the slider, nor any customization options within Gutenberg.

• 

• 

My only complaint is it doesn’t currently support the block alignment options, so you can’t make a full-width slider block without CSS customizations. Here’s the code I used to make the Soliloquy block match my full width block styling, and override the max-width and max-height attributes Soliloquy adds.

I expect future updates to include deeper Gutenberg integrations, including full-width blocks and creating sliders from within Gutenberg itself.

Block Libraries

Atomic Blocks

Atomic Blocks is a free collection of page-building blocks. It was built by Array Themes to compliment their Gutenberg-focused theme  and includes blocks for post listings, testimonials, CTAs, and more.

Both Array Themes and StudioPress (creators of the Genesis theme framework) were recently acquired by WPEngine, which makes me even more interested in building with Atomic Blocks. I expect to see deeper integrations with Genesis, the theme framework I use on most sites.

Jetpack

As mentioned above in the Forms section, Jetpack is Automattic’s tool to share functionality they build for WordPress.com with the rest of the WordPress ecosystem.

Automattic was instrumental in getting Gutenberg built and merged into WordPress core, and I expect to see many high quality blocks released by them through Jetpack.

Jetpack currently includes blocks for markdown, forms, maps, and payment processing through PayPal. Here’s more information on Jetpack’s blocks.