Gutenberg’s at it again

Note: columns aren’t appearing correctly at this posting – which is a huge shame! This is limited to WordPress.com sites; columns work fine in the plugin that’s widely available. I’ve submitted a bug report to get this looked at, so do read on and expect a fix!

Like most great things, printing began with wine. In 1439 Johannes Gutenberg took a wine press, swapped delicious grapes for intriguingly shaped bits of metal, added some ink and the rest is history. 

A few years later, in 2003, this very blogging platform was first released. WordPress has a lofty mission – to democratize publishing. Johannes Gutenberg wanted to spread books to all of Europe (for profit, it must be said), and he was the original disruptor when he introduced his printing press. WordPress powers 30% of the web, is free, and is open source. 

Get ready for a lesson.

So besides some history, what do Gutenberg and WordPress have in common now? The next evolution of the WordPress editor is called Gutenberg, and it certainly carries on in Johannes’ enthusiasm for movable blocks – whether they be type or other content.

Something that was a pain point for writers and other content creators using WordPress – who aren’t excited by the idea of fiddling with HTML – was that the editor didn’t show you quite what you could expect on the front-end.

And, sometimes without plugins or CSS work-arounds, you weren’t able to display content in certain ways – like columns were notoriously tricky. It could also be frustrating to align images – it was a bit hit or miss.

What Gutenberg – the project – does is distill everything on the editor page to blocks. Think, Lego blocks with super clutch power. They fit together seamlessly, and can be shifted around with simple drag and drop. 

Here’s what it looks like with column block working!

Here you can see how I was able to create two columns, using the Column Block.

Things that used to take several minutes – or longer, if you’re not sure where to begin – now take one click. 

Before each block is a (+), and there lies the magic. Click on the (+) and a whole selection of blocks appears:

Using the block selection tool.

The blocks do the heavy lifting. You no longer need to fiddle with going up to the top of the editor to use bold or italics on a word or phrase that is far down your page. 

Using the block editing tools

If I have crafted a beautiful block and need to duplicate it, gone are the days of ctrl+a, ctrl+c, ctrl+v!

Instead, I can just duplicate the block, and it will appear below my current block.

Creating a new paragraph block is as easy as hitting Enter at the end of a line.

Modifying a block created in such a way is also easy. Tapping the Paragraph symbol at the top shows you what you can change it to, and alongside that are the arrows allowing you to move your blocks up and down the page.

Blocks can be used over and over again, too. You can set up blocks to instantly format a new page just how you like it. Create it once, then duplicate at a click.

For self-hosted WordPress sites, you can install the Gutenberg plugin here. You can read about what Matt has to say about Gutenberg here and here. I’m using a beta version available to Automatticians on my WordPress.com site. We’ll be testing it out for our WordPress.com customers ahead of rolling out the option on WordPress.com sites.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s