Drupal Gutenberg 1.0 Released, Now Ready for Production Sites

The Gutenberg module for Drupal, created by Frontkom, reached the 1.0 milestone earlier this month. It is the first stable release recommended for use in production with Drupal 8.x.

The 1.0 release removes the Gutenberg-JS dependency and uses Gutenberg core files directly. It is based on Gutenberg version 5.6.1, which was released in early May. The module boasts better handling for media files, adding support for title, caption, and alternative text. It also adds an “Allowed Blocks UI” to the content type admin UI, so administrators can restrict which blocks show up in the block selector.

“We’re now ready for production sites in the sense that we’ll be more careful with structure changes, will try to do update paths when possible, and will create automated tests for crucial functionality,” Frontkom project manager Thor Andre Gretland said. “We’ve solved the blockers for a stable release.”

Upgrading the module from RC-1 may require some extra steps, because it is a big jump, taking the Gutenberg library from 4.8.0 to 5.6.1. Users will need to update the database. It is also necessary to navigate to content types and click save to enable Gutenberg again so that it will begin storing the Allowed blocks in the database. If users get notices about invalid blocks, they are advised to try the Attempt Block Recovery option:

“It’s actually a rather large update,” Gretland said. “We were planning to add a couple of last needed features to release our 1.0 version, but ended up using the latest Gutenberg version with several new great features. We’re also using more of the Gutenberg Core, that we’ve been able to use before.”

The module still has one critical issue that Frontkom is working on. Reusable blocks are not working with the latest release. Users are getting a “this block is unavailable or deleted” message when attempting to insert a reusable block. In the meantime, those who require this feature can roll back to RC1 to get it working again.

So far the Gutenberg module has been well-received. It has been downloaded more than 12,000 times and 494 sites are reported to be using it.

Drupal’s Gutenberg module includes access to the Gutenberg Cloud library of free blocks. Although the library has been slow to gain contributors, it does contain several blocks that are helpful for creating page layouts, such as Content in Columns, Hero Section, Section Wrapper, Section Row, and a Feature Box block. Site administrators can also use the Gutenberg module in combination with Drupal’s new Layout Builder, which was introduced as a stable module to Drupal 8.7 core.

“We see a valid use case for mixing Drupal Gutenberg with the Drupal layout builder when you might want to create layout templates with the layout builder, and keep the actual content editing in Gutenberg,” Gretland said. “For example you could use the layout builder to define fixed byline elements for author and create date, but leave the actual content creation experience to Gutenberg.”

WebWash has a good video tutorial for Drupal users who want to learn how to configure the Gutenberg module and use it on the Page content type. It includes a walkthrough for common actions like uploading images, creating reusable blocks, and using the Gutenberg Cloud. If you want to see how Gutenberg can improve Drupal’s authoring experience without installing the module, check out the frontend demo of Drupal Gutenberg created by the team at Frontkom.

Laraberg, a Gutenberg Implementation for Laravel, is Now in Beta

The family of Gutenberg derivatives is expanding with the beta release of Laraberg, an implementation for Laravel. Maurice Wijnia, a developer at Van Ons, an agency based in Amsterdam, created Laraberg as an easy way for developers building applications with Laravel to integrate the Gutenberg editor. It includes a simple API and support for the Laravel File Manager for uploading files.

“The goal for Laraberg is to give developers the ability to add the Gutenberg editor to any page they like in a way that is as easy as possible, but at the same time it has to prove enough options to tailor the editor so it can fit into any Laravel project out there,” Wijnia said.

Van Ons has a preference for using Laravel in their projects, due to its increasing popularity and active community. Laraberg makes it possible for the agency to tap into the convenience of the Gutenberg editor without giving up the performance and features they enjoy in the Laravel framework. The beta release is now available on GitHub and Pacagist. Van Ons plans to actively implement Laraberg in their own projects and will also be collecting feedback from beta testers.

Wijnia said he was inspired by the Drupal Gutenberg project, whose creators also authored Gutenberg.js, a package that makes it easier to bring Gutenberg into other applications. Providing a foundation for using Gutenberg on any CMS or framework is part of Frontkom’s long term vision for improving the open web and enabling communities to collaborate on mutually beneficial extensions.

