University Marketing and Communications

Style and Format

Border | Buttons | Font Styles | Headings | Horizontal Rule | Links | Lists | Tables

 Style Guide | Page Design and Layout | Content Widgets |  Image and Multimedia Widgets | Additional Functionality

Border

This is what it looks like with a border around the content.

This is what it looks like with an alert border around the content.

Instructions

Borders are created using the Boxed Sections Even Columns Snippet.

Back to widget index

Buttons

Yellow ButtonBlack ButtonBlank Button

Instructions

You can select the button style from the class dropdown when inserting a link to create a single button or use the List Spread Buttons Snippet to create multiple buttons in a row.

Back to widget index

Font Styles

This is regular paragraph text.

This is "large."

This is "larger."

This is "largest."

This is "small."

This is "smaller."

This is "larger Georgia."

This is "largest Georgia."

Instructions

Use the Styles dropdown in the TinyMCE Editor.

Back to widget index

Headings

In the Body

This is an H2

This is an H3

This is an H4

This is an H5
This is an H6

This is an H2 Top Title

This is an H2 Graybar

Top Title with More Links

View in a Boxed Sidebar

Instructions

Use the Paragraph dropdown in the TinyMCE Editor for basic headings, the H2 Graybar or H2 Top Title Snippets, or the Top Title with More Links Snippet.

Back to widget index

Horizontal Rule

Standard

Back to widget index


Yellow


Dots


Instructions

Use the Styles dropdown in the TinyMCE Editor.

Back to widget index

Yellow Underline

Links will have a yellow underline when within paragraph text in the intro, main, or additional content regions or when the class of "yellow" is applied.

Blue Text

Links will have blue font color when in tables, lists, sliders, Intro Content, and Right Sidebar; when it is an email link; or when the class of "blue" is applied.

Arrow

Links can be specially styled to have an arrow.

Instructions

Links are created with the Insert/edit Link icon in the TinyMCE Editor and styled with the Class dropdown on the Insert/edit Link window .

Back to widget index

Lists

Ordered List

Default

  1. The default ordered list is numbers.
    1. Sub item
    2. Sub item
  2. Like this.
    1. Sub item
    2. Sub item

Lower Alpha

  1. You can also choose lower alpha.
  2. Like this.

Lower Greek

  1. Lower greek is another option.
  2. Like this.

Lower Roman

  1. Another style is lower roman.
  2. Like this.

Upper Alpha

  1. Upper alpha is available.
  2. Like this.

Upper Roman

  1. The final style is upper roman.
  2. Like this.

Unordered List

Default

  • The default unordered list is disc.
    • Sub item
    • Sub item
    • Sub item
  • Like this.
    • Sub item
    • Sub item
    • Sub item

Circle

  • You can also choose circle.
  • Like this.

Square

  • Square is another option.
  • Like this.

Classes

nobullets

  • Adding a class of nobullets
  • removes the bullets, but keeps the indentation.

none

  • Adding a class of none
  • removes the bullets and the indentation.
  • This is used for lists of links in the sidebar, among other things.

Instructions

Use the Bullet List and Numbered List icons in the TinyMCE Editor.

Back to widget index

Tables

No Stripe or Border

Footer
Caption
Column 1 Heading Column 2 Heading
This is the first row of content. Normal cell content
Another Row
  • List item 1
  • List item 2
  • List item 3
Here is some content. Here is a link
Sentence containing awesome content. A little bit more content.
Sentence containing awesome content. A little bit more content.

Auto Stripe

Footer
Caption
Column 1 Heading Column 2 Heading
Sentence containing awesome content. Normal cell content
Sentence containing awesome content. A little bit more content.
Sentence containing awesome content. A little bit more content.
Spacer Row
Sentence containing awesome content. A little bit more content.
Sentence containing awesome content. A little bit more content.

Manual Stripe

Footer
Caption
Column 1 Heading Column 2 Heading
Here is a cell. Normal cell content in an "alt" row.
Some more content here. Normal cell content.
Spacer Row

Sortable

Footer
Caption
Column 1 Heading Column 2 Heading
Row 1 Normal cell content
Row 2 more cell content
Row 3 cell content

Lines

Footer
Caption
Column 1 Heading Column 2 Heading
Row Normal cell content
Sentence containing awesome content. A little bit more content.
Sentence containing awesome content. A little bit more content.
Spacer Row

Borders On

Footer
Caption
Column 1 Heading Column 2 Heading
Row Normal cell content
Sentence containing awesome content. A little bit more content.
Sentence containing awesome content. A little bit more content.

Instructions

Tables are created and styled using the Table menu in the editor.

Back to widget index