Typography

This is a set of examples of the things that you can do with text inside all documents on the site. This is known as semantic markup because you are adding information about what the text means rather than just what you want it to look like. If in the future we want to change the way that one of these forms is presented then this can be done very easily and it will be reflected across the entire site in a single update.

If you don't give the CMS any explicit instructions then the default display of a block of text will be a paragraph, and it will be laid out in the default width for the document that you are entering it into.

This is an h2 and it is the second most important heading after the page title

This is a normal paragraph to give you the spacing below the heading. Vivamus eget elit a orci semper pharetra. Sed mauris lectus, convallis nec, fringilla ut, aliquet eget, orci. Donec ligula lectus, vehicula laoreet, rhoncus ut, blandit vitae, pede. In faucibus mollis justo.

This is a second paragraph to give you a comparison of the spacing between the headings and between the paragraphs as part of the normal flow of test.

This is an h3 and it is the third most important heading.

This is a normal paragraph to give you the spacing below the heading. Vivamus eget elit a orci semper pharetra. Sed mauris lectus, convallis nec, fringilla ut, aliquet eget, orci. Donec ligula lectus, vehicula laoreet, rhoncus ut, blandit vitae, pede. In faucibus mollis justo.

This is a second paragraph to give you a comparison of the spacing between the headings and between the paragraphs as part of the normal flow of test.

This is an h4 and it is the fourth most important heading.

This is a normal paragraph to give you the spacing below the heading. Vivamus eget elit a orci semper pharetra. Sed mauris lectus, convallis nec, fringilla ut, aliquet eget, orci. Donec ligula lectus, vehicula laoreet, rhoncus ut, blandit vitae, pede. In faucibus mollis justo.

This is a second paragraph to give you a comparison of the spacing between the headings and between the paragraphs as part of the normal flow of test.

Font styles

It is easy to add bold text, underlines and italics as required. If you edit this page then you will see the markup used. Also, any URLs such as http://www.fiennes.org get automatically recognised and made active.

Lists

You can set up lists of items to show logical orderings of things:

Unordered lists

Vivamus eget elit a orci semper pharetra. Sed mauris lectus, convallis nec, fringilla ut, aliquet eget, orci. Donec ligula lectus, vehicula laoreet, rhoncus ut, blandit vitae, pede. In faucibus mollis justo.

  • a series of lines
  • prefixed with dashes
  • is recognised as being a bulleted list and marked up accordingly by the system
  • you can...
    • ...increase the number of hyphens to indicate hierarchies
      • like this
  • and reducing the number reduces the indentation

Vivamus eget elit a orci semper pharetra. Sed mauris lectus, convallis nec, fringilla ut, aliquet eget, orci. Donec ligula lectus, vehicula laoreet, rhoncus ut, blandit vitae, pede. In faucibus mollis justo.

Ordered lists

Vivamus eget elit a orci semper pharetra. Sed mauris lectus, convallis nec, fringilla ut, aliquet eget, orci. Donec ligula lectus, vehicula laoreet, rhoncus ut, blandit vitae, pede. In faucibus mollis justo.

  1. if hash symbols (#) are used
  2. instead of dashes
  3. then the list becomes numbered
    1. and increasing the number of hashes
      1. adds increasing levels of numbers,
      2. which start at 1 again
  4. but numbering in higher levels of the list
  5. is preserved when you return to it as you can see

Vivamus eget elit a orci semper pharetra. Sed mauris lectus, convallis nec, fringilla ut, aliquet eget, orci. Donec ligula lectus, vehicula laoreet, rhoncus ut, blandit vitae, pede. In faucibus mollis justo.

Definition lists

A definition list is used to define terms and definitions of the terms.

dog
The dog (Canis lupus familiaris) is a domesticated subspecies of the wolf, a mammal of the Canidae family of the order Carnivora.
cat
The cat (Felis catus), also known as the domestic cat or house cat to distinguish it from other felines, is a small carnivorous species of crepuscular mammal that is often valued by humans for its companionship and its ability to hunt vermin.
goldfish
The goldfish, Carassius auratus, was one of the earliest fish to be domesticated, and is still one of the most commonly kept aquarium fish and water garden fish.
multiple definitions
This is the first definition of this term.
this second definition just starts on a new line with a double colon.
Vivamus eget elit a orci semper pharetra. Sed mauris lectus, convallis nec, fringilla ut, aliquet eget, orci. Donec ligula lectus, vehicula laoreet, rhoncus ut, blandit vitae, pede. In faucibus mollis justo.
This is an exceedingly long term so that we can see how the layout behaves when it is pushed a little bit closed to the limit
Sed mauris lectus, convallis nec, fringilla ut, aliquet eget, orci. Donec ligula lectus, vehicula laoreet, rhoncus ut, blandit vitae, pede. In faucibus mollis justo.
This is an term with no definition
This is a final term
This is a final value

Vivamus eget elit a orci semper pharetra. Sed mauris lectus, convallis nec, fringilla ut, aliquet eget, orci. Donec ligula lectus, vehicula laoreet, rhoncus ut, blandit vitae, pede. In faucibus mollis justo.

Combined lists

Lists can contain lists of other types:

  • Here's a an
  • unnumbered list
    1. with a numbered list contained in it
    2. and then we go back to the
  • unnumbered list

Blockquotes

If a paragraph is actually a quote from somewhere else then preceeding it with "" causes it to be wrapped in a <blockquote> block like so:-

`Twas brillig, and the slithy toves
Did gyre and gimble in the wabe:
All mimsy were the borogoves,
And the mome raths outgrabe.

Vivamus eget elit a orci semper pharetra. Sed mauris lectus, convallis nec, fringilla ut, aliquet eget, orci. Donec ligula lectus, vehicula laoreet, rhoncus ut, blandit vitae, pede. In faucibus mollis justo.