Fun with Gutenberg

by | Apr 8, 2019 | Uncategorized

Not long ago, WordPress unveiled the biggest change to their page editor in quite some time. They called it Gutenberg, after the man who popularized movable-type printing in Europe and helped usher in the “modern era.”

I’m going to go out on a limb and suggest that this Gutenberg won’t spark a revolution. To veteran WordPress users, it may even be mildly annoying at first. But to those less-familiar or less-comfortable with using HTML and CSS to format their work, the new page builder offers much greater flexibility and a wide range of format options for blog posts and pages.

Here’s how it works:

This is a quote block.

Charlie Zegers wrote this

Gutenberg’s page editor allows WordPress users to break pages and posts into “blocks.” The blocks can then be grouped together, stacked, dragged, dropped or otherwise manipulated into a page design. (This is a paragraph block.)

Columns are useful. This is an image inside a column block.

My favorite aspect of Gutenberg so far is the ability to nest blocks inside of columns.

In this section of this page, I’ve created a row with two columns. The column on the left has an image block, while the one on the right has a paragraph block.

(Actually, three paragraph blocks. Each of them can be arranged and styled separately, too. This sort of formatting would be much harder to accomplish in the old WordPress page builder.)

This is a Heading

  • This
  • Is
  • A
  • List

And this is a paragraph. And this row has three columns. You can set the background color of each block separately, if you’re into that sort of thing.

This is another paragraph block. Just above it is a divider. And below are a couple more really specialized blocks.

Here’s one intended to display verse:

I am he as you are he as you are me
And we are all together
See how they run like pigs from a gun
See how they fly
I’m crying

Here’s one intended to display code:

10: PRINT “This is the sort of silly thing I did in coding class in grade school.”
20: GOTO 10
30: END

Here comes another divider:

You can also add specialized blocks to do things like build your newsletter subscriber list…

By clicking submit, you agree to share your email address with the site owner and Mailchimp to receive marketing, updates, and other emails from the site owner. Use the unsubscribe link in those emails to opt out at any time.

Processing…
Success! You're on the list.

Or embed a video from YouTube…

Or integrate your social media accounts.

Or add maps or contact forms or a specialized block with your business hours or…

Yeah, there’s a lot.

Now, you may be thinking, “I can do all this stuff already.” And yes, that’s probably true. But before Gutenberg, many of these tasks would require adding embed codes or similar. That could be a dicey proposition, requiring people to toggle back and forth between the visual editor and the code editor; switching back and forth would occasionally cause those embeds to break. (PayPal’s in particular.) This system is easier. And easier is usually better.

You might also be thinking, “I don’t see any of these options on my site” or “I tried using these blocks but they didn’t work.” And that’s certainly possible. If you’re using an older version of WordPress, you wouldn’t have the option to use the Gutenberg page builder.

If you’re using the latest version of WordPress (and you should always use the latest version of WordPress) with an older theme, it’s possible your theme isn’t configured to take advantage of the new Gutenberg functions.

These are both solvable problems. Need a hand? Want to set up an online or in-person training session? Contact us for a free consultation.