Compiled by Commons Project
View Scott Zak*'s profile

Typography

The effective visibility for this content is 'public' (anyone, anywhere can view).
  • It is visible to the content author.
  • It is viewable by members of Commons Project.
  • The author has explicitly defined its visibility as public.

Visibility

The effective visibility for this content is 'public' (anyone, anywhere can view).
  • It is visible to the content author.
  • It is viewable by members of Commons Project.
  • The author has explicitly defined its visibility as public.

Group Edit

Any member of the group(s) containing this item may edit it.

Comments disallowed

Users are not allowed to post any more comments on the item.

This post contains type examples to illustrate text editing styles supported by the editor.  Examples are padded with lorem ipsum placeholder text to provide additional visual context.

Heading styles may be selected from the style dropdown at the far-left of the editor toolbar.

This is Heading #1 Style

This is Heading #2 Style
This is Heading #3 Style

 

Normal Text

This paragraph is an example of normal text with character styles (bold, italic, strikethrough, links). In accordance with modern web typography, there is only one space after sentence-ending punctuation.  This is bold text (html strong). Lobortis massa imperdiet quam. This is an example of italicized text (html em). The following text has been struck (html s tag): tincidunt non, euismod vitae, posuere imperdiet, leo. Nullam accumsan lorem in dui. This is an example of a link to another web page.  All options are available through the button bar at the top.

This is an example of normal text that has been indented. Curabitur suscipit suscipit tellus. Mauris sollicitudin fermentum libero.

NOTE: To return to normal text style after applying another style, select the Normal style from the dropdown list.

List Styles: Numbering and Bullets

The paragraphs below are examples of numbered text.  The editor supports three levels of numbering.

Numbered Text
  1. Numbered text: Level 1. Sed libero. Nam adipiscing. Donec venenatis vulputate lorem. Ut tincidunt tincidunt erat. Fusce pharetra convallis urna. Praesent egestas tristique nibh. Sed lectus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.
  2. Sed hendrerit. Vestibulum eu odio. Sed cursus turpis vitae tortor. Etiam feugiat lorem non metus. Proin pretium, leo ac pellentesque mollis, felis nunc ultrices eros, sed gravida augue augue mollis justo.
    1. Numbered text: Level 2. Aenean imperdiet. Vestibulum facilisis, purus nec pulvinar iaculis, ligula mi congue nunc, vitae euismod ligula urna in dolor. Vestibulum fringilla pede sit amet augue.
    2. Phasellus a est. Nulla neque dolor, sagittis eget, iaculis quis, molestie non, velit.
      1. Numbered text Level 3. Phasellus gravida semper nisi. Nulla facilisi.
      2. Mauris turpis nunc, blandit et, volutpat molestie, porta ut, ligula. Praesent nec nisl a purus blandit viverra. Suspendisse nisl elit, rhoncus eget, elementum ac, condimentum eget, diam.
Bulleted Text

The paragraphs below are examples of bulleted text..

  • Bulleted Text: Phasellus leo dolor, tempus non, auctor et, hendrerit quis, nisi. Aenean posuere, tortor sed cursus feugiat, nunc augue blandit nunc, eu sollicitudin urna dolor sagittis lacus. Morbi nec metus. Sed mollis, eros et ultrices tempus, mauris ipsum aliquam libero, non adipiscing dolor urna a orci. Aenean imperdiet.
  • Pellentesque commodo eros a enim. Sed lectus. Fusce egestas elit eget lorem. Vestibulum fringilla pede sit amet augue. Pellentesque auctor neque nec urna.
  • Vestibulum purus quam, scelerisque ut, mollis sed, nonummy id, metus. Aliquam erat volutpat. Vivamus consectetuer hendrerit lacus. Nunc nec neque. Nullam cursus lacinia erat.
  • Morbi mollis tellus ac sapien. Aliquam eu nunc. Praesent adipiscing. Aenean tellus metus, bibendum sed, posuere ac, mattis non, nunc. Ut leo.

Block Text Emphasis

Block quotes

There are several ways that blocks of text can be emphasized to denote highlights for attention, block quotations, and computer-generated text.

The next two paragraphs are blockquoted (html blockquote).  To blockquote a paragraph, place your cursor anywhere in the paragraph and click the blockquote button on the toolbar. Praesent nec nisl a purus blandit viverra.

Fusce vulputate eleifend sapien. Aliquam lobortis. Aenean commodo ligula eget dolor. Phasellus viverra nulla ut metus varius laoreet. Vestibulum fringilla pede sit amet augue.

Highlight boxes

This is a blue highlight box. Highlight boxes come in three colors and can be used to highlight paragraphs. They can be used with indentation or in lists, but generally, they look best with full-width text and blockquotes as the box borders tend to break the visual line of sequential indented paragraphs or formal lists (bullets or numbers).

This is a pink highlight box. Highlight boxes come in three colors and can be used to highlight paragraphs. They can be used with indentation or in lists, but generally, they look best with full-width text and blockquotes as the box borders tend to break the visual line of sequential indented paragraphs or formal lists (bullets or numbers).

This is a yellow highlight box. Highlight boxes come in three colors and can be used to highlight paragraphs. They can be used with indentation or in lists, but generally, they look best with full-width text and blockquotes as the box borders tend to break the visual line of sequential indented paragraphs or formal lists (bullets or numbers).

Monospaced (Code Text)
This text uses the code block style (html pre tag), and presents an old-fashioned monospaced font.  It is commonly used to show computer commands and output where text is aligned by adding space characters.  It is of limited value outside a technical context, but it is available to everyone.
Links, Images and Tables

See the specific user manual page for more information on using more advanced features of the editor.