How To Start Using Gutenberg Editor For WordPress

Maybe you’ve heard the rumblings about the WordPress update that brought Gutenberg to life, or maybe you’ve just opened up your site to find that the editor looks a little different. In either case, your new best friend is here! If you’ve yet to be acquainted, we recommend getting the 4-1-1 on what Gutenberg is. Regardless of familiarity, Gutenberg is likely here to stay, but don’t fret! We’ve put together this guide to help you get started with navigating a brave new world.

What is Gutenberg?

“Gutenberg” is the nickname given to the newest iteration of the WordPress editor that was built into the v5.0 update. Unlike the previous “Classic” editor, Gutenberg allows for full customization capabilities to create a page or post’s layout all in one place. Where Classic more closely resembled Microsoft Word in editing capabilities, Gutenberg focuses on building each new page using blocks—hence its description: “block editor.” Although it might seem overwhelming at first, the block editor will ultimately save you time, and its powerful customization options allow for greater creative freedom.

How Does the WordPress Block Editor Work?

Gutenberg provides a wide range of content and media blocks that can be modified to create a new layout with each page or post. Elements of a page, such as headings, paragraphs, buttons, images, and even columns, are now part of the Gutenberg Blocks arsenal, and each comes with options to modify them. Customization includes most basic style needs, such as background colors, font colors, component width, and a whole arrangement of others. Think of it as the game Tetris, except you get to customize the blocks that fill the space—and, you know, there’s no timer.

Getting Started With Gutenberg

The new block editor might feel like you’re stepping into an empty new home at first, but once you get the hang of it, things will really start to come together. From here on, we’ll provide a tutorial on how to set it up and get going; then, we’ll take a look at some pros and cons.

1. Install and Enable Gutenberg

Getting started with Gutenberg is as easy as updating your WordPress version to version 5.0. Unless you have another page builder plugin installed, the new block editor becomes the default without any additional activation. Just update, and you’re off to the races!

How To Disable the Block Editor

Let’s say you need a specific page or post to keep the Classic editor. For example, it could be that this particular type of page isn’t ready for the update or that you are still working up the courage to tackle the new editor. Regardless of why, it’s definitely possible! To get back to that familiar feel, just use the Classic Editor plugin, developed and maintained by the WordPress team. Once you’ve activated the plugin, you’ll be able to select the default editor for all users and will additionally be presented with the option to toggle between the classic and block editor on each page or post. We want to warn you that the Classic Editor plugin listed above has a shelf life. While the date isn’t set quite yet, the WordPress team makes it pretty clear they’re aiming to end support eventually.

2. Create a New Post

Creating a new page or post has remained consistent between the WordPress updates. In your WordPress dashboard, you can either hover over and select New > Page or New > Post from the top navigation bar. You can also follow a similar path in the left-hand navigation by selecting Page > Add New or Post > Add New. Once your new post is created, it’s block editing time.

3. Insert New Content Blocks

You have your editor open. It may feel a little strange and a little exciting, but all around, it basically just looks like an empty whiteboard. From here, you have a couple of options to add in some new blocks; you can either click the (+) up in the top left-hand corner to open up the sidebar list of blocks or the (+) to the right-hand side to open the list of available blocks. The top (+) button opens up a sidebar that lists the blocks in combination with a short snippet about it, while the in-page button opens a quick drawer that only provides the list. Select your first block from either, and it’ll automatically be added to the beginning of your new post.

Reusable Blocks

There will be times when you’re creating a new post where you’re recreating certain blocks with the same content and style that you’ve already used before. This could include things like banners, specifically styled CTAs; you name it! Instead of reconfiguring the same blocks over and over again, Gutenberg offers the ability to create reusable blocks to quickly perform what’s essentially a big copy-paste. To get started, put together the desired block or blocks, add in your content, and select the block(s) you want to include. From here, open up the additional options in the toolbar (the three vertical dots) and click “Add to Reusable Blocks.” Name your new block, and voila! You’ve created your first reusable block.

Adding your new block to a post is just like adding in any other block—the main difference is that the reusable block will be listed under a new tab labeled “Reusable.” Click on that tab after you’ve opened the sidebar to find your fancy new creation.

Custom Blocks

“Well, what if I just found a cool plugin that gives me this exact block I want that isn’t available in Gutenberg right now?” you ask. And to that, I say, “Nice! Let’s add it!” Just like any other part of the WordPress experience, there’s always a possibility that a plugin exists with extra features, like new blocks to add or edits to the current blocks. And just like any other plugin, these can be added through the WordPress plugin library or via uploading a zip file. It may be good to note that some of these plugins create their own category in the Gutenberg sidebar that you’ll need to switch and search through, but all in all, they can be added to the post by following the same steps as other blocks.

Common Types Of WordPress Content Blocks

Posts are often built using the same recipes, and the Gutenberg development team seems to have made sure to try to account for this. Headings have been broken out into their own blocks, while paragraphs are also a stand-alone block. Images and other media, such as video and audio, have also been divided into individual block types. If you need a combination of media and text, another block that features images inserted into paragraphs has been included with the list of default blocks. Alongside those, buttons, hero sections, and various other bits and bobs are also included as separate customizable blocks. There’s a broad range included; all it takes is a quick search in the blocks sidebar.

Pros and Cons of the Gutenberg Block Editor

Congrats, you’ve made it through the tutorial! With the rollout of the editor attached to a WordPress version update, the shift from the Classic editor to Gutenberg is on the horizon for every WordPress site. It can sound a little scary at first, but we’ll go over some of the benefits and drawbacks of the update to hopefully help assuage any anxiety.

Advantages Of Using Gutenberg Block Editor

The biggest benefit of Gutenberg is that it’s truly a game-changer. Pre-built blocks allow for quick layout creation regardless of your comfort or ability with development. Anyone can fully customize the presentation of a page using the editing sidebar in combination with the block library, so you don’t have to rely on a developer to make that cool header you’ve always wanted without much hassle. It’s also a huge plus that repetitive blocks can be saved to be reusable.

Disadvantages Of Using Gutenberg Block Editor

While Gutenberg has many plus sides, the downside is that there’s a lot to cover. The learning curve is definitely very present, so updating a site that had previously been using the Classic editor can be a bit of a pain. There’s quite a bit to learn, but we’re hopeful that this tutorial can at least offer you a boost.

Our Top Tips For Using Gutenberg

With all that being said, the biggest tip we can offer? Experiment, and experiment a lot! Gutenberg is incredibly customizable right out of the box, and there’s always something new to toggle, adjust or expand. If it seems difficult to set up one block the way you’d planned to, start searching around, and you might find that there’s a different block that does the exact thing you’re looking for. Explore the customization options available to each block and tinker with the possibilities because they can truly feel endless. Congrats on the update, and welcome to Gutenberg!