Headings

Headings convey a hierarchy of information on the page. They structure the document like an outline. Heading 1 is the most important or general and Heading 6 is the least important or most specific. Leave a blank line after every heading.

Textile

h1. This is a Heading 1

This might be an introductory paragraph on the general topic.

h2. Heading 2 gets more specific

Now we're getting into the details.

HTML

<h1>This is a Heading 1</h1>
<p>This might be an introductory paragraph on the general topic.</p>
<h2>Heading 2 gets more specific</h2>
<p>Now we&#8217;re getting into the details.</p>

Browser

This is a Heading 1

This might be an introductory paragraph on the general topic.

Heading 2 gets more specific

Now we’re getting into the details.

Block quotations

Block quotations designate long quotations where a paragraph break is appropriate. It ends with a blank line.

Textile

Even Mr. Sedaris, a noted luddite, has finally succumbed to doing his writing on a computer.  The Internet, however, remains an idiotic trifle:

bq. I've never seen the Internet. I don't have email. I just enjoy lying on the couch and reading a magazine. When people say, "You should visit my Web page," I'm always perplexed by it. Why? What do you do there?

Haven't we all pondered that at one time or another?

HTML

<p>Even Mr. Sedaris, a noted luddite, has finally succumbed to doing his writing on a computer.  The Internet, however, remains an idiotic trifle:</p>
<blockquote>
<p>I&#8217;ve never seen the Internet. I don&#8217;t have email. I just enjoy lying on the couch and reading a magazine. When people say, &#8220;You should visit my Web page,&#8221; I&#8217;m always perplexed by it. Why? What do you do there?</p>
</blockquote>
<p>Haven&#8217;t we all pondered that at one time or another?</p>

Browser

Even Mr. Sedaris, a noted luddite, has finally succumbed to doing his writing on a computer. The Internet, however, remains an idiotic trifle:

I’ve never seen the Internet. I don’t have email. I just enjoy lying on the couch and reading a magazine. When people say, “You should visit my Web page,” I’m always perplexed by it. Why? What do you do there?

Haven’t we all pondered that at one time or another?

Citing block quotations

Block quotations may include a citation URL immediately following the period.

Textile

A standard Lorem Ipsum passage has been used since the 1500s:

bq.:http://www.lipsum.com/ Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

HTML

<p>A standard Lorem Ipsum passage has been used since the 1500s:</p>
<blockquote cite="http://www.lipsum.com/">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
</blockquote>

Browser

A standard Lorem Ipsum passage has been used since the 1500s:

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Extended block quotations

If your block quotation needs to go on for more than one paragraph, use two periods. The block quotation ends when a paragraph of a different type (such as an explicit paragraph or a header) is encountered.

Textile

bq.. This is one paragraph.

Another paragraph, also part of the quote.

p. A normal paragraph ends the quote.

HTML

<blockquote>
<p>This is one paragraph.</p>
<p>Another paragraph, also part of the quote.</p>
</blockquote>
<p>A normal paragraph ends the quote.</p>

Browser

This is one paragraph.

Another paragraph, also part of the quote.

A normal paragraph ends the quote.

Bullet lists

Make a bullet list with asterisks. Use more asterisks to make nested lists.

Textile

Textile has several advantages over HTML:

* It's easier on the eyes
* You don't have to write all those HTML tags
** By not writing the tags yourself, you're less likely to make coding mistakes
** It requires fewer keystrokes
*** You don't wear out the keys on your keyboard as fast
*** You won't wear out your fingers as fast
* You can write it much quicker

HTML

<p>Textile has several advantages over <span class="caps">HTML</span>:</p>
<ul>
	<li>It&#8217;s easier on the eyes</li>
	<li>You don&#8217;t have to write all those <span class="caps">HTML</span> tags
	<ul>
		<li>By not writing the tags yourself, you&#8217;re less likely to make coding mistakes</li>
		<li>It requires fewer keystrokes
		<ul>
			<li>You don&#8217;t wear out the keys on your keyboard as fast</li>
			<li>You won&#8217;t wear out your fingers as fast</li>
		</ul></li>
	</ul></li>
	<li>You can write it much quicker</li>
</ul>

Browser

Textile has several advantages over HTML:

It’s easier on the eyes
You don’t have to write all those HTML tags
- By not writing the tags yourself, you’re less likely to make coding mistakes
- It requires fewer keystrokes
  - You don’t wear out the keys on your keyboard as fast
  - You won’t wear out your fingers as fast
You can write it much quicker

Numbered lists

Start each item in your numbered list with a number sign. For nested lists, use more number signs.

Textile

How to make a PB&J:

# Gather bread, peanut butter, and jelly
# Slice the bread if necessary
# Assemble the sandwich
## Spread peanut butter on one slice of bread
## Put jelly on another slice
## Put the two slices together
# Enjoy

HTML

<p>How to make a PB&amp;J:</p>
<ol>
	<li>Gather bread, peanut butter, and jelly</li>
	<li>Slice the bread if necessary</li>
	<li>Assemble the sandwich
	<ol>
		<li>Spread peanut butter on one slice of bread</li>
		<li>Put jelly on another slice</li>
		<li>Put the two slices together</li>
	</ol></li>
	<li>Enjoy</li>