As the editor continues to expand to more platforms and frameworks, a CMS-agnostic block library would offer a central place for Gutenberg’s increasingly diverse user base to discover new blocks. WordPress.org has the opportunity to provide that in its own block library, with the support of the Gutenberg Cloud team that pioneered the idea in 2018.

“If Gutenberg Cloud can serve as a proof of concept that WP.org can later adopt as their own, we are happy,” Frontkom CTO Per Andre Rønsen said. He also further commented on the WordPress.org Block Library proposal, advocating for the team to grow their vision beyond the WordPress community only. No official decision has been announced yet. If WordPress decides to forgo the opportunity of providing a block library inclusive of other frameworks and platforms, then the Gutenberg Cloud will continue to be the place for discovering blocks that can be used across multiple platforms.

Gutenberg Cloud Team Advocates for Making WordPress.org’s New Block Directory a CMS-Agnostic Library

Frontkom‘s presentation at WordCamp Nordic introduced the audience to the Gutenberg Cloud project, which allows developers to share JS-only blocks across CMS platforms. Marco Fernandes and Thor Andre Gretland, representatives of the 45-person agency based in Europe, are also part of the Drupal Gutenberg project that brings WordPress’ open source editor to Drupal via an optional module. The module’s release candidate has been downloaded more than 9,000 times.

In the video below, I had the opportunity to sit down with the team at WordCamp Nordic to discuss the progress on their Gutenberg-related projects. Frontkom has clients using the Drupal module in production and their experience echoes a theme that seems common among those who are using the Gutenberg editor with clients.

“We see that especially people who don’t have too much experience in general working with visual content online, they find it easier to use than the ones that are into a routine where they expect some behavior,” Gretland said.

Drupal’s Gutenberg module could become a primary driver for the Gutenberg Cloud project, as access to the cloud blocks is included by default for all installations. The Cloud Blocks plugin for WordPress has been much less popular so far, with an estimated 100 active installations.

We discussed the potential of Drupal adopting Gutenberg as its core editor and the Frontkom team predicts that it will likely remain a separate module. Their vision for both Drupal Gutenberg and the Gutenberg Cloud is to make Gutenberg “the go-to solution for editing rich content on the web.” It is still achievable as a separate module but would have more impetus behind it if Drupal adopted it for its default editor.

Gretland said idea behind the Gutenberg Cloud was to provide “a sustainable ecosystem of blocks but also ease of use.” The project is a precursor to WordPress.org’s planned JS-only single block library. We discussed whether they perceive any competition between the two directories.

As the discussion on make.wordpress.org was just developing at the time of the interview, I contacted Frontkom CTO Per Andre Rønsen later on to get their thoughts on WordPress.org’s planned block directory. He had commented on the proposal, asking if this could become a library of truly CMS-agnostic blocks.

“I commented on the Make WP blog post right away, because I simply loved the idea of a directory of JS-only blocks,” Rønsen said. “We haven’t discussed it directly with Matt, but have had some good chats with the core Gutenberg team, and are planning to meet on a weekly basis. If Gutenberg Cloud can serve as a proof of concept that WP.org can later adopt as their own, we are happy. As the spec is very similar to what we already have created, porting between the two will be easy.”

Rønsen is advocating for a more open approach that isn’t so strictly tied to WordPress’ infrastructure.

“A more ideal approach however, would be to merge the two efforts,” Rønsen said. “The key for us, is to make the infrastructure open to other communities, not just WP developers. We are happy to put our project in the hands of the WP core team – given that they share the same open vision.”

A CMS-agnostic library for Gutenberg blocks is part of Frontkom’s long term vision for improving the open web. This is one of reasons the team created Gutenberg.js, which provides a foundation for using Gutenberg on any CMS or framework. Gretland said they see it as “more than just a new editor but a platform that enables communities to build new features.” This is the vision the team came to share at WordCamp Nordic. Check out the video below to hear more about how the Gutenberg Cloud team is working to make Gutenberg an editor that more open source communities on the web can share.