Advertisement
  1. Code
  2. Learning Guides
Code

An Introduction to WordPress Gutenberg

Gutenberg is a brand-new editing interface for WordPress. Gutenberg is a major change coming to WordPress 5 this year, and it will affect WordPress plugin developers, theme designers, and website creators.

This learning guide is our starting point for learning what Gutenberg is, and what it means for you as a WordPress developer or user.

What Is Gutenberg?

Gutenberg is a completely new way for people to create content for their WordPress sites. The classic editor hasn't changed much since WordPress was created back in 2003, and while that's fine for creating text-heavy blog posts, it's not ideal for today's media-rich websites with more complex layouts.

Gutenberg is a completely new way for people to create content for their WordPress sites. The classic editor hasn't changed much since WordPress was created back in 2003, and while that's fine for creating text-heavy blog posts, it's not ideal for today's media-rich websites with more complex layouts.

So the new Gutenberg editor will let you create "blocks" of text, images, video and so on, which you can move around easily in your posts or pages to create the layout you want. It will also support things like dividing text into columns, creating fancy titles, adding full-width pull quotes, and more. 

The end result should be a simpler and more intuitive user experience. Instead of installing third-party plugins and fiddling around with shortcodes, WordPress users will be able to create a much wider array of layouts just by clicking a few buttons in the main editor.

Watch our quick video tutorial for a walk-through of creating and editing posts and pages with Gutenberg.

Pros & Cons of Gutenberg

Like all major changes, Gutenberg has its pros and cons. Although it's still early in the development cycle, the early signs are that the change will be mostly positive. Here are some of the benefits of Gutenberg:

  • The process of creating and editing posts and pages will be more intuitive for new users.
  • You'll be able to create a range of layouts and effects that were tricky to achieve before.
  • The new editing interface is less cluttered, making it easier to focus on creating content.
  • It offers opportunities for developers to create custom blocks, enhancing what they'll be able to do with themes and plugins.

But, of course, there are also some downsides to Gutenberg:

  • Although it should be easier to use in the end, Gutenberg is a major change and will probably slow people down initially as they get used to the new interface.
  • It will require some work for WordPress developers to get their themes and plugins ready for Gutenberg (see below).
  • As with all major changes, there will probably be a few bugs and teething problems, and some users will be frustrated if their favourite theme or plugin isn't ready for the change.

What Gutenberg Means for WordPress Developers

If you develop WordPress themes or plugins, the clock is ticking. Gutenberg will be part of WordPress core from version 5.0 onwards, and it won't be optional. Although there is a free plugin to let people use the classic editor, there'll be no option to simply turn off Gutenberg, so the vast majority of users will be using it in version 5.0, which is due some time this year.

The bottom line: if your themes and plugins aren't compatible with Gutenberg, you'll cause big headaches for your users and will probably lose a good portion of them.

The good news is that, although Gutenberg is a major change in terms of the user experience, it's been designed to minimise the disruption for developers and users. Many themes and plugins will work just fine with Gutenberg, without the need for changes. 

However, there are some features that will cause problems, so you'll need to test thoroughly to ensure you're ready. Read the following tutorial to find out how to get your plugins Gutenberg-ready.

Developers should also view Gutenberg as a great opportunity to allow users to do more with their themes and plugins. You can install the Gutenberg plugin on a testing site, explore what it does, and think about how you can not just make your themes and plugins compatible, but also take advantage of the new features to offer more. 

For example, developers can create their own custom blocks, so you could use them to offer your users some great new features. Here are some simple examples of what a Gutenberg-compatible theme could do. If you want to learn more about coding blocks for WordPress Gutenberg, check out our series of tutorials on the Gutenberg Block API.

We've got lots more Gutenberg tutorials and courses on the way, so keep checking this page, or sign up to our weekly newsletter for updates. You should also keep an eye on the WordPress Roadmap and the WordPress 5.0 developer page for the latest updates on when the new version will be available.

Learn WordPress

If you're just getting started, learn how to use WordPress in our complete guide which takes you through the full process, from the basics of creating posts and pages right through to installing and customising your first WordPress theme and setting up plugins for security and performance.

Do you want to learn WordPress development from start to finish? Check out our learning guide: Learn WordPress Development.

Weekly email summary
Subscribe below and we’ll send you a weekly email summary of all new Code tutorials. Never miss out on learning about the next big thing.
Advertisement