Gutenberg Resources

published on:

child stacking colourful square blocks with pictures on them

In December 2018 Gutenberg – the new WordPress – editor finally launched and changed how we edit WordPress sites. It is intended to make the editing process easier, more intuitive and more fun for general users.

I’m a fan – I think it’s a step in the right direction and makes editing easier and clearer. It gives you more options that don’t require a knowledge of code. It also includes a number of prompts to encourage you to make the ‘right’ decisions for usability and accessibility.

Why is it good?

labelling (with html tags) your content correctly

Instead of editing your page content in an editor like a Word Document (which is what the old editor was like) you edit each block as a separate ‘chunk of content’ . For paragraph text you choose the paragraph block, for a heading you choose an appropriate heading block, for a bullet pointed list you choose either a number or unordered list block… and so on.

Your theme then tells a browser how to display that content. So, your theme may say that paragraphs should be in size 14 of arial font. It may say your h2 (opening tag is <h2> closing tag at the end of the heading is </h2>) should all be blue and bold. By using the right blocks with the right html tags around them you ensure that your theme can make your site coherent: all the h2 headings will be the same as each other and so on for other blocks as well.

Gutenberg makes it much easier to decide to use the right blocks – and consequently the right tags – for your content.

Good for search engines, too…

Because google and other search engines will rank your pages based on how well organised they are (amongst many other things) having clearly organised heading structures etc will make it easier for Google to work out what is on your page and more likely to serve it up in response to search requests. It is the html on your page that helps to show search engines the structure of your site. Using the right blocks for your content (headings, paragraphs, bullet points, quotes, etc) helps search engines understand your site and rank it more appropriately.

How can I found out more?

Beginner tutorials can be found here:

Can I get ‘extra’ blocks?

Yes you can – a thriving industry is now creating free and paid-for blocks that are added via plugins.

Check out:

  • Jetpack blocks (some free and some paid for with the popular Jetpack plugin from Automattic) including a simple form builder block and some nice gallery features
  • Atomic blocks – some great ones in this bundle that come with a free plugin – I specially like their personal/author profile block
  • If you use Yoast you’ll find you can access a few of their extra blocks for presenting data such as how-to and frequently answered questions blocks.
  • Coblocks

There are many more out there so have a look through the repository. WPBeginner has a good article linking to block plugins that’s worth a read.

Can I make my own blocks?

Like everything else in WordPress you can take the bonnet up and look at the engine – and yes, if you have the skills you can make your own blocks. Some tips here:

What else is coming up with Gutenberg?

There are plans afoot to add Gutenberg block editing styles to sidebars, footers and headers of pages/sites as well as to the main content area. There are also new blocks that will be coming out – and useful ways of using old blocks such as the ‘grouping‘ feature. This is one of my favourite (if not quite bug-free yet) features.

Find out more if you’re into the ‘back end’ and coding at the WordPress Core blog on Gutenberg which you can of course subscribe to. Gutenberg Times has a broader (including more ‘user friendly’) set of information. Both are a great way of keeping abreast of developments.

This excellent review and deep dive investigation of where Gutenberg is at now from Smashing magazine is a great starting point for more advanced users. It’s written by Leonardo Losoviz.

Check out features ahead of time…

Add the Gutenberg plugin to your site and you get additional beta features before they are released into WordPress core. This is a good way of staying a bit ahead of the game. The plugin has a low star rating in the repository – people are giving feedback on beta issues and it’s not expected to be totally watertight until it goes into WP Core along with the ‘rest’ of the Gutenberg editor that has already been through beta and been signed off.

Keep up to date with Gutenberg news

Gutenberg Times newsletter

The biggest favour you can do your self if you’re interested in Gutenberg is to sign up for Birgit Pauli-Haack’s weekly newsletter – Gutenberg Times. It’s a comprehensive list of useful links and interviews. Highly recommended.

Where to learn more….

Are you a serious developer looking for pointers on how to develop the right skills and coding languages for working with Gutenberg? This excellent article by Tim Nash is a perfect start.

Who to follow on Twitter…

I’ll add more in time…

One more useful link

Cambridge Social Media post by me and Zuzana K on Gutenberg (including useful tips for social media blocks)

Thank you: photo by Markus Spiske on Unsplash