</ol>

Browser

How to make a PB&J:

Gather bread, peanut butter, and jelly
Slice the bread if necessary
Assemble the sandwich
1. Spread peanut butter on one slice of bread
2. Put jelly on another slice
3. Put the two slices together
Enjoy

Mixed nested lists

You can nest ordered lists inside unordered lists and vice-versa.

Textile

Three reasons to walk to work:

# It saves fuel
# It's good for your health
** Walking burns calories
** Time outside means lower stress
# It's good for the environment

HTML

<p>Three reasons to walk to work:</p>
<ol>
	<li>It saves fuel</li>
	<li>It&#8217;s good for your health
	<ul>
		<li>Walking burns calories</li>
		<li>Time outside means lower stress</li>
	</ul></li>
	<li>It&#8217;s good for the environment</li>
</ol>

Browser

Three reasons to walk to work:

It saves fuel
It’s good for your health
- Walking burns calories
- Time outside means lower stress
It’s good for the environment

Definition lists

Each term in a definition list starts with a dash. Put a := between the term and the definition. If your definition spans multiple lines, end the definition with =:

Textile

- coffee := Hot and black
- tea := Also hot, but a little less black
- milk :=
Nourishing beverage for baby cows.

Cold drink that goes great with cookies. =:

HTML

<dl>
	<dt>coffee</dt>
	<dd>Hot and black</dd>
	<dt>tea</dt>
	<dd>Also hot, but a little less black</dd>
	<dt>milk</dt>
	<dd><p>Nourishing beverage for baby cows.</p>
<p>Cold drink that goes great with cookies.</p></dd>
</dl>

Browser

coffee

Hot and black

tea

Also hot, but a little less black

milk

Nourishing beverage for baby cows.

Cold drink that goes great with cookies.

Footnotes

To reference a footnote, place the footnote number in square brackets. Don’t forget the corresponding footnote at the bottom of the page.

Textile

42.7% of all statistics are made up on the spot.[1]

fn1. "Dr. Katz":http://en.wikiquote.org/wiki/Steven_Wright

HTML

<p>42.7% of all statistics are made up on the spot.<sup class="footnote" id="fnr1"><a href="#fn1">1</a></sup></p>
<p class="footnote" id="fn1"><a href="#fnr1"><sup>1</sup></a> <a href="http://en.wikiquote.org/wiki/Steven_Wright">Dr. Katz</a></p>

Browser

42.7% of all statistics are made up on the spot.¹

¹ Dr. Katz

Tables

Simple tables are made by separating each cell with vertical pipes. Begin the cell with _. to indicate the cell is a heading.

Textile

|_. name|_. age|
|Walter|5|
|Florence|6|

HTML

<table>
	<tr>
		<th>name</th>
		<th>age</th>
	</tr>
	<tr>
		<td>Walter</td>
		<td>5</td>
	</tr>
	<tr>
		<td>Florence</td>
		<td>6</td>
	</tr>
</table>

Browser

name	age
Walter	5
Florence	6

Table cell attributes

You can make a table cell span rows or columns with a slash or backslash and the number to span. Classes, IDs, style, and alignment are also possible on table cells as with other elements.

Textile

|{background:#ddd}. Cell with background|Normal|
|\2. Cell spanning 2 columns|
|/2. Cell spanning 2 rows|one|
|two|
|>. Right-aligned cell|<. Left-aligned cell|

HTML

<table>
	<tr>
		<td style="background:#ddd;">Cell with background</td>
		<td>Normal</td>
	</tr>
	<tr>
		<td colspan="2">Cell spanning 2 columns</td>
	</tr>
	<tr>
		<td rowspan="2">Cell spanning 2 rows</td>
		<td>one</td>
	</tr>
	<tr>
		<td>two</td>
	</tr>
	<tr>
		<td style="text-align:right;">Right-aligned cell</td>
		<td style="text-align:left;">Left-aligned cell</td>
	</tr>
</table>

Browser

Cell with background	Normal
Cell spanning 2 columns
Cell spanning 2 rows	one
Cell spanning 2 rows	two
Right-aligned cell	Left-aligned cell

Table attributes

To apply attributes to the entire table, use the table. signature on a line by itself before the table data.

Textile

table(#prices).
|Adults|$5|
|Children|$2|

HTML

<table id="prices">
	<tr>
		<td>Adults</td>
		<td>$5</td>
	</tr>
	<tr>
		<td>Children</td>
		<td>$2</td>
	</tr>
</table>

Browser

Adults	$5
Children	$2

Divisions

DIV tags are used to define a division or section in an HTML document. It has no inherent meaning, but is often used by designers and developers to group or style part of a page differently than another. You can easily create a div with Textile but most people who need a div just use HTML tags in their Textile.

Textile

div. A simple div.

HTML

<div>A simple div.</div>

Browser

A simple div.

Page Layout

Headings

This is a Heading 1

Heading 2 gets more specific

Block quotations

Citing block quotations

Extended block quotations

Bullet lists

Numbered lists

Mixed nested lists

Definition lists

Footnotes

Tables

Table cell attributes

Table attributes

Divisions