Apr
Apr

How To Use The Gutenberg Editor | How To Make A WordPress Blog Step-by-Step 2020

WordPress Website Workshop Module 23

By now you should at least be a little familiar with how the new Gutenberg editor in WordPress works.

In cased you missed it, I’ve already done two other videos describing what the new Gutenberg editor actually is, and how to use Gutenberg’s block system in the previous videos.

In this last video, I’m going to show you all about how you actually use it in your content, the kinds of things you can create, and how you can add rich media content to your posts and pages easily.

How To Use The Gutenberg Editor

In the last video, we gave you an overview of the blocks that you have available to you to create and manage content in the new version of WordPress with the Gutenberg editor. In this video, we’re going to show you the controls for how to work with the various different content blocks in Gutenberg.

How To Use The Gutenberg EditorLet’s go back over to WordPress. Go back to our demo post. You will remember this from last time with various different blocks that we have already gone ahead and created. You probably noticed in the last video that there are some buttons and things that show up around these blocks.

That’s what we’re going to be talking about. In order to work with these blocks, WordPress is implemented these new buttons that’s going to help you to work with them to be able to move them and to remove them and or rearrange them.

How To Use The Gutenberg EditorRight here at the outset, you have the ability here in this top left of your WordPress editor screen to add a block. If you click that, it’s going to give you the ability to scroll through the various different blocks that we talked about in the last video.

You can search for them if you’d like to do that or you can simply scroll to the one that you want to add in your post. That would be one way to do it. Another way to do it is once you’ve added your title, if you hit enter. It will automatically bring you to the next line where you can add a new post.

How To Use The Gutenberg EditorYou see over here that this plus button has been displayed again so that you can once again pull up this menu of the various different blocks. You also have the ability to type forward slash if you want to do that. Then it has a smaller list of various different blocks that you can add to your post that way.

Once you’ve created a block, you have these tools to be able to move it up or down. These arrows will move them around by moving it up or down one time, or you can grab this controller here in the middle and drag it to wherever you want it to go.How To Use The Gutenberg Editor

Also, blocks are going to have this control here, which gives you some additional functionality.How To Use The Gutenberg Editor You can hide your block settings. You can duplicate a block. You can insert before or after.

You can edit it as HTML. You can add it as a reusable block or you can remove the block all together.

In addition, you can see over here that you’re going to have various different keyboard shortcuts that will make all this easier if you’re one of the keyboard shortcut people that like to not have their hands on their mouse all the time. You have that ability, too.

In addition, as you are working with various different blocks, you’ll notice as you hover over them.How To Use The Gutenberg Editor You have this ad block button that will appear when you highlight a particular section. This will give you the ability to add a block in between.

For instance, let’s say we wanted to insert another bulleted list block above this paragraph.How To Use The Gutenberg Editor You just click plus, and then you type list to find that particular block, and then you can add your items here so on and so forth.

It adds it right there in line so you don’t have to worry about switching views between code or anything like that. It will allow you to create blocks wherever you want to create them and then easily move them around.

Also, in addition, you’ll notice that over here that there are additional blocks settings.How To Use The Gutenberg Editor You’ll see over here is that depending on the block that you are working with or editing, you’re going to have an additional set of controls over here on this side that will give you the ability to work with that block in a more detailed manner.How To Use The Gutenberg Editor

If for instance right now we’re on this cover image block. With the cover image block, you not only have these tools that are available to you up here, but you also have these tools that are available to you over here in this sidebar also.

It will vary depending on the block that you’re using. Here’s our image block. As you move through, your controls are going to change based on where you’re doing your editing.

Then this tab here, when you click on document, this is going to bring up the things that you are used to working with in the old version of the WordPress editor.

The publication tools are going to be over here.How To Use The Gutenberg Editor Your permanent link is going to be over here on this side now. You can edit your permalink here or you also have the ability to do that here when you are working on your title in the title field.

How To Use The Gutenberg EditorYour categories are over here. You can set your categories as well. Just like the old version of the editor, you can add new categories right from here.How To Use The Gutenberg Editor Then here is your featured image.

