This page shows all available page blocks with default styling.


Heading blocks

A selection of headings for your content pages. Use them in a semantic way to logically split the contents. Generally H1 is reserved for your page title so use H2 for your main headlines and gradually go one down in case of subheadings.

H1 Heading block example

H2 Heading block example

H3 Heading block example

H4 Heading block example

H5 Heading block example
H6 Heading block example

Documentation and usage: wordpress.org/support/article/heading-block


Paragraph block

Your main content block – page copy is most likely to use this block.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Documentation and usage: wordpress.org/support/article/paragraph-block


Image block

Full width image. Usually used to showcase something or can be used as hero image before copy instead of template gallery.

Caption for the image block

Documentation and usage: wordpress.org/support/article/image-block


Gallery block

Show multiple images in a single block.

Documentation and usage: wordpress.org/support/article/gallery-block


List block

Shows list – either numbered or bulleted. Indentation is supported.

  • List
  • Block
    • Indented
  • Example

Also a numbered list:

  1. Numbered
  2. List
    1. Indented
  3. Example

Documentation and usage: wordpress.org/support/article/list-block


FAQ block

Can be used for collapsible contents. Purposely build for FAQ pages to help find the right information, however it can be also used for secondary info that doesn’t have to be shown on the page.

FAQ Question
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Another Question
Did you know you can include links here?

Quote block

Useful for highlighting a quote or showcase a message.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Citation example

Documentation and usage: wordpress.org/support/article/quote-block


Person Profile block

To showcase people. Perfect for staff page or even at the bottom of the articles to promote author. This block supports images, ideally square proportions, but it will scale to fix square space.

Picture of John Smith

John Smith

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Picture of Jane Doe

Jane Doe

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Audio block

You can include audio files on your pages. The player itself is managed by the browser so it can appear differently depending on the browser used. Supports files from Media Library as well as external links.

Documentation and usage: wordpress.org/support/article/audio-block


Cover Block

Text over cover block

You can have multiple lines. Great for nice section intro.

Supports parallax effect too.

Documentation and usage: wordpress.org/support/article/cover-block


File block

Link to a file, or in fact two links – first one takes you to the file and the button contains instructions to force download the file.

Documentation and usage: wordpress.org/support/article/file-block


Video block

Embed the online video using this block. Supports YouTube, Vimeo or Media Library files.

Video block

Documentation and usage: wordpress.org/support/article/video-block


Social Icons block

Add social media buttons. There’s an extensive list of available platforms and a selection of styles to choose from too.

No documentation is available.


Table block

Insert a table. Allows to specify table header and footer rows.

Header rowHeader labelHeader label
ExampleofTable block
withtworows
Footer rowFooter labelFooter label
Table block caption

Documentation and usage: wordpress.org/support/article/table-block


Code block

Show code in a code readable form.

// code block example
@media (min-width: 900px) and (max-width: 1219px) {
  .visible-md-inline-block {
    display: inline-block !important;
  }
}
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Documentation and usage: wordpress.org/support/article/code-block


Pullquote block

Use to emphasise some text. Can be also used for important messages.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Pullquote block example

Documentation and usage: wordpress.org/support/article/pullquote-block


Buttons block

Adds button link(s) to the page. There’s plenty of style choices available: solid/outlined, squared/rounded. All with brand colours to choose from. Pay attention to the contrast and warning message will appear when contrast is not sufficieat.

Documentation not available.


Columns block

Create more complex layouts using columns block. Number of predefined widths are available.

Three column block can contain other blocks so you can build complex layout for your pages if you need.

Columns are stacking when displayed on smaller screens. Bear that in mind so it still reads well as a single column.

Documentation and usage: wordpress.org/support/article/columns-block


Media Text block

Element to show image and content side-by-side.

Media text block

Documentation and usage: wordpress.org/support/article/media-text-block


Spacer block (just empty space)

Adds blank space so content can get breathing space.

Documentation and usage: wordpress.org/support/article/spacer-block


Gravity Forms block

Quickly add existing form to the page. Forms are set in Forms menu and after are created can be included on the page using this block type.


Page Break block (adds pagination)

Nothing on the second page – no need to click.

Sections divided here with the Separator block.