WordPress Editor

Summary: Learning about WordPress Block Editor and different types of Blocks.

WordPress Block Editor

The WordPress block editor also called the block editor, WordPress editor or Gutenberg editor is the new way of publishing content in WordPress. The WordPress block editor offers an array of blocks that can be used to create media-rich pages and posts.

Blocks are the content elements that you add to create content layouts. You can add blocks for paragraphs, images, headings, lists, videos, galleries, and more. You can control the layout of the blocks with ease, to build visually appealing web pages.

Top Toolbar

Exit the Editor: Shows the W icon by default, or the Site Icon if available. Click to exit the editor. This will prompt you to save the changes or leave the post or page.

• Block Inserter: Add blocks or patterns to your post or page.
• Tools: Switch between editing a block and selecting a block. Choose the Select tool (or press the Escape key on your keyboard) to select individual blocks. Once a block is selected, press the Enter key on your keyboard to return to editing.
• Undo and Redo: Undo an action, or redo an undone action.
• Details: Get the post/page details including the character and word count, estimated time to read, the number of paragraphs and blocks on the post/page, and the document outline showing the headings and how they are structured on the post/page.
• List View: See a list of all of the blocks that are on the post/page and easily navigate between the blocks on your post/page.
• Save draft: Save a draft of your post or page without publishing it.
  Preview: View how your post/page looks on your site by using the device icon next to save draft link.
• Publish: Make your post/page available publicly.
• Settings: Show or hide the post/page sidebar settings and the block settings.

Content Area

We can add blocks to the content area which will be then rendered as a HTML to frontend.

Sidebar

It contains settings for the post and the blocks.

Blocks

Text blocks are used for the putting text content on the post.

• Paragraph
• Heading
• List
• Quote
• Classic
• Code
• Details
• Preformated
• Pullquote
• Table
• Verse
  

Media blocks are used for the putting media on the post.

• Image
• Gallery
• Audio
• Cover
• File
• Media & Text
• Video

Design blocks are used for creating layout on a page.

• Buttons
• Columns
• Group
• Row
• Stack
• More
• Page Break
• Separator
• Spacer

Block Directory

The Block Directory is a new way for block editor users to discover, test and install new blocks on their website. It is available to content creators who have the capability to install and activate plugins.

Block Patterns Directory

The Block Patterns Directory is a way to add pre made patterns to the website. These patterns are made of blocks and can easily customized.