Gutenberg is the future of WordPress. It brings the promise of new functionality, enabling developers and designers to create reusable modules (“blocks”) for design and content, while empowering end-users to combine and customize those modules to do everything from launching twenty simple landing pages in an hour to building a complex new digital experience.
There are also valid concerns with the project, on subjects such as launch timeline and backwards-compatibility. A healthy path forward means addressing concerns while embracing the new benefits.
There are some key questions we want to help you answer such as…
- How will Genesis support the transition to Gutenberg?
- How will this result in new, wonderful features for the designers, developers, and end users of Gutenberg-enabled WordPress sites?
- How will Genesis make it easier and more efficient to create new Gutenberg-powered themes?
- How will Genesis help you lead with Gutenberg?
We’re going to be posting heavily in the coming months on studiopress.blog to help address these questions and to share the work the newly expanded Genesis engineering team is doing to help you lead with Gutenberg.
The Gutenberg launch date currently looks like it will occur in early 2019 (although that could change), and from now until then, we’ll be sharing and releasing updates to Genesis and the StudioPress themes in addition to more content with our thoughts around Gutenberg strategy. Here is a summary of some of our thoughts to get the conversation going.
The role of blocks and themes
Content blocks and WordPress themes have been architected as two separate worlds. The idea is that themes should provide a style for blocks, as opposed to providing the blocks themselves, and blocks should continue to work if you switch themes. This is similar to how WordPress is architected with the components that blocks are replacing, for example, widgets and shortcodes.
Of course, we all know that’s not how things actually work with widgets and shortcodes! Switching themes often breaks sites and portability between themes is rare (although Genesis helps with that greatly — portability between two Genesis child themes often works, thanks to sharing a common underlying framework). This is because for modern websites, “just slap a different CSS on it” is too simple to capture all of the behavior that happens when you switch themes.
Because of this, we’re exploring the role of blocks within theme creation. What does it mean when you have reusable pre-configured blocks that load with your theme? What does it mean to create custom child themes with custom blocks? Is it true that we should think about these things separately, and what role should / can Genesis play in making it easier to indeed switch between themes and still have blocks look and act properly? Surely some blocks are best-suited for plugins rather than themes, so what are the conditions where that’s true, and what sort of technology or standards do we need to make those plugged-in blocks play nicely with a large number of themes?
We have what we feel are interesting and clever ideas on these fronts that the Genesis engineering team is actively working on; stay tuned for more.
New CSS for blocks in your child themes
Gutenberg blocks include default styles which may not match your child theme. To enable blocks on your site, you will first need to create styles for the blocks used within Gutenberg. StudioPress will provide new block styles for its most popular themes, including the sample Genesis child theme and all newly-created themes, and we’ll be publishing articles explaining how you can do the same for your custom Genesis child themes.
Genesis and block style guides
As part of the core Genesis framework, we are creating ways to make styling blocks more efficient, performant, and portable across child themes. We’re also looking at how to leverage the block options functionality in Gutenberg (suggesting theme colors, fonts, etc. in the block admin UI) to help content creators stay within their self-imposed style-guides.
This creates a huge benefit — one that we use today at WP Engine with our own web properties, and that we plan to help bring to the world with Genesis and Gutenberg.
The idea is: Designers and developers want to create beautiful, well-structured, performant, device- and language-compatible components, and then empower their clients (the end-users, the marketers) to reuse and customize those components to build all sorts of sites.
The problem is: How do you provide marketers the ability to customize, but not the ability to break the design or functionality?
Today, the answer is often to lock down customization to the point where it’s essentially not customizable at all. But this creates a constant stream of trivial requests to tweak a color or trivially rearrange the elements on a page, and this isn’t a good use of anyone’s time.
Another answer is to allow maximum customization, but this can easily break the design. For example, you can supply a color-picker for a marketer to change the title color on a widget. But then that marketer can select colors which are off-brand, and now the design is broken.
The best answer is that the designers and developers who create the components should also be able to set the parameters of how they can be customized. In our example, the marketer should be able to select a color, but only from a pre-approved palette.
Our goal is to provide a system inside Genesis where this can be done in a standardized way, so that anyone can make customizable components, with the right balance of empowering the end-user and not allowing them to create sites that lack proper design or functionality.
Finally, we’re also exploring how Genesis can help you with Editor Styles for Gutenberg to deliver an even better and more visually accurate admin page building experience. The users of the sites you build should be able to easily create pages within the parameters of your style and brand. But even further, the interface they use to do that should look like the page they’re building!
With the investment in people and resources WP Engine is making in the Genesis team, we’re excited about the capabilities the team is adding to Genesis to help you win with Gutenberg.
Gutenberg and backwards-compatibility
Our team is working on our official roll-out strategy recommendation for Gutenberg in general.
We’ll also be publishing content around backwards-compatibility, but there are some key areas you should be aware of today.
You have a choice
While the Gutenberg editor is the future of WordPress and something we want to help you embrace, you don’t have to use the Gutenberg editor on day one.
You can choose to use the “Classic Editor” plugin which reverts pages to the old editor (selected page by page) and the “Gutenberg Ramp” plugin which lets you choose which types of pages to apply Gutenberg to (e.g. posts, ecommerce posts, pages, etc.). Both of these options will allow you to continue using the Classic Editor / TinyMCE for your posts and pages. Rest easy. You can take your time rolling out Gutenberg.
Your custom post types and custom meta fields will still work
Many plugins and custom-built sites rely heavily on custom post types and custom meta fields. From everything we’ve seen on Gutenberg, CPTs and custom fields will still continue to work once Gutenberg rolls out and well into the future.
We’re testing and updating Genesis and the StudioPress themes with Gutenberg
Engineers and designers from StudioPress and WP Engine are testing and reviewing the code of each plugin. We’ll be publishing our findings along the way and building out a final roll-out plan which we’ll be sharing with WP Engine and StudioPress customers.
Great news: Genesis itself has very few if any substantial backwards-compatibility issues with Gutenberg. The main focus of updates to the StudioPress themes are on adding styles for the new Gutenberg blocks. We’ll also be publishing content with tips on how you can do the same to the custom child themes you have created.
All in all, Genesis and the StudioPress themes are performing very well with backwards-compatibility testing; however, it’s the new features that we will be adding to Genesis and the StudioPress that have us most excited.
We are looking forward to the opportunity to lead with you in these areas and work together to help usher WordPress into the next era of site creation. We are also humbled by the contributions of the hundreds of thousands of people in the Genesis community and are honored to take this journey with you.