Block Designer

The Block Designer is a quick and easy way to design and change the display properties of a block. You can select from configured themes that you can create, or select only the properties that you want to change.

Note: A Block Designer Theme is a saved set of Block Designer configurations that you can apply to any block.


Use Block Designer

  1. Click on the gear icon. Look for the gear icon by hovering your mouse over the top right corner of a block.
  2. Select Block Designer. This will open up the block designer tool for the block. You may either choose a block theme or apply custom settings to a block

Select Block Designer


Choose Block Theme

Create a Block Designer Theme instead of creating custom settings if you would like to apply the same settings to multiple blocks.

  1. Choose a pre-configured theme by selecting from the Theme drop-down.

Apply Custom Settings

  1. Icon: choose a block title icon.
  2. Block Designer Settings
    1. Icon Settings: position, color, and size.

      Icon settings
    2. Block Heading: heading style and alignment. This setting should be used to put your content in the proper reading hierarchy, not to change the font size of the title. Always make sure the page content is structured properly for accessibility.

      Block Heading
    3. Block Style: color of the block background.

      Block Style
    4. Block Typography: to scale the font size on the title and content in a block.

      Block Typography
  3. Click Save.