Content blocks will be used often in pages as they are text content. If you need headings, lists, links and link buttons, embedded style text and images, you'll want to use content blocks. The majority of the content in these tutorials are content blocks.

To use a content block on a page just drag a Content block widget in the desired location of the page and click the edit button to open the content block editor.

Accessibility notes

1. Do not use headings for style. Use the font styling tools for any text you would like to change.
2. Make sure your heading for the entire page are in order and don't skip heading levels when needed to add sub headings. For example all the blue background headings here are level 2 (H2) and the level 3 (H3) as just larger font and bolded. Level 3 heading are only under Level 2 headings and Level 2 headings are all under the page level 1 (H1) headings. For more on this please see https://www.w3.org/WAI/tutorials/page-structure/headings/#heading-ranks.
3. The available fonts are restricted to the background colors chosen. Stick to this pattern and your site will maintain the level of color contrast required to meet accessiblity requirements.

Content samples

Font sizes

Font sizes can be set to a variety of to xsmall fonts to lager banner fonts.

xsmall

small

normal

large

larger

xlarge

xxlarge

small banner

medium banner

Large banner

Font and background colors

Font that are available are based on the back ground setting.

Illini blue

Industrial

altegeld

White

Illini orange

Altegeld

White

Illini orange

Illini blue

White

Storm

Industrial

altegeld

White

Illini orange

Altegeld

Spacing and borders

You can adjust the spacing between (margins) and inside (padding) of elements of any kind in the content block using the spacing options.

Borders can be used to create separation, emphasis, or just break up the color pattern. Use the border options tool to set these.

Links and button links

Links are distinguished with an icon in front labelling giving a visual difference between links and bolded text.

Beckman website

Buttons links are available too. To change the button color use the same color background settings as other text items.

Beckman website

Lists

Numbered lists

1. First
   1. Level 2
      1. Level 3
         1. Level 4
            1. Level 5
2. Second

Bulleted lists

• First
  • Level 2
    • Level 3
      • Level 4
        • Level 5
• Second

Images and videos

Images and videos can be embeded in your content too.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce fringilla risus et velit sodales, vel iaculis nulla varius. Quisque dapibus ultrices ante, nec dictum ligula bibendum id. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nulla ex dui, pellentesque vitae augue sed, rutrum rutrum eros. Suspendisse iaculis enim in ante auctor, sit amet convallis odio facilisis. Mauris id pretium quam. In et blandit arcu. Etiam scelerisque tellus vitae turpis consectetur laoreet. Mauris pharetra pharetra tortor. Morbi felis tortor, luctus ac felis eleifend, vehicula ultrices neque. Aenean vitae massa egestas lorem cursus vestibulum eu et urna.

Nam laoreet ligula neque, ac pulvinar nibh convallis et. Quisque est libero, lacinia quis vulputate vitae, vulputate non nunc. Etiam nulla sapien, consequat eu facilisis sed, posuere sit amet mauris. Morbi maximus bibendum suscipit. Nunc sit amet consequat magna, id suscipit est. Curabitur id facilisis ex, sed porta felis. Pellentesque tempus mattis hendrerit. Morbi vel semper nisl, vel ultricies dui. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Maecenas in diam non quam vehicula lacinia vel et ipsum. Donec vitae augue ut risus ornare finibus.