13 WordPress Tips To Save Time + Frustration Using Gutenberg

This post contains affiliate links. Which means I will make a commission at no extra cost to you should you click through and make a purchase. Read the full disclosure here.

Does the WordPress Gutenberg Editor seem daunting to you, compared to the classic editor?

Do you find yourself struggling to repeat your usual tasks using the Gutenberg editor?

Using the new editor can feel frustrating. Because it seems like things are happening much slower. Or require extra clicks.

Well, this blog post aims to help solve all of this. So that WordPress Gutenberg can seem as easy as it was meant to be. By tackling some of the common annoyances of using the new editor, compared to the old editor.

1. Learn The WordPress Gutenberg Shortcuts

Like any software, WordPress Gutenberg has shortcuts for common tasks. Like bolding your text, deleting blocks, adding them and more.

It’s well worth spending a little bit of time. So you can learn the shortcuts for the WordPress Guttenberg editor.

As it will make creating and editing your blog posts even faster.

Here’s a quick table of the shortcuts included WordPress Gutenberg:

Shortcut	Effect
Ctrl + B	Bold
Ctrl + I	Italics
Shift + Alt + D	Strikethrough
Ctrl + Z	Undo actions
Ctrl + Shift + Z	Redo actions
Ctrl + Shift + Alt + M	Switch between Visual & Code Editors
Ctrl + S	Saves a Draft
Ctrl + Shift + ,	Hide Block Settings
Ctrl + Shift + D	Duplicate Block
Ctrl + Alt + Backspace	Remove Block
Ctrl + Alt + T	Insert new Block before
Ctrl + Alt + Y	Insert new Block after

It’s worth noting that many of these shortcuts do also cross over with other software. Like using Ctrl and B to bold your highlighted text.

This means you might already know some of the shortcuts already!

📌 In a rush? Pin this post to your Blogging or WordPress board to read it later! 📌

2. Use The Quick Navigation Shortcuts Within The Blog Post

At the top of the WordPress Gutenberg editor. There is an Content structure icon. It looks like an ‘i’ inside a circle like this:

If you click on this it will show you the content structure of your blog post.

At a glance, you can see things like:

• Word count
• Number of headings
• Quantity of blocks you’ve used and so forth

But the most useful part of this is actually the document outline.

What you may not have noticed is that you can click on the headings that you’ve added to your blog post. And it will take you to this section of your blog post directly. Like a little shortcut!

This means that if you have a particularly long blog post. Or you’re looking for a specific part of your blog post to edit. You can quickly jump to that part using this navigation.

3. Learn WordPress Gutenberg By Following Step By Step Guides

Sometimes the best way to learn anything new. Like the WordPress Gutenberg editor, is to follow a step by step guide. That will lead you through how to use it. From start to finish.

By following the example you can learn the most common ways to do things easily.

In this particular case. I suggest following my step by step guide on how to write your first blog post in WordPress Gutenberg.

Because I cover all the important steps you need to do to create your blog post in Gutenberg. From tips for creating your text in the editor to adding images, setting up your links. And much more.

4. Issues With Using Grammarly

If you’ve ever come across the Grammarly app. You will likely have problems trying to run this in the WordPress Gutenberg editor.

Sadly, because of the way blocks work. Each paragraph of text is treated separately. And often what you have to do is click into each paragraph block. For Grammarly to be able to check your writing and highlight any errors.

When you’re writing long blog posts and end up with hundreds of paragraph blocks. This can become time-consuming and slow. Plus it does have the tendency to slow down the browser too.

This can be quite troublesome in the WordPress editor. When it can already start running slow when you start having tons and tons of blocks.

My workaround for this has been to write my blog posts in Google Docs. And then copy that text into the Hemingwayapp.com.

You can then run it through Grammarly. Before finally pasting it into the WordPress Gutenberg Editor.

This way you can still use your favorite editing. Without having to rely on them working in the Gutenberg editor.

5. Use Google Docs To Speed Things Up

Google Docs is my go-to tool for writing blog posts.

I love to write my blog posts in Google Docs as a rough draft first. I’ll then polish it to an almost final draft by adding things like bold text, headings and links.

I can then copy and paste this into tools like Grammarly. As well as my favorite tool for improving my writing – the Hemingwayapp.com.

Once I have a finalized draft in Google Docs. I can then copy and paste it straight into the WordPress Gutenberg editor.

