Layout Element Blocks

  1. Home
  2.  → 
  3. Help Center
  4.  → 
  5. Gutenberg Guide
  6.  → 
  7. Gutenberg Blocks Overview
  8.  → Layout Element Blocks

Layout Element blocks give you more control over the layout of your content. If Gutenberg does not have enough layout features, you may want to try the Divi Builder. You can activate Divi Builder from the plugins menu.

Button Block

The Button block helps you add buttons and links to another Post, Page or URL. You can use the color formatting tools to change the foreground and background color. The tool will even warn you if the color contrast is not high enough. There are several styles to choose from.

Columns Block

The Columns block helps you add multiple columns. You can then add content blocks to the columns. It is fairly basic currently. You can add multiple columns, set the column alignment, but not resize them.

Column A

ducks in flight

Column B

Roadrunner

Media and Text Block

The Media and Text block helps you create a side-by-side block with an image or other media alongside some content. You can select a background color or gradient for the entire block or for just the text content.

Boston Terrier Puppy

Who’s ready to play?

More Block

The More block is used in Posts to define what part of the Post you want displayed on your blog home page or blog archives. You can change the text from “Read More” to something more descriptive.

Read More example

Page Break Block

The Page Break block helps you separate your content into a multi-page experience. The next blocks will show up on new page.

page break example

Spacer Block

You can also add a Spacer block and set the height. If you need to visually add some space, this block can come in handy. There is a spacer block below with a height of 100 pixels.