How to Use the New WordPress Gutenberg Block Editor

If you’ve recently created content on WordPress after taking a blogging hiatus, you may have noticed a big change. 

WordPress swapped out its classic page and post editor for a sleek new option known as the  Gutenberg block editor.

This new content composer is now the default on WordPress, and it may take some getting used to. For WordPress.com users, the need to adapt is imminent as the Classic Editor is being retired as of June 2020.

Although Bluehost users build WordPress websites with WordPress.org (a different software version that allows for more variation of use), this change won’t immediately affect you. That said, Gutenberg is most certainly the future of WordPress, which is why it’s worth getting to know now.

To help you get the hang of things, this guide to the WordPress Gutenberg block editor will teach you:

  • What the new Gutenberg block editor is
  • How to use Gutenberg to add content to WordPress
  • How to publish posts and pages with the Gutenberg block editor
  • How to revert back to the classic WordPress editor

What Is the Gutenberg Block Editor?

The Gutenberg block editor is WordPress’ new page and post composer. 

The name honors Johannes Gutenberg, who invented the printing press and made it possible for information to spread to the masses in an unprecedented way. 

The composer is called a “block editor” because it lets you add blocks of content to a page. The Gutenberg block editor was first released in November 2018 with the WordPress 5.0 update.

How is Gutenberg different from the classic WordPress editor? 

These are the main differences:

  • Gutenberg is sleeker and more minimalistic than the Classic Editor. 
  • Blocks add a WYSIWYG component to the new editor that helps WordPress compete with Squarespace and Wix. The ability to add blocks makes creating content on WordPress less intimidating to users who aren’t very tech savvy. 

Now that you understand how the Gutenberg block editor differs from the classic WordPress editor, let’s get you acclimated to this new content composer.

How to Add Content to WordPress with the Gutenberg Block Editor

You can use the Gutenberg block editor to add various types of content to a page or post in WordPress. 

To open the block editor, start by adding a new page or post to your website.

1. How to Add a Title in Gutenberg

To add a page title, simply add your text where it says Add title.

2. How to Add Content to the Blog Post Body in Gutenberg

To add words to the body of a post or page, start typing in the whitespace below the title OR add a block.

3. How to Add a Block Using the Gutenberg Block Editor

Blocks are the new way to add content to a page or post in WordPress. Blocks have revolutionized WordPress by empowering people to design beautiful pages without having to know how to code.

Add a block by clicking the encircled plus sign found to the right of the text you’re typing, or at the top left of the editor. 

When the block menu appears, search for the specific type of block you want to add. There are more than 50 blocks available in the Gutenberg editor. They enable you to do things like add text and images to, adjust the formatting of, insert widgets into, and embed external content onto a page or post. 

Select the ideal block for the task at hand and follow its instructions to create your desired content within that block. Repeat this process to add multiple blocks.

Another way to add a block is to type / to bring up a list of blocks that can be selected inline.

4. How to Arrange Gutenberg Blocks

Hover over a block, until you see an outline. Arrows and dots will appear to the left of the block. Click the up arrow to move the block one position up, or the down arrow to move the block one position down. To reposition the block anywhere, click and hold the dots between the arrows and drag the block to your desired location.

5. How to Format Gutenberg Blocks

Click on a block to make a formatting bar appear on top of it. From here, you can do things like add a hyperlink, duplicate the block, and edit its HTML. Depending on what the block is (plugins have started to make their own), you can make use of additional functionality within the editor. 

You can access additional settings using the Block tab in the right sidebar.

How to Publish Pages and Posts on WordPress with the Gutenberg Block Editor

Now that you’ve created a page or post that you are happy with, it’s time to publish it. 

Publishing means taking the behind-the-scenes draft of your WordPress page or post and making it go live on your website. Visibility settings let you restrict who can see your published content.

So what’s the difference between a post and a page on WordPress?

Posts are used to share topical blog content, like informative guides or news. They’re typically displayed in chronological order on a website’s blog section. Posts are added to websites more often than pages are.

WordPress pages are used to share evergreen content, like a biography or company story on an about page. Other examples of common WordPress pages are homepages, contact pages, and pages describing services. While WordPress pages are updated when necessary, the number of pages on a WordPress website doesn’t fluctuate much.

Here’s how you can use the Gutenberg Block Editor to publish a page or post on WordPress.

1. Open the Publishing Settings Menu

When you are ready to publish your page or blog post, use the Document tab in the right sidebar to select publishing settings. If the sidebar has disappeared, you can make it reappear by clicking the gear icon at the top right of your screen.

2. Select Your Publishing Settings

From this view, you can select a publication date and time, post author, featured image, and tags.

Having the ability to select a publication date and time means that you can schedule content to be published in the future. This feature frees you from having to manually click “publish” whenever you need a timely piece of content to go live on your website.

A featured image is used in two ways. In a blog or gallery, featured images can accompany pages or posts and help them stand out or describe their contents. With some WordPress themes, the featured image is displayed in the header of pages and posts. 

Tags organize website content and help readers find similar content within the WordPress site that they are visiting.

3. Publish Your Content

Save your draft, preview what it will look like when it goes live, and publish your post or page using the buttons at the top right of your screen.

How to Reinstall the Classic WordPress Editor

Change is hard and it can always be challenging adapting to any software updates. You can still revert back to using the Classic Editor which will be available as a plugin for you to install on your WordPress website.

1. Go to the Plugins Directory

Hover over Plugins in the left sidebar of your WordPress dashboard until nested options appear. Select Add New.

2. Find the Classic Editor 

In the plugins directory, search for Classic Editor.

3. Install the Classic Editor

Click Install Now, then Activate to revert to the classic WordPress editor. Now when you add a new page or post to your website, you’ll no longer see the Gutenberg block editor as the default option.

The Gutenberg block editor has been making waves since it was introduced to the WordPress community in 2018. The new WYSIWYG composer makes WordPress more competitive with other website builders by enabling users to create beautiful website content without knowing how to code.

If you’re looking to learn more advanced use cases with the Gutenberg blog editor, check out Yoast’s free Gutenberg course.

Want to check out the Gutenberg block editor for yourself? Build your website with a web host optimized for WordPress. Learn more about hosting with Bluehost.

Desiree Johnson
Desiree Johnson | Content Specialist
Desiree Johnson is a Content Specialist at Bluehost where she writes helpful guides and articles, teaches webinars and assists with other marketing and WordPress community work.

Leave a comment

Your email address will not be published. Required fields are marked*