SERC > SERC Content Management System > CMS Tags Basics

# CMS Tags Basics

Let's start with tags that indicate the overall structure of blocks of text.

- <p> and </p> start and end a paragraph.
- <br> forces a single line break, while <br clear> makes a line break that forces text to be below any preceeding material (useful for keeping text below, rather than next to, a narrow image).
- <hr> makes a thin horizontal line: a horizontal 'rule'. Often overused on websites so show some discretion
- <ul> marks the start of an unordered (bulleted) list, with </ul> marking the end. In turn each item in the list should be surrounded with a <li> and </li>
- <ol> and </ol> work similarly creating an ordered list with the items automatically numbered. Again each item in the list must start with <li> and end with </li>. Multiple lists can be nested within each other and will automatically be appropriately indented. To get different numbering schemes for different levels of indentation you can use the variant <ol lower-alpha> which will give you lower case alphabetic labels. Other variants available are: upper-alpha, lower-roman abd upper-roman.
- One can also create a definition list with series of terms and definitions. Surround the entire list with <dl> </dl> tags. Each term/definition pair should be surrounded by <dt> </dt> tags and each definition by <dd> </dd> tags.
- The [pullquote] tag indicates the beginning of an extended 'aside' (providing useful information outside the normal flow of the text). The aside should be ended with a [end pullquote] tag. Note that this is not a standard html tag as reinforced by the use of square brackets rather than <>. This is just the first of several tags specific to the SERC CMS. Note that [context] gives exactly the same results as [pullquote].
- Similarly [bigfirstline] can be used in place of a paragraph tag to cause the first line of the following text to be extra large--a handy visual effect for drawing folks into the start of a long stretch of text. As you might guess the paragraph you start this way should be ended with a [end bigfirstline]

Now let's look at some tags which are used on short snippets of text:

- The <h1> (and it's partner the </h1>) is the first in a series of tags which surround headings. <h1> is the top-most heading (e.g. the title of a page), which the others are used on headings of declining prominence:<h2>, <h3>, <h4>.
- The <strong> and <em> tags place strong or weak emphasis on a bit of text (normally indicated by bolding or italicizing the text). As expected the emphasized text should be ended with an appropriate </strong> or </em> tag.
- Superscripts and subscripts can be obtained by using the <sup> or <sub> tag to start and the </sup> or </sub> tag to finish.
- If you need a special character like a ° or a ± you'll need to look up the cryptically named 'character entity code' in a table like this. Use the decimal code you find in this table in a tag like this [entity 177] to get the ± sign. A more complete but more cryptic list is also available.
- You can make very small text (for captions and the like) with [small] and [end small] tags Or slightly larger text with [mediumsmall].

« Previous Page Next Page »