This method works surprisingly well. As pasting text into WordPress from other tools has been prone to causing tons of issues.

In fact, when I copy text from Google Docs and paste it into Gutenberg. It is even able to separate my paragraphs and headings into blocks. Without further editing.

Even if you are comfortable writing all your content in the Gutenberg editor. Sometimes it can seem clunky and slow. Especially when you write longer blog posts like I do.

My blog posts can be around 2000 to 3000 words long. Add into this the idea that I like to separate my paragraphs into 1-3 sentences max.

Then you can imagine how I can end up with a massive amount of paragraph blocks. And these seem to greatly slow down the WordPress Gutenberg editor.

This is why I always write my blog posts in Google Docs. Despite being comfortable using the editor for everything.

As once I’ve done the bulk of the work. I can then copy and paste things over to Gutenberg.

My workflow goes much smoother and faster this way.

6. Creating New Paragraph Blocks In Gutenberg The Quick Way

Sometimes the blocks in WordPress Gutenberg can cause confusion. Especially if you are used to creating content in editors. That don’t use this block-like format.

When it comes to WordPress Gutenberg. You may be tempted to use the Add new block buttons to add blocks for everything.

But for some blocks that you use the most often. Using this method isn’t always the best.

In fact, when it comes to creating paragraph blocks. The easiest way to create a new paragraph block is to actually just hit the enter key. Like you would in any other text editor to create new paragraphs.

WordPress Gutenberg recognizes this and will create a new paragraph block for you automatically.

If for some reason you want to keep your text all within the same paragraph block. But still separate things onto a new line.

Then you can actually press and hold the shift key at the same time when you hit the enter key.

And this will keep everything all in one paragraph block.

7. How To Add Images To Blog Posts Quickly Using Gutenberg

The same is also true for image blocks!

Did you know? You can drag and drop your images directly into the Gutenberg editor instead?

It’s much quicker and easier to add images to your blog posts this way. As WordPress Gutenberg will recognize them. And automatically create your image block with your image already selected.

Plus, the image you drop-in will be uploaded to your media library too!

This saves you the hassle of having to add an image block to your blog post. And then going into your media library to find and select your image.

Something you will likely be repeating a lot each time you want to add an image.

Dragging and dropping your images into your blog posts. Is a lot more user intuitive.

It can be a little strange to get used to at first. But once you start using this method. You’ll find it much quicker and easier to add images to the WordPress Gutenberg editor this way.

In the next WordPress Gutenberg update. You will even be able to drag and drop images for your featured image as well. (This update is due 31st March 2020.)

8. Wrapping Text Around Images

With the use of blocks in WordPress Guttenberg. It can sometimes seem complicated to do certain tasks. Compared to the Classic editor.

One prime example of this is your images. As there is a tendency for bloggers to want to wrap text around their images.

Now, this is pretty straightforward in the Classic editor.

But for some reason when it comes to Gutenberg. People have come up with some strange methods to wrap text around their images.

Firstly, you shouldn’t really worry about wrapping text around your images. Because it’s not mobile-friendly.

In fact, here’s an example of what can happen.

See how your text can get squished to the side of your image. Resulting in words that are broken up across multiple lines. It’s pretty hard to read, right?

This is something you want to avoid whenever possible. Which is why I recommend centering your images instead. This way you never have to worry about this happening.

Plus you won’t have to mess around with complicated code that you need to test on multiple mobile devices.

Because let’s be honest there are so many different screen sizes for mobiles and tablets these days.

If however you do insist on wrapping text around images. What you need to do is this.

First, create an image block or you can drag and drop your image onto the page.

Then set the alignment to either left or right.

Once you have done this, you can then add a paragraph block. This is where you can enter your text.

Now, this won’t look like your text is wrapped around your image.

But if you click the Preview button at the top of the WordPress Gutenberg editor. Then this will show you how the live version of your blog post will look.

See how the paragraph block automatically wraps around the image?

This works so long as you use align left or align right on your image block.

If you select center for the image alignment. Then no text wrapping will appear when you preview the live blog post.

9. Plugins That Add More Gutenberg Block Options

Sometimes the default WordPress Gutenberg blocks don’t do what you need them to do. So this is where third-party solutions come in.

There are plugins out there. That are dedicated to adding more WordPress Gutenberg blocks to the editor. In particular, the Ultimate Addons For Gutenberg plugin is especially comprehensive.

Some of the blocks included with this plugin include things like:

