This article is a part of series of articles about Gutenberg development for WordPress developers.
Back in the day when Custom Post types had just been merged in core, in WordPress 3.0, I used to think about how innovative the WordPress 5.0 release would be. Not long ago, I started calling it the Next WordPress.
Well, fast-forward to 2018 and we have an expected date of release for WordPress 5.0. In the State of The Word, 2017, Matt Mullenweg announced the focus of next year’s WordPress development, the Gutenberg project.
Gutenberg is the new and exciting project set to join WordPress Core that is going to help people write content, build websites, and design them in a better way. In this series, I’ll walk you through an introduction to developing blocks for Gutenberg.
At the time of writing, Gutenberg exists in two forms:
- Gutenberg GitHub Repo — A place for developers to develop, report issues, create pull requests, and even improve the documentation.
- Gutenberg WordPress Plugin — A Gutenberg WordPress plugin for you to start using or testing the project.
Gutenberg is supposed to be merged with the WordPress core in the WordPress 5.0, approx. April 2018. The old or as they call it the Classic Editor will exist in form of a separate plugin.
Gutenberg Changes Everything
As soon as the Gutenberg project gets merged with the core a lot of things in the WordPress community will start changing. And in a matter of a one to two years, these changes might build the roadmap to a completely different set of WordPress themes, plugins, interaction, site building, — hence changing everything.
Impact on WordPress Themes
Biggest changes will happen for the WordPress theme industry. Current WordPress theme developers can expect breaking changes for the entire code-base. Yes, that’s true and rightly so. WordPress themes have become way too large, bulky, and filled with fluffy-bloat code. That’s not helping the WordPress eco-system at all.
With Gutenberg, though, a WordPress theme would just be what a theme should be. That is a stylesheet that will style all the core Gutenberg blocks. Some theme devs might choose to remove a few native blocks. And yes, almost everyone will add custom blocks, via theme’s companion plugins.
If you’re a WordPress theme dev/company. Start thinking Gutenberg.
Impact on WordPress Plugins
WordPress plugins that have to do with the front end of WordPress sites will use the Gutenberg Block API to register custom blocks. These blocks will be used by the site owners to create custom layouts.
Imagine you run an eCommerce store with WordPress and you use everyone’s favorite WooCommerce plugin. You’ve announced a sale for holidays and there are a few special store items that you’d like to collect and post in your blog post.
Right now, all you can do is add links to your WooCommerce page listing to redirect users to that page from where they can buy these products. You’re restricted, your hands are tied — you’re not a developer and customizing layouts for your site is not something you can do yourself.
With Gutenberg you’ll be able to add a WooCommerce Product block right inside your blog post, where you’d choose a specific product on sale, and that users will be able to interact with that block right there on the blog post. By interact I mean, view the pics, description and add it to cart.
That’s what Gutenberg blocks will offer. Don’t believe me? Take a look at Woo’s blog and you’ll be happy to read about how they are preparing WooCommerce for the arrival of Gutenberg.
If you develop WordPress plugins, have you started integrating your code with Gutenberg?
Impact on the WordPress Community
The WordPress community will change for good. I mean it. This Next WordPress thing I keep writing about is going to help us take on the next 20% share of all the internet sites. For example:
- Better WordPress Themes: I believe that Gutenberg Themes will be far superior as compared to what we have right now. The new themes will have a lot better User Experience for both — the site owner writing/building content and for the users browsing/reading your sites, which will be optimized through a standard way/code.
- Improved WordPress Plugins: WordPress plugins will be better just because of the single fact that Gutenberg will provide them with an API to explore content and site-building features.
- The WordPress Page Building Standard: Everyone in the community has a love/hate relationship with WordPress page builders. Page builders are a necessary evil. People need them to build and control sites without code. But there’s no standard way of building a site. Gutenberg will create a standard way of building a WordPress site. Both plugin and theme developers will be able to use this API to enhance the default WordPress Page Builder i.e. Gutenberg.
Learning Gutenberg Development
If that has piqued your interest then hang on and wait for the next few articles to get published here. You’ll learn by doing, we’ll code a few blocks for WordPress Gutenberg. I have already created a Gutenberg Boilerplate (star the repo) that we’ll be exploring and extending in this series.
By the end of this series, you’ll be able to write basic blocks for Gutenberg, create these blocks via ES6 or ESNext, use a Webpack for building your code and create custom editable templates for Gutenberg that will help you develop better themes and plugins using Gutenberg’s APIs.
While Gutenberg is disruptive, the disruption will eventually be for a good reason. WordPress does really need a standard way of extending the themes and plugins.
Every other page builder has tried to solve the problem which Gutenberg might eventually end up solving. And being the standard way of building a page for WordPress, it will have the best possible integration with many other WordPress plugins — that current page builders lack.
As usual, don’t hesitate to leave any questions or comments below, and I’ll aim to respond to each of them.