If you remember from the previous videos, we have the ability to set a featured image which is different than an inline image, and you’ve got that capability right here.How To Use The Gutenberg Editor Then, depending on how your theme works, and I believe we talked about this is that you have the ability to write a short teaser to display like on the front page, if your theme uses the excerpt field, then you can create a introductory statement here that introduces your post here.How To Use The Gutenberg Editor

Then you have your comments settings over here. It’s very much similar to the way that you have traditionally seen these controls. It’s just the layout is a little bit different. Then with the other settings you have these are very traditional in terms of what the old WordPress editor showed you as well for things that you could set.

For instance, here are the tools for our Yoast SEO plugin.How To Use The Gutenberg Editor Then here are the tools for adding scripts and so on and so forth, that are native to WordPress that you would have seen in previous versions as well.

That covers the basics of how to work with these various different controls in this new Gutenberg editor.

See Also:

ClickFunnels For Dummies – From Newb To Expert

Mar

"‘ClickFunnels for dummies’ is what you search for when you just need to get to the bottom of things. Just like the book series that goes by the same name, the idea is to do away with the fluff and boil down to the basics you need to understand on the topic. And that’s exactly […]"

Keep Reading...

How To Host a Website: 7 Tools & Features That Even Smart People Miss

Apr

"One of the oldest and most consistent bits of info you get when you’re trying to start a new website is to get a domain name and get set up on a hosting service. It seems pretty simple, right? Grab a domain, get a subscription to a hosting service that [insert “influencer” name here] is […]"

Keep Reading...

Creating Website Content Is Hard – Here’s What You Need To Do

Apr

"It never fails. The blank stares. The awkward silence. The head-scratching and thinking-face expressions as the client ponders how to answer questions about messaging, copy, and content. Because you see, the number one, biggest thing I see clients struggle with on their web design & development project is getting their content created. Because creating and […]"

Keep Reading...

How do I know if my online sales funnel is working?

Apr

"How do I know if my funnel is working? When it comes to digital marketing, is there anything worse than something not working and not knowing what it is? I know it’s been a huge frustration I’ve felt more than I’d like to admit. It’s so hard to figure out those things that you don’t […]"

Keep Reading...

Do I Need To Hire A Website Designer?

Apr

"The story goes a little something like this: A mastermind group was meeting and they were going around the table talking about the projects they were working on and the progress they were making. One of the members was talking about his project and how he was trudging along making progress and started to talk […]"

Keep Reading...

Question 2. Do you need people to be able to log in and create user profiles on your website?

Sep

"Following closely on the idea of content management systems is user management within content management systems. Why would users need to be able to log in to your website? You see this feature a lot when some kind of content asset is kept behind a wall that prevents access except for registered users. Newspapers and […]"

Keep Reading...

How To Set Up And Configure Your MailChimp Plugin | How To Make A WordPress Blog Step-by-Step 2020

Mar

"Today, we’re going to talk about how to set up and configure your Mailchimp plugin in your new self-hosted WordPress site. The idea goes a little like this: You want to start building your email list. It’s probably the single most important marketing task you can do. Russell Brunson has talked about how vital his […]"

Keep Reading...

How To Set Up Monster Insights | How To Make A WordPress Blog Step-by-Step 2020

Mar

" Monster Insights for Google Analytics makes it easier and faster to understand the traffic to your website. Being blunt, website analytics can be really tough to understand. The problem, as great as Google Analytics is, it can be overwhelming to understand all that it shows you. And if you’re confused you’re going to avoid […]"

Keep Reading...

Setting up Google Analytics & Search Console | How To Make A WordPress Blog Step-by-Step 2020

Mar

" Feeling like you don’t know what’s going on with your website is a terrible feeling. The problem is you don’t have any idea about what’s going on and whether or not any of your creative efforts are generating results – or not. And if they’re not generating results, then what are we all doing […]"

Keep Reading...

How To Choose A Domain Name: The Complete Guide

Jun

"Choosing the right domain name is a critical factor when it comes to the success of your new website project. There is a lot riding on your name and you’re going to be stuck with it for a while so you need to make sure you pick the right one. If you’re serious about wanting to […]"

Keep Reading...