Author: RobynO

  • Headings

    Headings

    Use this post to preview the Heading block and Paragraph block. Each block allows you to set the text alignment, adjust the colour and add text links. You can also add a drop cap and adjust the preset text size.

    Learn more about the Heading block.

    Heading 1

    Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry’s standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.

    Heading 2

    Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry’s standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.

    Heading 3

    Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry’s standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.

    Heading 4

    Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry’s standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.

    Heading 5

    Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry’s standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.

    Heading 6

    Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry’s standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.

  • Cover

    Cover

    The Cover block lets you add text on top of images or videos.

    This is the Cover block.

    The Cover block has a wide and full-width alignment that is useful for creating unique headers and widescreen effects. You can use the content position option to adjust where the text and other content sits on the image.

    If the fixed background option is turned off, you will see the focal point picker. This setting lets you identify the main point of interest in the photo and highlight.

    You can set the minimum height of the cover image (in pixels), guaranteeing it will always be displayed at least as high as you set it, no matter what size screen someone is using to view the page.

    Using the overlay colour options, you can add a colour overlay to the cover image. The slider lets you set the opacity of the cover image’s overlay.

    Learn more about the Cover block.

  • Images

    Images

    Image alignment options include: none, left, right, centre and wide.

    You can also set the image dimensions to 25%, 50%, 75%, 100% or a set width and height.

    Learn more about the Image block.

    Center aligned image with caption

    Left-aligned image

    Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry’s standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.

    Right-aligned image

    Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry’s standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.

    Circle mask

    Below this block, you will see a single image with a circle mask applied.

  • Buttons

    Buttons

    This post include examples of the Button block.

    Check to make sure that the text wraps correctly when a button has more than a few words.

    Learn more about the Button block.

    Default button
    Outline button
    A button with more
    than one line of text

  • Gallery

    Gallery

    Gallery blocks have two layout settings: the number of columns, and whether or not images should be cropped. The default number of columns is three, and the maximum number of columns is eight. You can also add links to images and set the image size.

    Learn more about the Gallery block.

    Three column gallery

    Four column gallery

    Six column gallery

  • Columns

    Columns

    This page displays the Columns block.

    To change the number of columns, select the column block to open the settings panel. You can show up to 6 columns.

    Learn more about the Columns block.

    Two columns

    Column 1

    Column 2

    Three columns with center-aligned text

    Column 1

    Column 2

    Column 3

    Four columns

    Column 1

    Column 2

    Column 3

    Column 4

    Nested blocks

    We can also add blocks inside columns:

    1. This is a numbered list,
    2. inside a 3 column block
    3. with a wide alignment.

    The middle column has a paragraph with an image block below.

    -This third column has a quote

    Theme Reviewer

    Media & Text block

    This is a two-column block that helps you display media and text content next to each other, without having to first set up a column block.

    Media & Text

    A paragraph block sits ready to be used, below your headline.

  • Quotes

    The Quote block has a regular and large style. You can change the colour of the border and the text with the regular style. Text can be aligned, linked and styled bold or italic.

    In addition to the Quote block, there is also the Pullquote block, with a regular and a solid colour style.

    Lean more about the Quote block and the Pullquote block.

    Regular quote

    Gutenberg is more than an editor.

    The WordPress Team

    Large quote

    Yes, it is a press, certainly, but a press from which shall flow in inexhaustible streams, the most abundant and most marvelous liquor that has ever flowed to relieve the thirst of men!

    Johannes Gutenberg

    Pullquote

    In addition to the quote block, we also have the pull quote.

    The WordPress Team

  • Common Content

    Here are common blocks used to create content.

    Paragraph alignment

    This paragraph is left aligned.

    This paragraph is centered.

    This italic paragraph is right aligned.

    Ordered list

    1. The software should be licensed under the GNU Public License.
    2. The software should be freely available to anyone to use for any purpose, and without permission.
    3. The software should be open to modifications.
      1. Any modifications should be freely distributable at no cost and without permission from its creators.
    4. The software should provide a framework for translation to make it globally accessible to speakers of all languages.
    5. The software should provide a framework for extensions so modifications and enhancements can be made without modifying the core code.

    Unordered list

    • One
    • Two
    • Three
      • Four
        • Five

    Typography

    Neither of these paragraphs care about politics, but this one is bold, medium sized and has a drop cap.

    This paragraph prefers Jazz over Justin Timberlake. It also uses the small font size.

    This paragraph has something important to say:  It has a large font size, which defaults to 36px.

    The huge text size defaults to 46px, but the size can be customized.

    Coloured blocks should have a high enough contrast so that the text is readable.

    File downloads

    The File block has a setting that lets us show or hide a download button with editable text:

    File Block PDFPDF
  • Embedded Content

    Embedded Content

    This post has various Embed blocks, including: Twitter, YouTube and WordPress.tv.

    Learn more about the Embed blocks.

    Twitter

    YouTube

    WordPress.tv

  • Spacer

    Spacer

    Our Spacer block allows you to add additional spacing above and below a block.

    You also have the option to add a separator. See examples of the separator styles below.