This page contains all of the content styles that you can use to add text, images, video, and other elements to the content area of your page. We’d appreciate it if you would use only the formatting options available in the toolbar to format your pages. This allows us to make global design changes without having to edit each page, when we make changes or add features to the framework. Direct editing of html is available in the tab labeled “Text”, but please check in with us before updating the code directly. Also bear in mind that the “Text” view is filtered by WordPress and not all code will work correctly without some preparation by the dean’s office web team.

This is the “Introduction” style. It’s applied by selecting text and choosing “Introduction” from the Formats menu. We recommend having the first paragraph of your page use this style and serve as a summary of important page content..

The document elements shown below represent the full range of options in the framework. If you need additional options, please let us know before you finish entering content, so we can determine if the new features are possible.

Headings and Document Structure (Heading 2)

To make sure that your page is both accessible and readable, it’s important to use the correct headings. Headings are applied to text by selecting the text and then choosing your heading level in the toolbar dropdown labeled “Formats”. The framework allows 3 levels of headings within the content area, Heading 2 – Heading 4. For accessibility and search engines, heading 1 is always the title of the page and is not available within the content area. If you need additional headings, we can add Heading 5 and 6. Please contact us to enable them.

The heading of this portion of the page is Heading 2 and is the top level of the document’s structure.

Paragraphs (Heading 3)

Heading 3 should be used for sub-items of Heading 2. By the way, what you’re reading right now is a paragraph. To format text as a paragraph, select the text and choose “Paragraph” from the format menu in the toolbar.

Lists (Heading 4)

Research shows that visitors find it easier to read and scan text formatted as a list. WordPress offers two kinds of lists.

  • This is
  • an unordered
  • list.
  1. If your list
  2. has an order,
  3. please use the
  4. numbered list
  5. option in the toolbar.

Images

Images are added using the “Add Media” button above the toolbar. You can select from images already used on the site or upload your own.

Crew team, 1950.
Crew team, 1950

Images can be aligned to the right or left of text or given no alignment. Page content will flow around images when aligned. This image uses the “Medium” image style.

If you want an image to span the full width of the content area, use the “No alignment” option shown when you click on the image. When adding full span images, use the “Large” image size.

Crew team, 1950.
Crew team, 1950

Gould Hall Interior

Thumbnails

You can also use images to build lists of links using the “Thumbnail” size and aligning the image left.

This is a button

UW Campus in 1912

Thumbnails

You can also use images to build lists of links using the “Thumbnail” size and aligning the image left.

This is a button

Galleries

WordPress galleries are added using the “Add Media” button and then selecting “Create Gallery”. Be sure to add content to provide a title and/or introduction for your gallery.

Tables

Tables should only be used for tabular and directory data. In other words, content that is usually contained in rows and columns. Please do not use tables to layout images and text or otherwise format your content. Table-based layouts, while popular in the 1990’s, do not play well with mobile browsers. If we notice table layouts in your site, we will check-in and then remove them from the site. They really are that bad. Also, please avoid formatting or spacing table cell content yourself. Instead, contact us to discuss.

This is a table header, found in Table > Row > Table Row Properties
Please use table headers for heading rows
Otherwise all data goes here

Blockquotes

This is a blockquote. It is used to pull excerpts from page content that summarize or highlight important parts of the text.

Accordians

Back to Top