Using the New Gutenberg Block Editor in WordPress 5.0

The new Gutenberg editor for WordPress officially rolled out on December 6 and not everyone is happy about it. I get it. It’s hard to get used to another platform after some bloggers have been using it for so many years.

I actually jumped on board in the very beginning when the plug in was released, knowing that I would eventually need to switch over and didn’t need another learning curve to battle.

For those of you who are hesitating to jump on board- don’t! The editor itself is less word-like and more of a block or container style. This drag and drop interface makes visualizing your posts simple. 

Gutenberg has been slowly rolling out over the past couple of months, and the majority of glitches have been worked out. And for the glitches that still remain, you can easily switch your block to the Classic editor for most of the plugins you have. 

And the good news is, if you install the WordPress 5.0 update and aren’t getting the hang of it, there is a plugin available until at least 2021 to keep you in classic mode. 

Honestly, I would highly recommend you get in there and use it right away. It’s something you’ll need to do in the long run and might as well start today!

In this post, I’m going to share some tips that I’ve learned along the way for using Gutenberg blocks and how you can get the most from it. 

Keyboard showing amazing things you can do with Gutenberg editor

How Gutenberg Blocks Work

It is really a very simplistic system with a simple drag-and-drop feel. All you need to do is to choose a block by its formatted design type (heading, paragraph etc.) and add in your content. That’s it. Really.

Navigating in Gutenberg

Navigating around the Guttenberg block system can take a little getting used to but once you get the hang of it, it is really so simple to use. 

Gutenberg Navigation Menu
Navigation Menu

On the top right of the WordPress screen, you will find a plus symbol within a circle for adding blocks, two arrows for undo and redo functions, and an “i” within a circle around it, which gives details on your content structure including number of words, headings, paragraphs and blocks.

The content structure link also breaks down your heading structure so that you can see at a glance if the headings are in the right order and make sense. It’s also useful to see if you’ve used your keywords for better SEO.

The next link is for block navigation which can quickly take you to the spot in your post instead of having to scroll through to find your spot. 

Customizing your new platform is easy to do. You can access the settings by clicking on the three vertical dots in the top left of your screen below your “Howdy” message from WordPress. There you will find settings for viewing, editor (you can toggle between code editor and visual), plugins, tools and other options.  

The view menu gives the option to keep the block menu functions (alignment, bold, italics and link creator etc.) at the top of the editor screen or within each available block. Personally, I choose to keep it within the block for easy access. 

You also have options to focus in on one block at a time or viewing in full screen without the WordPress sidebar for less distractions. 

Adding New Blocks

There are two ways you can add a block when creating your post.

On the top left-hand corner of the WordPress editor screen, there’s a little plus sign with a circle around it. If you click on it it will give you the option to choose a block format category.

Here are some of the current available blocks.  You can see they have a lot to start with and I imagine they will be rolling out others in time. 

Standard Gutenberg Blocks
Standard Gutenberg Block Types

Also, if you hover over the middle of the content block within the post, a small plus sign will appear. Simply, click on it to add a new block. 

After you’ve created one block, you can start a new block by pressing enter on your keyboard. The default is set to paragraph but you can modify it as you wish. 

Changing Block Type

After you’ve chosen a block, depending on the type originally chosen, you can edit the type by clicking on the drop down arrow in the menu located on the block or at the top of the page. 

Changing Block Types
Changing Block Types

If you do not see the option you are looking for, you may need to delete the block and add a new one. 

Moving Blocks Around

Because blocks are set up as a drag-and-drop, moving around your content is so fast and easy and eliminates some of the errors that can be created from copying and pasting. 

There are two ways to move your content. 

  • Using the up and down arrows
  • Hovering over the 6 dots in between the arrows, you can drag and drop the block wherever you would like (watch for the blue line to see where it will end up)
Video Tutorial How to Create Blocks in Gutenberg

How Gutenberg Blocks Can Help You to be More Efficient

1. Block Plugin Add-ons

These two plugins that will turn your Plain Jane Gutenberg block editor into an amazing block editor.

Simply add these through the plugins on your WordPress sidebar and you will have a ton of new formatted block options to use within your post. Here are just some of the options you will get with each:

CoSchedule - The #1 Marketing Calendar

2. Create Reusable Blocks

One of the very first things I learned how to do was create a reusable block in Gutenberg. In fact, it’s one of the first video tutorials that I did.

Creating reusable blocks in Gutenberg is super easy. All you do is create the block, click on the three small dots in the top right-hand corner of the block, and add to reusable.

The reusable block now becomes part of the regular block options under the reusable category.

This is perfect for creating a signature, affiliate link disclosure block or custom opt-in block. It’s a great feature because if you ever need to edit the block, Gutenberg updates all the blocks with that template at one time so you don’t have to spend time going back into each and every post.

Video Tutorial How to Create Reusable Blocks in Gutenberg

3. Create a Template Using Reusable Blocks

I am so excited about this one. I’ve always been a fan of templates. Anything that makes my life easier is truly a bonus.

When I started creating the batch content mini-course, I kept thinking that it would be so great to have some kind of reusable base template to get all my drafts in order quickly.

I had seen a post on Twitter about creating blocks within blocks but the post was full of information on coding- totally out of my league. I kept at it and finally found the solution!

Using my new solution for reusable blocks and the additional new block plugins, I could create a dream blog post content template!!

This is very easy to do and once you have it configured you can use it over and over again.

  1. Select a Container block from the Atomic Blocks plugin
  2. Select each block you would like to use within the Container block
  3. Move the blocks in the order you want them using the arrows or drag-and-drop
  4. On the top of the content block or top of the page, click on the three vertical dots
  5. Click on Add to Reusable Blocks
  6. Name your reusable block
  7. When you want to use the reusable block, add a block, click on the Reusable category and choose the block you created
  8. Click on the three dots on the top of the block and choose Convert to Regular Blocks (this is important so you don’t alter your template)
  9. Now you can edit each block individually or add additional content as needed

Can you say TIME-SAVER!?

Video Tutorial How to Create Reusable Templates in Gutenberg

So as you can see Gutenberg editor has some really powerful features built-in. Getting used to it might be a struggle for some, but I think it will be so worth it in the long run.

Have you switched to the Gutenberg editor yet? What are your thoughts on it? Let me know below in the comments.

Sasha Lassey signature