CMS Support

Gutenberg, The Block Editor

In 2019 WordPress included a new content editor. During its development it was called Gutenberg, and upon its inclusion to WordPress it was renamed to be The Block Editor. Here’s a bunch of questions and answers we get about Gutenberg, WordPress’s content (block) editor.

About Blocks

Everything is a block now in WordPress. Which means they’re kind of a big deal.

What is a block?

A block is a distinct, isolated, discrete piece of content. A single paragraph is a block, an image is a block, a heading is a block. So is a list, or a tab, a youTube embed, and a separator.

Blocks can contain other blocks – i.e. a columns block contains several column blocks, each of which contain other blocks such as headings and paragraphs.

And each block can have its own settings and styles. You may have one paragraph block that has white text on a dark blue background. But that doesn’t mean all of your paragraphs have to look like that.

How can I insert a block into my post or page?

The most common way is to use the block inserter – the big blue plus icon in the top left hand corner of the editor.

You can also, when in an empty paragraph block (which is the default block), start typing using a forward slash / and then type the name of the block you wish to insert. i.e. if you wanted to add a heading, you might type something like /hea and WordPress would prompt you to insert a heading block.

And lastly you can hover your cursor between blocks (or after the last block) and an inline block inserter (plus icon) will appear. Click that and you’ll be able to insert a block in the position you selected.

How can I see the layout of my page?

The best way is using what is now called the Document Overview (previously ‘list view’). Clicking that icon (towards the top left corner of the editor, it looks like 3 horizontal lines slightly offset) will open up a panel on the left of your screen. This list shows you the blocks on the current post or page you’re editing. If you have nested blocks (i.e. blocks within columns or a group), you will be able to expand the parent block by clicking the > icon.

Where are the settings for my block?

When you select a block, either in the editor or in the Document Overview you should be able to see the settings for that block on the right hand side of your screen. If you can’t, it means the Settings sidebar is inactive. You can activate/show it by clicking on the settings icon in the top right hand corner. (it looks like a square with a rectangle alongside it which represents a ‘sidebar’)

Once you have the settings sidebar open, you will see the specific settings for the block you have selected.

There are 2 tabs to the settings sidebar. One will be for the current block you have selected – labeled as the ‘block’ tab, and the other will be for the document you’re working on labeled either as ‘post’ or ‘page’ depending on what type of content you’re editing.

The block tab itself is then divided into 2 tabs. The settings tab (labeled with a cog icon) and the styles tab (labeled with a half-filled circle)

General WordPress advice

CMS is a WordPress-based platform. So in order to get the best out of it, you need to learn how to effectively use WordPress.

Where can I learn how to customize my site?

The most common way to customize your site is using Custom CSS and Custom JavaScript. There are several places where you can input custom CSS or JS (Appearance > Custom CSS and Appearance > Global JavaScript being 2) but in order to do that you need to know how to code CSS and JS! The best place to start, in our opinion, is a course that is free to all staff and faculty at UBC on LinkedInLearning called HTML Essential Training by Jen Simmons. After that, go for the CSS Essential Training by Christina Truong. And finally, for JavaScript, try JavaScript Essential Training by Morten Rand-Hendriksen.

Can I collect Personal Information (PI) or Personally Identifiable Information (PII) on my site?

No, you may not collect PI or PII on websites on CMS. Doing so is against the UBC CMS Terms of Service, and against UBC Policy. If you need to collect PII then UBC IT recommends the use of Qualtrics.

Have some other questions?

You have a couple options. Below here you’ll find several more FAQs and support documents. And if those don’t help, then you can submit a support request.