Cloudways Tests Gutenberg — The Future WordPress Native Editor

by Saud Razzak  July 5, 2017

Today we are talking about the new editor for WordPress that is called Gutenberg. The current WordPress TinyMCE visual editor hasn’t had many changes over the years and for the most part has stayed pretty much the same. While this isn’t a bad thing, but many WordPressers think it’s time for a change. There are many platforms which can provide newest and greatest services for writers, so why can not WordPress?

In the past few months, the WordPress core editor team has been working on the new Gutenberg WordPress Plugin. The goal of the core editor team is to add rich content to WordPress and make it simple and enjoyable.

WordPress Core Editor

What is Guttenberg?

Gutenberg is the new editor for WordPress. The current visual editor requires a lot of time to utilize shortcodes and HTML to make things work. The goal is to make things easier, especially for those just starting with WordPress. The core WordPress team is embracing “little blocks” and hope to add more advanced layout options. You can check out the example. In the past few months, Gutenberg has been in development for testing but the developer do not recommend using it on production site.

For testing purpose you need to install the plugin, so let’s move to the installation.

How to Install Gutenberg?

Gutenberg is a new WordPress editor that is now available as a plugin for testing. However, it requires latest WordPress 4.8 to function properly.

From your WordPress admin panel, navigate to Plugins > Add New. Search for Gutenberg from the top right search bar. As soon as you find it, click on the Install Now button.

After successful installation of the plugin, click on the Activate button. For further reference, check out the image below.

Activation

After activating the plugin, you will see the Gutenberg menu on the left side of the WordPress dashboard. Go to Gutenberg > New Post and then create a post.

New Post

You can also check out the demo page by going to the Demo button on the left side of the WordPress dashboard.

Demo

For testing purpose, WordPress core team don’t remove the default WordPress editor.

Editor

Now you can easily compare the default visual editor and the Gutenberg editor plugin. I personally love Gutenberg because it is going to be a nice change of pace!

Compare

I’m going to edit the existing blog post to check out the options of Gutenberg.

Gutenberg Options

Text

It will allow you to make the blocks directly from the text editor mode.

Text

Insert > Recent

It will allow you to add Text, Image, Gallery, Heading, Quote, List, and Cover Image.

Recent

Insert > Block

Here is the complete list of Gutenberg blocks that you can use for formatting, separation, and widgets as well.

Block

Insert > Embed

Previously, it was difficult to embed videos directly, the new editor will allow you to embed videos from Youtube, Dailymotion, Flicker, Facebook, Animoto, Cloudup, Imgur, Instagram, Reddit, Polldaddy, Screencast, Slideshare, SoundCloud, and much more.

Embed Video

Post Settings

Here you can add the post setting like Visibility, Publishing, Post Format, Categories, Tags, Featured Image, and much more.

Post Setting

Preview

The Preview button is same like the previous editor, just click on it to preview the page or a post.

Preview

Here is the live example for preview.

Preview

Update

After successfully added details you need to update your post by clicking to the update button.

Update

According to Matt Mullenweg, (WPTavern)

What we’re trying to do is 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. Whatever is integrated with it, let’s say a plugin that brings in your Google Photos or your Dropbox, that will now work everywhere, too.

What’s New in Gutenberg?

  • Added buffer for multi-select flows.
  • Added option to visually crop images in galleries for nicer alignment.
  • Added “edit image” button to image and cover image blocks.
  • Added option to disable dimming the background in cover images.
  • Added text formatting to Cover Image block.

Since Gutenberg is still in development mode, you can track changes by keeping an eye on the Gutenberg tag.

Start Creating Web Apps on Managed Cloud Servers Now!

Easy Web App Deployment for Agencies, Developers and E-Commerce Industry

About Saud Razzak

Saud is the WordPress Community Manager at Cloudways - A Managed WooCommerce Hosting Platform. Saud is responsible for creating buzz, spread knowledge, and educate the people about WordPress in the Community around the globe. In his free time, he likes to play cricket and learn new things on the Internet. You can email him at m.saud@cloudways.com

Stay Connected:

You Might Also Like...