Home » WordPress Tutorials » Administration » How to Create Posts in WordPress via the Block Editor (Step By Step Guide)

How to Create Posts in WordPress via the Block Editor (Step By Step Guide)

The block editor (Gutenberg) in WordPress is very handy for three main reasons. First, it doesn’t require coding or any IT knowledge to be of use for you, then it comes with an intuitive design, and last, but not least, it offers ample options for your blog section.

Via Gutenberg, you can create quite beautiful layouts of your posts and the best of all is that you can start using it right away.

Because of how useful the block editor is, in the next sections you will read how to use it to create, modify and publish blog posts.

 

How to Create Posts in WordPress via the Block Editor

The first thing you should do is enable Gutenberg in WordPress. To be able to do so, you should use WordPress version 5.0 or higher. If you are using an older version, then the best thing to do is to update your system and proceed with the setup.

Then, via your admin panel go to Settings->Writing:

 

This will lead you to the WordPress Writing Settings page. From there locate the Default editor for all users section and select Block Editor:

 

Now, you will be able to use Gutenberg for customizing your posts.

Now, it is time to see how to create a new post with Gutenberg.

First, via your dashboard go to Posts->Add New:

 

Since you’ve selected Gutenberg as your main editor, WordPress should automatically open the block editor page.

However, if, for some reason, you stumble upon the Classic Editor layout, don’t worry. Simply find the Editor section and click on Switch to block editor:

 

This will be the Gutenberg Editor page:

 

This editor comes with a clean design, but don’t let that deceive you – the block editor features tons of tools that you can use right away.

In this demonstration, we will create a movie review article, and, in the process, we will see how each component works.

First, we should add a title – do so by deleting the large Auto Draft text and adding a text on your own – this is the title area of your post:

 

Then, we should proceed with adding some text.

To do so, simply click on the black plus icon you see on the right of the screen:

 

This will open a list of blocks you can include in your post – each one of these does something.

In this example, we will add a paragraph section and will include some text inside. Later, we will use a different block for our images and embedded videos.

Since we want to begin with a text, click on the icon and select Paragraph:

 

Once you’ve selected the block, you will see it just below the article’s heading. Also, on the right side of the screen you will see various options for this block:

 

Now, within the selected block start typing your text. You can separate the entire text into paragraphs, each of which will be contained in an individual paragraph block.

For this demonstration we separated our text into three paragraphs, each of which is contained by an individual Paragraph block:

 

Now, to make the text easier to read and to navigate visitors with more ease, we will include subheadings above each paragraph.

To do so, simply hover your mouse between two paragraphs. A Plus icon will appear. Click it:

 

The menu with the available blocks will appear. This time select the heading:

 

Now, a Heading block has appeared. Notice how a menu with options appears each time you click it:

 

Now, type down your preferred subheading by clicking the block and start writing. Then, you can add some more customization options via the menu options. For example, you can align the center of the subheading, make it bold, add a link, or something else:

 

Here’s how our layout turned out to be:

 

Now, it is time to freshen the design with some media items.

We will include an image below each subheading and a video right below the main heading.

To do so, however you mouse between any subheading and text and click the plus icon that should appear:

 

From the box that appears search for “image”. If you can’t find it, click on Browse all. This will show a list of all available types of Gutenberg blocks:

 

Now, after you’ve selected the Image block, add the preferred image:

 

You can either browse the WordPress Media Library or upload a new image. Also, you can add the URL of a certain image, if you prefer so:

 

Now, include the image in the post.

For our example, we have included an image right before each subheading:

 

Now, to make the article even more appealing, we will add a video trailer to the movie right above the text. This will keep our visitors engaged with our content.

To do so, we created a block right between the main heading and the text, then in the blocks list we selected YouTube:

 

If you can’t include a block right where you wish it to appear, don’t worry. Insert it somewhere in the article and then via the two arrows move it up and down until it hits the spot you wish:

 

With this tool, we have managed to move the block right on top of the article. Then, we added a YouTube URL:

 

Once you embed the video, the platform will automatically visualize it:

 

Now, it is time to continue with the post setup and publish it.

First, we will add the article to the preferred categories and tags. To do so, from the right side of the screen select Post and then find the Categories box:

 

From this box search your preferred category and add a check next to it.

Do the same with the Tags box.

Then, if you prefer, you can add a featured image for this post. To do, simply open the Featured Image box and select an image from the Media Gallery:

 

Then, you can add Except. This is a text that will give some information about your article before visitors open it:

 

Now, the post is ready. You can save it as a draft and continue editing it, preview how it would look if it was published, and publish it. You will find these options right on top of the screen:

 

Congratulations!

You have managed to publish your first blog post with Gutenberg!

 

Conclusion

Gutenberg is quite a versatile builder and can help you craft beautiful and vibrant posts. It comes as a standard feature with WordPress 5.0 and later, and is very easy and fun to use.

Related:

 

Was this article useful?

Click on a star to rate it!

Average rating 0 / 5. Vote count: 0

No votes so far! Be the first to rate this post.

Newest Articles:

How to Format Text in WordPress

When you create a post in WordPress, typing down the words is only a part of the job. Once written, you should format the text – separate paragraphs, include subheadings where needed, bold words and phrases, underline others, and include numbering and bullet points at...

How to Fix Error 505 Version Not Supported in WordPress

Error 505 Version Not supported might appear in various situations when working on your WordPress website. This kind of error can be very confusing and can show when least expected. However, the good news is that there are various fixes you can apply right away to get...

How to Fix Error 504 Gateway Timeout in WordPress

Error 504 Gateway Timeout in WordPress can really be annoying for you and your website visitors. The good news is that as with any other 5xx status code errors such as HTTP Error 500, Error 501 Not Implemented, and Error 503 Service Unavailable, the Gateway Timeout...

How to Fix Error 502 Bad Gateway in WordPress

502 Bad Gateway is quite a common error message in WordPress and although it looks like something very serious and technically demanding to fix, there are some quick steps you can undertake to deal with the issue. Just like Error 500 and 501 Not Implemented, Bad...

How to fix Error 501 Not Implemented in WordPress

When working on your WordPress website, you will eventually stumble upon various error codes such as 404 Not Found, Service Unavailable, and Error 500. Your web browser displays such error messages when there’s some issue between the web server and an Internet...

Ready to Create Your Website?