Can I address the elephant in the room?
WordPress doesn’t look like WordPress anymore.
The WordPress Gutenberg Editor has replaced the familiar WordPress Editor.
Welcome to the world of blocks! There are blocks available for all kinds of content: You can insert text, headings, images, lists, and lots more!
This post will explain why WordPress switched to the Gutenberg Editor and offer a tutorial so you know how to use the new WordPress editor.
Why Did WordPress Switch to the WordPress Gutenberg Editor?
Bloggers were using third parties to build landing pages.
For example, bloggers and other content creators were paying to use DragDropr to move around content.
My landing page for new subscribers is an example of content moved around on that page.
As you can see, my image block and my text block are next to each other. Using DragDropr, I arranged the blocks this way.
WordPress wanted to have this functionality. By adopting this feature and more, WordPress will continue to grow. That was the rationale.
How to Use the New Gutenberg WordPress Editor
Are you familiar with Medium.com? Medium, a publishing site, works in a similar manner to the WordPress Gutenberg Editor.
You add blocks with different parts of your blog post in them.
WordPress Gutenberg Tutorial:
Once you click “Add Post,” you see a series of blocks on your screen.
Add your title, your blog post graphic, and the text of your post where directed.
The WordPress Gutenberg editor is intuitive. You don’t need to click the plus sign to add a new block. Each time you hit enter, a new block will be created.
Should you want to add a new element, click the plus sign.
If you drag your cursor to the left of the block, you’ll bring up the edit functions.
Look at your options for elements to add. Although they’re listed by most commonly used, you may find additional elements intriguing. These may be elements you never thought to use until you saw them as an option to add in the WordPress Gutenberg Editor.
To add an Image:
Create a new block and click the Image icon.
Upload your image. Notice the alignment and edit choices are directly above the block for your convenience.
Use the handlebars on the sides of the image to alter the size. You can also just drag the sides of the photo until they’re the dimensions you want. Write the caption directly in the draft if desired.
Don’t forget to put your focus SEO keyword in the Alt Tag.
Alignment choices for aligning your image right, left, or center will be available as well.
Many of these features were available in the Classic Editor but were not too obvious.
If you want to create a new heading, after creating a new block, click the T (for text).
After typing, you see you are given a choice for what type of heading you want to add.
Under the block you see you have choices such as adding HTML code to the block or an Image.
Clicking the 3 dots will enable you to choose additional options.
Did you notice the Grammarly editor appeared? You can now edit individual blocks with Grammarly.
Once again, you can add new elements by clicking the plus sign.
You can add YouTube or Vimeo videos simply by pasting the link into the block.
You can add blockquotes as well.
Do you like to embed lists in your blog posts?
You can also add numbered lists or bulleted lists.
To add Custom HTML in the new WordPress editor:
When you click the plus sign in the upper left-hand corner of the screen, you’ll be able to search for HTML. Look: The Custom HTML Code option came up when I searched for it.
Look:Â 
The new WordPress editor is intuitive. I don’t have to search for HTML code. It “knew” I commonly use the HTML code and it came right up the next time I needed it.
Since I paste codes for embedded elements and throw a linky party, I use HTML code pretty often, so this feature was important to me.
You can toggle between the HTML and the preview so you can see how your text will look.
Click “Preview” to load a preview of this page so you can make sure you’re happy with your blocks.
Finished writing? Just click “Publish” and you’re good to go.
What if you need help with the WordPress Editor?
You can insert a plugin needed to get the classic editor back.
If you need help, there is a WordPress Gutenberg tutorial video. You can see how to use the WordPress Gutenberg Editor.
Fair warning: The video was made a year ago when the editor was still in the beta testing stages.
Advantages of Using the WordPress Gutenberg Editor
- You can move the blocks around.
- Resize your image by moving the handlebars on the sides. Just drag your image to the size you want it.
- You don’t need 3rd-party tools like DragDropr to build landing pages.
- You don’t need 3rd party plugins like tables since the editor allows you to insert a table.
- The option to enter an image comes in when you add a new block. Therefore, you don’t have to keep going to the top of the screen to add media.
- You have more options now.
- The options you had before are more obvious now.
- Using the Gutenberg editor is like using Medium. If you can publish at Medium.com, you can easily publish using the new WordPress Gutenberg editor since Medium uses the same concept of blocks.
- If you’re not happy, you can install a plugin that will put the previous WordPress editor on your site.
Disadvantages of Using WordPress Gutenberg Editor
- Bloggers now have to learn a new skill: Mastering Gutenberg.
- You can’t use the editor on your phone and you won’t be able to until 2019.
Wrapping Up: Features of The New WordPress Gutenberg Editor and Tutorial
This post explainedÂ
- What Gutenberg is
- Why WordPress switched to a new WordPress editor
- How to use the WordPress Gutenberg Editor
- The advantages and disadvantages of the new WordPress editor.
Your turn: What is your opinion of the WordPress Gutenberg editor? Are you used to it yet? What is your opinion?
Readers, please share so bloggers struggling to learn the WordPress Gutenberg Editor read this tutorial and learn how to use Gutenberg.
