I’m teaching you how can you use the new WordPress block editor tutorial. WordPress has launched a new text editor on the newest version and its called block editor. Earlier was a classic editor. However, the classic editor is also there but block editor is more effective than the old one. So, I have created a tutorial on “WordPress block editor tutorial“.
Table of Contents
Gutenberg WordPress Editor
This new style of block editor also called Gutenberg wordpress editor. It is named after Johannes Gutenberg, who invented a printing press with movable type more than 500 years ago. It’s idea because to make easier website building for who are not much familiar with HTML/CSS or PHP or any other programming language.
Top 2 amazingly easy ways to learn the WordPress block editor.
You will learn whole process so that will make easy to use wordpress block editor.
1. Add Title
In this section of block editor, add your page or post title whatever your page or post about. Title should be SEO favorable. it will help to rank your website on search engine. Title is also relate to the link name that will automatically created by wordpress.
2. Use Blocks to add content
After adding the title of your page/post, now move to add details text, image video, etc. In the latest version of WordPress, there is a block system to add your content to the page or post. blocks are divided into many categories so you can use as per content type like for using quote there is a block called quote block.
3 easy steps to add the block to a new WordPress block editor.
There are 3 ways to add block to add content to the page/post.
1. As you will move mouse nearer to “start writing or type/or choose block” as the + sign will appear as in the above image. click on that + icon and block list will open and choose your choice block.
2. There is + sign on top of block editor as you saw in the above image in section 2. click on that + cion and block list will display and choose what you like to add.
3. Click on “writing or typing/or choose block” and by default paragraph block will activate. type slash from your keyword and as soon as you will type a slash, block lists will open to take the choice from the list. See in the above picture.
5 amazing wordpress blocks tutorials
WordPress defined blocks in 5 major categories.
1. Common Blocks
1.Paragraph Block: this block, there is the first item which is a paragraph. as you will select paragraph block then you can add content in the form paragraph and use alignment, bold, italic, etc. formatting.
2.Image Block: In this block you can insert image and formatting option for image is there. like alignment alt text etc.
3.Heading Block: In this block, you can add headings to the page or post. There are 6 heading options from H1 to H6. This is important that add headings to the content. so it will readable by the search engine. So your ranking will improve more.
4.Gallery Block: Here you can UPLOAD multiple images to make a gallery to your content page.
5.List Block: Use bullets on your content to make more effective to read. There are numeric or round circle bullet option. Also you can format text.
6.Quote Block: Here you will write quote lines and make it more attractive.
7.Audio Block: Add audio to the content from this block option.
8.Video Block: If you have video, you can add that with help of this block.
9.Cover Block: Add an image or video with a text overlay — great for headers.
10.File Block: Here you can add option to upload a file on your website.
2. Formatting Block
1.Classic Editor: you can use classic editor which was in earlier version of wordpress.
2. Code Block: Display code snippets that respect your spacing and tabs.
3. Customer HTML Block: Add custom HTML code and preview it as you edit.
4. Formatted Block: Add text that respects your spacing and tabs, and also allows styling.
5. Pullquote Block: Give special visual emphasis to a quote from your text.
6.Table Block: Insert a table — perfect for sharing charts and data.
7. Verse Block: Insert poetry. Use special spacing formats. Or quote song lyrics.
3. Layout Elements Block
1.Media and text block: Set media and words side-by-side for a richer layout.
2.Button Block: Prompt visitors to take action with a button-style link.
3.Column Block: Add a block that displays content in multiple columns, then add whatever content blocks you’d like.
4.More Block: Content before this block will be shown in the excerpt on your archives page.
5.Page Break Block: Separate your content into a multi-page experience.
6.Separator Block: Create a break between ideas or sections with a horizontal separator.
7.Spacer Block: Add white space between blocks and customize its height.
1.Shortcode Block: Insert additional custom elements with a WordPress shortcode.
2.Archives Block: Display a monthly archive of your posts.
3.Calendar Block: A calendar of your site’s posts.
4.Categories block: Display a list of all categories.
5.Latest comments block: Display a list of your most recent comments.
6.Latest Post block: Display a list of your most recent posts.
7.RSS Block: Display entries from any RSS or Atom feed.
8.Search block: Help visitors find your content.
9.Tag Cloud Block: A cloud of your most used tags.
5. Embeds Block
In this block you can embed youtube video, Facebook post, Instagram post, a tweet etc.
WordPress block editor tutorial will help you to use block editor in easy way.
I have tried to describe all the blocks of wordpress block editor. So, you can edit your post or page without any worry.
Block editor is effective than classic editor.
Every block editor have advance settings which you can see on right side bar of wordpress editor where you can make changes like text color, text size etc.