WordPress Editor Blocks

Rocket with WordPress logo blasting off for WordPress tutorials and tips

The implementation of the Gutenberg editor in WordPress has changed how you create and edit posts and pages. The use of blocks – predefined content areas – is radically different than the old visual editor, but once you get used to it, is a very powerful and faster way to format content. While not an in-depth tutorial on how to use blocks, this section will introduce you to the most commonly used blocks.

Note: You can convert Paragraph, Heading and List blocks into any of the other types

COMMON BLOCKS

WordPress Editor paragraph block

Paragraph

The default block that appears on a page or post is the paragraph block. When you enter text into it, it defaults to the body copy style. IMPORTANT: When you hit return at the end of a block of text, a NEW paragraph block is created, which is separate from the paragraph block before it.

Heading block icon in the WordPress editor

Heading

This block lets you create pre-styled headlines – two examples are shown below. Headings also create order for your content. H1 is automatically used for the page title. The next most important sub-heads are H2, then H3, H4, H5, and H6. Using headings properly improves your SEO.

List block icon in the WordPress editor

List

Use this option to create a bulleted or numbered list.

Image block icon in the WordPress editor

Image

If you want to inset an image into a page or post, you need to insert an Image Block. When you insert an Image Block, you’ll see buttons for Upload (upload an image from your computer), Media Library (select an existing image from the Media Library), and Insert from URL – we recommend against using this. If the image is removed, then the link will be broken, and you have no control over the image.

Button

If you want to add a pre-styled button to link to another page, the Button Block will let you do that. Add a label for the button where the button field reads “Add text…”. You’ll be able to change text and background color and the border radius, or how round the button looks. Don’t forget to add the URL or web address of the page you’re linking to with the button using the link tool.

Spacer

If you want to add some space between elements on the page/post, insert a spacer. Normal setting is 20 pixels

Separator

If you want a rule to separate sections of a page, insert the Separator.

FORMATTING

Table block icon in the WordPress editor

Table

It’s now much easier to create a table on a post/page – insert a table and define the number of columns and rows.

EMBEDS

YouTube

The editor includes embedding blocks for dozens of media platforms. All you need to do is choose the appropriate block and get the embed URL for the content that you want to include on the page or post. For YouTube, copy the Shared link and paste it in the embed field.

Discover how we can help you. Call now: (425) 442-1558