• Table of Contents
• Call to action
• Pricelist
• Testimonials
• Columns
• Advanced headings
• Content timelines and many more

You can view a full list of these at UltimateGutenberg.com.

This isn’t the only plugin that adds more blocks though.

If you add any kind of plugin that includes Gutenberg support and adds features to your blog post. It will likely also add some blocks as well.

For example, the Better Click To Tweet plugin. Adds a tweet box block that you can add to your blog post.

Or if you use the Yoast SEO plugin or Jetpack. You may also notice that these too add blocks to your WordPress editor.

10. Make Use Of WordPress Gutenberg Reusable Blocks

No list of tips for using WordPress Gutenberg Editor would ever be complete. Without the mention of reusable blocks.

These are one of my most favorite features of the WordPress Gutenberg editor.

Because they are super flexible and can save time. Even on those small repetitive tasks, we all do when creating blog posts.

If you ever find yourself creating the same thing for your blog post. Over and over again. Chances are you can create a reasonable block for it.

Now you might be wondering – how you can use this for yourself?

Use Reusable Blocks For Remembering Code Snippets For You

Well, one example, is that I use it to create a reusable block for my email opt-in forms.

I use MailerLite. So they give me a code snippet that I can use to embed forms into my blog posts. This code needs to be added to the HTML of my blog post.

So what I did was create an HTML block in the WordPress Gutenberg editor. And I pasted my code from MailerLite into this block.

I was then able to save this as a reusable block and give it a meaningful name. Like the freebie, the form refers to.

Now, whenever I create a new blog post. I can just search for that reusable block and add it to my post.

If you are not familiar with searching for blocks. You can type in the slash key followed by what you want to search for.

You’ll need to do this after clicking the plus button to add a new block. Or you can do this in any empty paragraph block.

This saves me from having to go into something like Trello. Just to find the code and copy it into my blog post.

With reusable blocks like this. It’s all in the WordPress Gutenberg editor ready for me. With a few clicks or less.

Use Reusable Blocks To Save Time With Block Settings

Another example of how I use reusable blocks. Would be with the table of contents I add to my blog posts.

At the start of this blog post. You would have seen a contents section. Which includes an overview of the sections in the blog post.

On top of this you can click these sections. To jump to any part of the blog post.

I actually create this using a special block. That is included in the Ultimate Addons For Gutenberg plugin.

Now, I’ve customized the design of this. So that it fits in well with my WordPress theme and brand colors.

Initially, this was lots of setting changes. So once I was done with this. I was able to create it into a reusable block.

Now, whenever I create a new post I add this reusable block. And then convert it back to a regular block. So that it picks up all the new links for the current blog post.

This means I don’t have to go in and change all those design settings again. As using the original block always reverts back to the default design.

Find Even More Examples Of How Reusable Blocks Can Save You Time On Your Blog

Reusable blocks have definitely been a huge time saver-saver for me!

These are only a couple of examples of how you can use it for your own blog posts to save yourself time.

If you want more detailed instructions on how you can use it for yourself. You can read this blog post on reusable blocks here.

I’ve included step by step instructions on how to use reusable blocks. As well as even more examples of how you can use it.

11. Use The WordPress Gutenberg Editor As A Free Pagebuilder

Did you know? You can use the WordPress Gutenberg editor as a page builder. Rather than just for writing your blog post content.

WordPress Gutenberg blocks have become so advanced. That you can create entire pages using it.

This means you have an alternative option you can use to design your blog. That you can use instead of premium page builders. Or other popular builders too.

One particularly good example of this. That I’ve stumbled upon recently. Has been when using the Astra theme.

The Astra theme is one of the fastest WordPress themes out there. It doesn’t even use JavaScript.

Which can be one of the biggest issues. When it comes to preventing your page from displaying anything to readers.

So it’s super fast for loading!

Right, so you can use a plugin related to the Astra theme. Called Starter Templates.

This WordPress plugin allows you to import free pre-built layouts for your blog. That others have created.

And some of these are actually created with only WordPress Gutenberg blocks.

Here’s an example of some of the available layouts:

Also, it’s worth noting. That most of the page themes created using the WordPress Gutenberg editor. Will almost always use blocks from the Ultimate Addons For Gutenberg plugin. That I’ve mentioned earlier.

This plugin is super useful!

As it comes with Gutenberg blocks for almost anything you can think of. Like a table of contents and things like advanced headings, and other useful blocks.

