Help Home

Tutorial

  1. Introduction
  2. Creating Your First Page
  3. Editing Textile Content
  4. Adding an image
  5. Using Snippets
  6. Using Layouts
  7. Using the Faculty Extension

Tutorial #3: Using Textile

Let’s jump right into some textile editing. Go ahead and try each of these out with your test page that you created.

Text

  1. If you closed your test page, go ahead and open it now to edit it. In a separate browser window, open up the page for viewing. Remember that the URL for your page will be <server>/test-area/your-page-name.
  2. Change your “Hello World!” to *Hello* _World_.
  3. Hit the Save and Continue Editing button and refresh the page in your other browser window.

You’ll see now that your previous “Hello World” has changed into “Hello World”. All you had to do was put the “*” or “_” around your text, and it got converted into bold or italics.

That was pretty easy! In fact, it’s probably even faster than going up to a menu choosing font -> bold. It is also pretty intuitive – often asterisks or underlines are used for emphasis anyway. After editing a few pages it becomes second nature and you’ll wish your word processor supported it.

Here are some other things you can do with text. Feel free to experiment.

Strikethrough: -Hello World- becomes Hello World

Superscripts: Hello^World^ becomes HelloWorld

Subscripts: Hello~World~ becomes HelloWorld

Code or quotes: @Hello World@ becomes Hello World

Underlining: You’ll note that there is no underline option. There is a good reason for this. It is considered bad form to use underlines in online content because they look like links.

Symbols and greek letters: Scientific writing is full of symbols and greek letters. Symbols begin with an ampersand, followed by a symbol identifier, and then a semicolon. For example, the greek letter λ would be created using &lambda;. You can create arrows, logical symbols, and uppercase and lowercase greek letters this way. A complete reference for symbols can be found here.

But I want more… You normally won’t need to do this, but if you need to get fancy, you can insert some CSS. Just email your favorite computer geek and say, “how do I make text red with a black border using CSS?” Then insert his or her reply into curly braces as follows. This allows you to do almost anything with your text:

%{color:red; border: solid black 1px;}Hello World% becomes Hello World

Headings

Paragraph headings are created with the letter “h” followed by a heading level, followed by a period, then a space. The space is important.

h1. Hello World becomes:

Hello World

h2. Hello World becomes:

Hello World

h3. Hello World becomes:

Hello World

Lists

Numbered and bulleted lists are common in documents and on the web. Creating these is easy.

Bulleted Lists

To create a bulleted list, just put an asterisk and a space in front of each line, like the following:

* one
* two
* three

becomes

  • one
  • two
  • three

Go ahead and try it on your test page!

Numbered Lists

To create a number list, do the same thing with the pound sign. The numbers get added automatically.

# one
# two
# three

becomes

  1. one
  2. two
  3. three

Nesting Lists in Multiple Levels

You can nest both bulleted and numbered lists. To do this, just double or triple the asterisk or pound sign, as follows:

# one
# two
## alpha
## beta
## gamma
# three

becomes

  1. one
  2. two
    1. alpha
    2. beta
    3. gamma
  3. three

Links

To create a link to a page, put the text of the link in quotes, followed by a colon, then the URL, as in the following:

"link to google":http://www.google.com becomes link to google

You can do the same for links to pages within this content management system. In that case, you just begin with the slash, followed by the hierarchy of pages you want to link to. Some examples:

"link to home page":/ becomes link to home page

"link to faculty page":/faculty becomes link to faculty page

Images

To insert an image, put exclamation points around the URL for the image:

!http://www.google.com/intl/en_ALL/images/logo.gif! becomes

Escaping Textile

There are occasions when you need to actually use the Textile Syntax in your document. This help page is a good example. It is written in Textile. So how do I show *how to make bold text* without it looking like how to make bold text?

The answer is that you put it inside a <notextile> tag, as follows:

<notextile>*Hello World*</notextile> becomes *Hello World*

And finally…

Here are some more resources for editing Textile content:

When you are editing a page, there is a Filter reference link above the editing area. You can use this as a quick reference for Textile.

Here is a nifty page where you can rapidly experiment with Textile content. Enter your text in the top area, and it will show the HTML generated, as well as a preview below it.