Block Designer Themes

A Block Designer Theme is a saved set of Block Designer configurations that you can apply to any block. Modifying the theme will affect all blocks that have that theme applied. Site owners and site editors with the configuration manager add-on role may create and edit lock designer themes.

From the Block Designer Themes page you may:

  1. Add a Block Designer Theme.
  2. View a Block Designer Usage List (See where themes are used).
  3. Preview Block Designer Themes (See a preview of how themes appear).
1

Create a Block Designer Theme

  1. Go to the Express toolbar and select Design.
  2. Select the Block Designer Themes tab.

    Block Designer Themes tab
  3. Click Add a Block Designer Theme.
  4. Name: name your theme.

Block Designer Theme options:

  • Icon Settings for each block individually (position, color, and size)
  • Block Heading style and alignment
  • Block Style (color of the block)
  • Block Typography (scale the font size on the title and content in a block)
  • Menu Blocks style settings (these apply to to Menu Blocks only)

Block designer theme options

2

Icon Settings

If the block has an icon, you may configure basic displays such as position, color and size. You will need to choose and add icons on individual blocks.

  1. Position: Inline, Offset or Top.
  2. Icon Color: Gray, Gold, Blue, Green, Orange, Purple, Red or Yellow.
  3. Icon Size: Default or Increase.

Icon settings

3

Block Heading

  1. Heading: this is used to put your content in the proper reading hierarchy on the page the block will be placed, not to change the font size. Always make sure the page content is structured properly for accessibility.
    1. The default block title is a heading 2. 
    2. Strong will be a bold heading 2.
  2. Heading Alignment: Left or Centered.
  3. Heading Style: choose a style – Hero, Hero Bold, Supersize and Supersize Bold.

Block heading

4

Block Style

You have the option to change the block background color or add an outline or underline to the block. 

Style options: None, White, Light Gray, Dark Gray, Tan, Light Blue, Outline and Underline.

Block style

5

Block Typography

  1. Block Title Font Scale: use this to increase or decrease the size of the heading.
  2. Block Content Font Scale: use this to increase or decrease the size of the content text.

Block typography

6

Menu Blocks

Menu Blocks may also have a style applied. This setting only applied to menu blocks. 

Style Options: Default/Underline, Arrow or No Decoration.

7

Save Theme

Click Save to save the theme settings.

Related Articles