You can view all the different available blocks and examples of their uses here.

You Can Use The Astra Theme For Free

Oh and before I forget. It’s worth noting you can use the Astra theme for free.

Many people associate it with being a premium theme. Because their website doesn’t clearly promote the free version.

But if you dig a little deeper. Then there is actually a free version as well.

So if you’re looking for an excellent free WordPress theme. Before you upgrade later to a premium theme with more features.

Then the free Astra theme version is definitely something that you should consider.

12. Adding Nofollow To Links In The WordPress Gutenberg Editor

One of the biggest problems bloggers have come across when writing their blog posts in the WordPress editor. Involves the fact, that there is no obvious way to add nofollow to external links.

The quickest and easiest way I’ve found to add nofollow to my links in the WordPress Gutenberg editor. Has been to go up to the More tools & Options button. That’s in the top right corner of the editor.

If you click on this and then click on Code Editor. You can then press Ctrl and F.

This will pop up a search box at the bottom of your browser.

Here you can type in href=

And this should highlight your links throughout your blog post. If you scroll to one of these that have been highlighted.

Then you can add the HTML attribute rel=”nofollow”

Or, if there is already a rel= attribute in your link code. You can just type in nofollow between the quotation marks. Make sure you put a space between nofollow and any other text. Such as noopener or, .

You may find that you can do this automatically with the settings in certain plugins. Like RankMath  or SquirrlySEO.

However, I prefer to control which links get nofollow manually. Because it’s a recommended practice by Yoast. To have at least one nofollow external link in your blog post

13. Missing Slug URL Or Permalinks

When you write a blog post. It’s good practice to create a meaningful post URL.

Usually you will also include a keyword for search engine optimization here. Although it won’t make or break your strategy if you don’t.

This is called editing your slug or permalink URL.

And what sometimes can happen is when you are in the WordPress Gutenberg editor. It doesn’t give you the option to change the slug or permalink URL.

Unless you’ve saved a draft of your blog post first.

This means that sometimes people go into the WordPress Gutenberg editor. But realize they cannot find this setting to change it.

In most cases, they’ve simply forgotten to save a draft of their blog post first.

So if you’ve setup your default permalinks. But the option to edit them in your blog post is missing.

Then make sure you save your blog post as a draft first. It won’t be made public in any way since it is just a draft.

Once you’ve done this. You should be able to click into your blog title and the permalink box will appear at the top.

You can then click on Edit and change it.

Or if you prefer.

In the sidebar menu on the right side of the editor. There is a Permalink section.

Once you’ve saved a draft of your post. You can expand it and you should be able to click into the URL slug box. So that you can edit the text in there to change your link.

Recap Of WordPress Tips To Save Time + Frustration Using The Gutenberg Editor

The whole idea of the WordPress Gutenberg editor. Was to make things easier for bloggers and people. To create their websites using WordPress.

So that they could create content without needing to be a web developer or needing to know code.

Now, whilst you can use the Classic editor to write blog posts without any code.

You are often limited in what you could do design-wise.

The WordPress Gutenberg editor tries to fix this by using blocks to create everything. So you can create blog posts or even completely different page designs.

However, the problem is that there are vast differences between the Classic editor. And the Gutenberg block editor.

This means anyone moving over from this kind of editing software. Can find the Gutenberg editor quite tricky to get a grasp of.

Learning the WordPress Gutenberg editor is not the smoothest.

In fact, it has a bit of a learning curve. Particularly if you’re used to the Classic editor.

New bloggers who haven’t experienced the Classic editor though. Will likely find Gutenberg easier to learn.

All in all, WordPress Gutenberg is here to stay. Whilst the classic editor will likely be phased out eventually.

So it is important to spend time learning the new WordPress Gutenberg editor now.

Because, as time goes on. It will be getting more features and improvements. And the Classic editor will slowly be left behind in terms of features.

By getting your feet wet now. You’ll save yourself time later down the line. Plus, once you’ve got the basics of the WordPress Gutenberg sorted.

You’ll wonder why it took you so long to start with it.

As I do believe the WordPress Gutenberg editor is easier to use as a whole. Particularly if you like to avoid code.

So what’s your biggest annoyance in the WordPress Gutenberg editor?

Did any of these tips help you out? Let me know in the comments below.

? Enjoyed this post? Then pin this post to your best Blogging or WordPress tips board! ?