Breaking down WordPress’s new Gutenberg Editor
If you’re a WordPress user, chances are you’ve been having a bit of trouble trying to learn the ins-and-outs of Gutenberg—the new content editor that has the whole blogosphere and web design universe abuzz. With enough new shortcodes, widgets, menus, and custom fields to make your head spin, Gutenberg is poised to be the latest and greatest in content editing solutions this side of WordPress 5.0. While WordPress hopes Gutenberg will make “adding rich content to WordPress simple and enjoyable,” there’s a lot happening under the hood that might need closer examination. So before we dive right in, ensure you are using the latest version of WordPress v4.9 and download the Gutenberg Plugin from the WordPress repository to experience it for yourself.
Space is everything
The first thing you’ll notice about Gutenberg is how visually distinct it is from the old editing tool. WordPress seems to have been heavily inspired by Medium, as is evident from the increased writing space that should come as a relief to laptop users. If you’re still pressed for more screen real estate, you can hide the sidebar through an option in the ‘Post Settings’.
Don’t forget the minimalists and power users
While Gutenberg’s main draw is the intuitive, visual approach it applies to the whole content creation process, those who prefer a no-frills interface can easily switch from the visual editor to a text-based one using the drop-down menu on the top left. Keep in mind that choosing this mode after you’ve already used the visual editor can lead to a lot of unwanted HTML clutter. So if you prefer editing in HTML, make sure you do it from the start.
Remember the TinyMCE toolbar that was your trusted buddy all these years? Well that’s been put under the chopping block in a bid to reduce WordPress’s dependency on the TinyMCE plugin integration. In WordPress, most concepts like shortcodes, widgets, etc. exist inside TinyMCE as blos. And according to WordPress Founder Matt Mullenweg, Gutenberg will attempt to “shift it so that you only have to learn about blocks once and once you learn about the image block, that can be in a post, in a sidebar, in a page, in a custom post type, and it will work exactly the same way.”
Bringing HTML to life
Another cool feature of Gutenberg is what they’re calling the ‘Live HTML block’, which is essentially an HTML test chamber that lets you insert code and preview how it will appear on your website right from the block. This is especially useful for those who prefer using the HTML editor but would like to see how the content will look when it’s published.
Trouble for developers and their clients
Gutenberg hasn’t been very well received among the WordPress faithful, and many vocal admins and developers have voiced their concern in the form of 1-star reviews. <add screenshot here> Typically, WordPress developers don’t use page builder plugins; rather, they use a combination of custom fields and meta boxes so their clients can add site content in a controlled and prescribed style. For these guys, preparing their clients for the drastic changes Gutenberg is bringing in will be the biggest challenge, and there are bound to be some sites that will face a much harder time than others in getting used to the new ecosystem.
How can I test the Gutenberg editor?
You can test a live preview of Gutenberg by heading over to https://testgutenberg.com/ to experience a live demo of how the new WordPress editor works. Or, if you want to test it on your own site, the good news is you don’t have to wait until WordPress 5.0 is released, just go grab the plugin from here and install it into WordPress 4.9
That’s just us scratching the surface of what Gutenberg has brought to the table. It certainly has a few kinks that need to be ironed out, but overall, we’re quite excited to see the heights WordPress can take this new editor to. Have you used the new editor and have some thoughts you’d like to share? Add a comment below and join in the conversation. And don’t forget to check out ServerMule’s WordPress hosting solutions while you’re here!