About WordPress Development

What Are WordPress Blocks? Everything You Need To Know…

If you’re using WordPress version 5.0 or later, you may be wondering about ‘blocks’. (Note: Learn more about the new WordPress editor.) So, what are WordPress blocks? What do they do? And how do you use them?

In short:

Blocks are the new way in which WordPress organizes content inside your blog posts and/or pages.

If you go to your WordPress dashboard (provided you’re on WordPress 5.0), and proceed to create a new post, you’ll see a new content editing panel that’s block-based instead of what was previously there — one large content field with standard controls for text formatting.

Exhibit (a) — the new editor:

Compared with the previous look of the content editor, that’s a huge upgrade.

Exhibit (b) — the previous editor:

With the new block-based editor, the editing experience is distraction-free and much more streamlined. This is because you only see the main canvas and no other unnecessary elements.

How Do I Use Blocks?

When you begin working on a new blog post or page, each piece of content you want to include — such as a paragraph of text or an image — will be converted into a block.

Think of a block as a neat wrapper around any given piece of content on the page. However, the fact that it’s indeed a block doesn’t change anything concerning the content itself. A paragraph of text is still a paragraph of text.

Using blocks is very intuitive. As soon as you begin working on a new post or page, WordPress will invite you to start writing text or choose a block type.

When you’re done typing a paragraph, just press enter on your keyboard and WordPress will transition you to the next block. And so on.

To add a block other than a paragraph of text, click on the ‘+’ icon, which you’ll find in the upper-left corner of the block editor (see the screenshot above).

Depending on the type of block you choose, you’ll be able to customize it in a number of ways — all to make it look exactly how you want. Here’s what you can do with the heading block, for example:

Introducing this block wrapper has a range of benefits. Chief among them is the fact that you can rearrange blocks much more easily than you could with the previous editor.

Each block has controls for moving it one spot up or down, and also supports drag and drop when you click and hold onto the icon in the middle of those two arrows. See here:

Previously, to move content around within a blog post, you needed to cut and paste it in place. This often resulted in various formatting issues (depending on the text editor you were using), or whole sections of content getting lost whenever you erased your clipboard by accident. The new blocks don’t suffer from those issues, and are much more maneuverable.

Do Blocks Change the Way Readers See Content on My Site?

No. The sole fact of blocks being there doesn’t impact the way in which your visitors see the content of your posts or pages.

Blocks are invisible to your visitors. They’re only a tool for you — you get to use them when working on posts or pages inside the WordPress dashboard. On the front end of your site, blocks are completely transparent.

What WordPress Blocks Are Available?

Apart from paragraphs of text, you can also use a range of other blocks.

Here are the blocks included in WordPress 5.0 out of the box:

HeadingFormShortcodeImageGalleryListQuotePullquoteAudioVideoCover imageFileCustom HTMLCodePreformattedTableButtonColumnsPage breakSeparatorSpacerEmbeds from external platforms, such as YouTube or Twitter…and others

Additionally, we’re already seeing quite a number of third-party WordPress plugins that come with their own custom blocks, and which extend the standard capabilities of the editor. The blocks you can find in those plugins include the likes of testimonials, pricing tables, WooCommerce products, social media buttons, contact forms and other useful elements.

What Are the Benefits of Using Blocks?

Many of the following benefits we already discussed above. So, just to recap:

  • First of all, blocks are portable. Blocks make it super-easy to insert and rearrange any type of content.
  • Blocks are also much less prone to various copy-and-paste issues, especially when copying content over from a Word doc or some other source.
  • Lastly, the block editor itself provides a much more consistent experience in terms of what your content looks like in the editor, versus what it looks like to your readers.

That being said, you’ll get the most out of blocks if you use a WordPress theme that has editor styles that are compatible with the block editor. That way, the design you see in the block editor — when working on a post — is the same as what readers see on the front end of your site.

This isn’t something that impacts your readers’ experience, but it is rather a nice bonus for you when you’re working on content. It just keeps things consistent and more predictable. Here’s an example of how the new default theme in WordPress, Twenty Nineteen, handles editor styling:

Leave a Comment

Your email address will not be published. Required fields are marked *

Open chat
Welcome to Society Of Computer Science.

How may i help you?