Gutenberg is coming

There is no denying it: Gutenberg is coming…

What is it?

Gutenberg is the new content editing environment in WordPress, named after the inventor of the movable type printing press, Johannes Gutenberg.

The plugin had been in beta testing for over a year, moving into a significant trial phase in WordPress 4.8 and now full blown production in WP 4.9.8. Gutenberg is set to be the content creator and editor powering WordPress 5.0 when it is released (…soon)

How does it work?

The Gutenberg editor uses blocks to create content and replaces myriad inconsistent ways of customizing WordPress.

Gutenberg will replace the classic WYSIWYG editor with a ‘block’ based visual editor. A block is the most basic unit of the web page building process and they can include paragraphs, separators, images, buttons, quotes, galleries, audio, video, headings, embeds, custom codes, paragraphs, separators and many more.

By embracing ‘the block‘, we can potentially unify multiple different interfaces into one. Instead of learning how to write shortcodes, custom HTML, or paste URLs to embed, you should do with just learning the block, and all the pieces should fall in place

WordPress.org 2018

What’s the big deal?

The new CMS interface does not play nicely with all themes, plugins, page-builders and adjunctive code previously developed to maintain a functional website. That is to say – ‘it broke the LITFL website when we installed it‘…

So, we are taking the opportunity to re-write and re-design 8,500 posts and pages over on our new domain litfl.com. This may seem a bit reactive, but we believe these will be a 1000 hours well spent, to future-proof this WordPress hosted educational environment.

Tips and Tricks

Early days for us. But, for those thinking about embarking on the Gutenberg journey…

• Download and install the Gutenberg plugin
• Create a test page to play with the basic functional blocks
• Trial conversion of old post/page to blocks (handy ‘convert to blocks’ will appear upper right of the classic editor block)
• Don’t be constrained by the boundaries your previous structure maintained, or that the basic blocks allow. This is a process in evolution and you will be able to ‘create’ your dream block soon…

Review the new blocks on the block.

Our favourite is the Atomic Blocks plugin. Again early days, but the plugin provides some thoughtful additions to the basic block party

Interface Review

Old WYSIWYG Interface

New Gutenberg Interface

Defend the Wall or jump?

Gutenberg Pros

• Easier to use for beginners
• Control a website’s entire layout (both back end and front end) from a single console.
• Reduces the requirement to memorise markup, or copy and paste shortcodes/meta boxes.
• Create ‘Reusable blocks’ and ‘Drag’n’Drop‘ blocks within the visual editor to improve efficiency
• Bite-sized blocks of information should be more appetizing to bots than bloated html

Gutenberg Cons

• It is new.
• It is evolving rapidly (WP released 3 plugin updates within 5 hours last week)
• It is easier to use for beginners – but much harder to learn for ‘old dogs’
• Still many things that need to be developed prior to 5.0 launch (Markdown support, responsive column support etc)
• Gutenberg may very well break your theme, your page-builder and your heart.

Summary

• Gutenberg is a brand new block based content editor that will be fully integrated into WordPress 5.0, and will change the way we blog.
• Gutenberg is here to stay. Embrace the change, or change your blogging platform.
• After 10 years of WYSIWYG, we are now 5.8% of the way through upgrading to the Gutenberg interface
• Lifeinthefastlane is DEAD; Long live LITFL

Further Reading

• McAllister M. Introducing the Atomic Blocks Plugin and Theme
• Toonen E. What is Gutenberg. Yoast
• Dudharejia M. The Complete Anatomy Of The Gutenberg WordPress Editor. Smashing Magazine
• Roberts A. Gutenberg myth-busting: 10 answers on the future of content creation in WordPress
• The Gutenberg Handbook WordPress
• The Gutenberg Times
• Gutenberg News and Gutenberg Twitter feed