Tag Archives: CMS Toolbox

The CMS toolbox is your one-stop shop for all CMS features and styles.

Predefined CMS background colors

Note: this documentation only applies to the old CMS template.

There is a predefined set of  element background color classes available for use on CMS webpages. The following colors are available:

  • gold
  • black
  • white
  • gray
  • light-gray
  • steel-blue
  • royal-blue
  • light-blue
  • teal
  • olive-green
  • light-green
  • burgundy
  • crimson
  • tangerine
  • khaki

You may use these colors to style the background color of HTML elements such as paragraphs, divs, and headings. Do so by giving an HTML element a class of the color that you wish to use. Here is an example of each color applied to a paragraph:

<p class=”gold”>This is gold</p>

<p class=”black”>This is black</p>

<p class=”white”>This is white</p>

<p class=”gray”>This is gray</p>

<p class=”light-gray”>This is light-gray</p>

<p class=”steel-blue”>This is steel-blue</p>

<p class=”royal-blue”>This is royal-blue</p>

<p class=”light-blue”>This is light-blue</p>

<p class=”teal”>This is teal</p>

<p class=”olive-green”>This is olive-green</p>

<p class=”light-green”>This is light-green</p>

<p class=”burgundy”>This is burgundy</p>

<p class=”crimson”>This is crimson</p>

<p class=”tangerine”>This is tangerine</p>

<p class=”khaki”>This is khaki</p>

Creating and Managing FAQs

A number of CMS websites take advantage of our Frequently Asked Questions (FAQs) feature: styled, expanding sections of frequently asked questions eloquently organized and displayed to the user. Since your department’s website most likely already has an FAQ section, we will first explain how to maintain yours. We will then explain how to create a new FAQ section from scratch.

Maintaining Your FAQs

Your department’s website may have one or more groups of FAQs on its website. You may want to:

Continue reading

Adding/Modifying Links on Pages/Sidebars

You can add, modify, and remove links in the content area (body copy) or right sidebar on your web page:

  • Add a CMS Link: link to another CMS web page or file (pdf, doc, etc)
  • Add a External Link: link to a page outside the CMS
  • Update/Modify a Link: update or modify a preexisting link
  • Removal of a Link: remove a link from your page

Continue reading

Adding Items to the Right Sidebar (Slotting)

You can add a number of items to the right sidebar. Highlights, images, buttons, and menus are a few options. We are going to concentrate on the most-used item, a Highlight. Highlights are used on a number of CMS websites to display additional information and/or related links. Here are a few sidebar examples:

Right Sidebar with text, bullets, and links
Right Sidebar, list of links

Continue reading

Add/Update Banner Images

Your department’s website is most likely filled with photo banners to liven up its look and feel. Photo banners appear at the top of webpages and include a border around them. We generally make sure each level 1 webpage (main left navigation links) has a full banner. Level 2 webpages (sub-navigation to main left navigation links) may use banners or sub-banners depending on content and preferences. The use of banners and sub-banners varies by department and website section.

Banners come in two sizes: full banners and sub-banners. Full banners span the width of the entire content area of a webpage and go above the right sidebar (if one exists) while sub-banners appear to the left of the right sidebar in the content area. Banners should be no more than 130 pixels tall, so the image does not move your webpage’s content too low on the screen for your users to instantly read.
Continue reading

Formatting the Right Sidebar

This post covers the different formats available to you when slotting items into the Right Sidebar. You have the following styling options:

Note that we have a separate post discussing how to slot items into the right sidebar. There are a number of different format options when slotting a Highlight into a sidebar. We will discuss the main ones: A boxed right sidebar with and without a title, an open right sidebar (box) with and without a title, and a right sidebar spotlight.

You can slot Highlights and Images into the right sidebar. There are two right sidebar slots available for you to use: Right Sidebar Slot – Boxed( 565) and Right Sidebar Slot – No box( 539). Open your Slot Editor for a Generic and you’ll notice these two slots (with or without items slotted):

Empty right sidebar slots
Empty right sidebar slots

Continue reading

Formatting Text in the Right Sidebar

You are able to format the text in your right sidebar Highlights in a number of different styles. We have some suggestions to keep styles consistent across CMS sites and usable for users. Its important that your department’s website achieves consistency whether or not you follow our guidelines.

List of Links

If you would like to display a list of links, we recommend listing the links in an unordered list, hiding the bullets. You may remove indenting and bullets by using a CSS class of “none”. Your code would be similar to this:

<ul class="none">
<li><a href="cmslink">Link 1</a></li>
<li><a href="cmslink">Link 2</a></li>
<li><a href="cmslink">Link 3</a></li>
<li><a href="cmslink">Link 4</a></li>

Continue reading

How to Create an H2 Graybar

A graybar style can be applied to an H2 heading by using the following code in ePhox code view:

<h2 class="graybar">Graybar Heading</h2>

A short graybar will be shown if you are using an H2 heading in the left column or right column of your Generic page. A long graybar will be shown if you are using a heading in the body of a Generic web page. Examples of both follow. “Policies and Procedures” is the first H2 graybar heading. “Resources and Information” is the second H2 graybar heading.

Continue reading