-- limodou [2004-09-13 00:41:19]

1. PyTextile 使用说明

这是用Textile自身来生成的,很有趣。张贴时还没有中文的文档,希望尽快翻译完成。

1.1. This is Textile

To get an overview of all PyTextile’s features, simply type ‘tell me about textile.’ in a single line.

1.1.1. Blocks

Textile process your text by dividing it in blocks. Each block is identified by a signature and separated from other blocks by an empty line.

All signatures should end with a period followed by a space. A header <h1></h1> can be done this way:

h1. This is a header 1.

Blocks may continue for multiple paragraphs of text. If you want a block signature to stay “active”, use two periods after the signature instead of one. For example:

bq.. This is paragraph one of a block quote.

This is paragraph two of a block quote.

=p. Now we're back to a regular paragraph.

Becomes:

<blockquote> <p>This is paragraph one of a block quote.</p>

<p>This is paragraph two of a block quote.</p> </blockquote>

<p>Now we’re back to a regular paragraph.</p>

The blocks can be customised by adding parameters between the signature and the period. These include:

{style rule}

  • A CSS style rule.

[ll]

  • A language identifier (for a “lang” attribute).

(class) or (#id) or (class#id)

  • For CSS class and id attributes.

>, <, =, <>

  • Modifier characters for alignment. Right-justification, left-justification, centered, and full-justification. The paragraph will also receive the class names “right”, “left”, “center” and “justify”, respectively.

( (one or more)

  • Adds padding on the left. 1em per ”(” character is applied. When combined with the align-left or align-right modifier, it makes the block float.

) (one or more)

  • Adds padding on the right. 1em per ”)” character is applied. When combined with the align-left or align-right modifier, it makes the block float.

Here’s an overloaded example:

p(())>(class#id)[en]{color:red}. A simple paragraph.

Becomes:

<p lang="en" style="color:red;padding-left:2em;padding-right:2em;float:right;" class="class right" id="id">A simple paragraph.</p>

1.1.2. Paragraph

This is how you write a paragraph:

p. This is a paragraph, although a short one.

Since the paragraph is the default block, you can safely omit its signature (p). Simply write:

This is a paragraph, although a short one.

Text in a paragraph block is wrapped in <p></p> tags, and newlines receive a tag. In both cases Textile will process the text to:

<p>This is a paragraph, although a short one.</p>

Text in a paragraph block is processed with all the inline rules.

1.1.3. Pre-formatted text

Pre-formatted text can be specified using the pre signature. Inside a “pre” block, whitespace is preserved and < and > are translated into HTML entities automatically.

Text in a “pre” block is not processed with any inline rule.

Here’s a simple example:

pre. This text is pre-formatted. Nothing interesting happens inside here...

Will become:

<pre> This text is pre-formatted. Nothing interesting happens inside here... </pre>

1.1.4. Block code

A block code, specified by the bc signature, is a block of pre-formatted text which also receives a <code></code> tag. As with “pre”, whitespace is preserved and < and > are translated into HTML entities automatically.

Text in a “bc” code is not processed with the inline rules.

If you have Twisted installed, Textile can automatically colorize your Python code if you specify its language as “Python”:

bc[python]. from twisted.python import htmlizer

This will become:

<pre> <code lang="python"> <span class="py-src-keyword">from</span> <span class="py-src-variable">twisted</span><span class="py-src-op">.</span><span class="py-src-variable">python</span> <span class="py-src-keyword">import</span> <span class="py-src-variable">htmlizer</span> </code> </pre>

The colors can be specified in your CSS file. If you don’t want to install Twisted, you can download just the htmlizer module independently.

1.1.5. Blockquote

A blockquote is denoted by the signature bq. The text in this block will be enclosed in <blockquote></blockquote> and <p></p>, receiving the same formatting as a paragraph. For example:

bq. This is a blockquote.

Becomes:

<blockquote> <p>This is a blockquote.</p> </blockquote>

You can optionally specify the cite attribute of the blockquote, using the following syntax:

bq.:http://example.com Some text.

bq.:"John Doe" Some other text.

Becomes:

<blockquote cite="http://example.com"> <p>Some text.</p> </blockquote>

<blockquote cite="John Doe"> <p>Some other text.</p> </blockquote>

You can also specify the cite using a pair of dashes on the last line of the blockquote:

bq. Some text. -- http://example.com

1.1.6. Definition list

A definition list starts with the signature dl, and has its items separated by a :. Here’s a simple example:

dl. name:Sir Lancelot of Camelot. quest:To seek the Holy Grail. color:Blue.

Becomes:

<dl> <dt>name</dt> <dd>Sir Lancelot of Camelot.</dd> <dt>quest</dt> <dd>To seek the Holy Grail.</dd> <dt>color</dt> <dd>Blue.</dd> </dl>

1.1.7. Header

A header is produced by the signature hn, where n goes from 1 to 6. You can adjust the relative output of the headers passing a head_offset attribute when calling textile().

To make a header:

h1. This is a header.

Becomes:

<h1>This is a header.</h1>

1.1.8. Footnote

A footnote is produced by the signature fn followed by a number. Footnotes are paragraphs of a special CSS class. An example:

fn1. This is footnote number one.

Will produce this:

<p class="footnote" id="fn1"><sup>1</sup> This is footnote number one.</p>

This footnote can be referenced anywhere on the text by the following way:

This is a reference[1] to footnote number one.

Which becomes:

<p>This is a reference<sup class="footnote"><a href="#fn1" title="This is footnote number one.">1</a></sup> to footnote number 1.</p>

Note that the text from the footnote appears in the title of the link pointing to it.

1.1.9. Escaping

If you don’t want Textile processing a block, you can simply enclose it inside ==:

p. Regular paragraph

== Escaped portion -- will not be formatted by Textile at all ==

p. Back to normal.

This can also be used inline, disabling the formatting temporarily:

p. This is ==*a test*== of escaping.

1.1.10. itex

Textile can automatically convert itex code to MathML for you, if you have the itex2MML binary (you can download it from the Movable Type plugin).

Block equations should be enclosed inbetween \[ and \]:

\[ e^{i\pi} + 1 = 0 \]

Will be translated to:

<math xmlns='http://www.w3.org/1998/Math/MathML' mode='display'> <msup><mi>e</mi> <mrow><mi>i</mi> <mi>π</mi></mrow></msup> <mo>+</mo><mn>1</mn><mo>=</mo><mn>0</mn> </math>

Equations can also be displayed inline:

Euler's formula, $e^{i\pi}+1=0$, ...

(Note that if you want to display MathML your content must be served as application/xhtml+xml, which is not accepted by all browsers.)

1.1.11. Ordered lists

Ordered lists can be constructed this way:

# Item number 1. # Item number 2. # Item number 3.

And you get:

<ol> <li>Item number 1.</li> <li>Item number 2.</li> <li>Item number 3.</li> </ol>

If you want a list to “break” an extended block, you should add a period after the hash. This is useful for writing Python code:

bc[python].. #!/usr/bin/env python

# This is a comment, not an ordered list! # So this won't break the extended "bc".

Lists can be nested:

# Item number 1.

# Item number 2.

Textile will transform this to:

<ol> <li>Item number 1. <ol> <li>Item number 1a.</li> <li>Item number 1b.</li> </ol> </li> <li>Item number 2. <ol> <li>Item number 2a.</li> </ol> </li> </ol>

You can also mix ordered and unordered lists:

* To write well you need: *# to read every day *# to write every day *# and X

You’ll get this:

<ul> <li>To write well you need: <ol> <li>to read every day</li> <li>to write every day</li> <li>and X</li> </ol> </li> </ul>

To style a list, the parameters should go before the hash if you want to set the attributes on the <ol> tag:

(class#id)# one # two # three

If you want to customize the firsr <li> tag, apply the parameters after the hash:

#(class#id) one # two # three

1.1.12. Unordered lists

Unordered lists behave exactly like the ordered lists, and are defined using a star:

* Python * Perl * PHP

Becomes:

<ul> <li>Python</li> <li>Perl</li> <li><span class="caps">PHP</span></li> </ul>

1.1.13. Tables

Making a simple table is as easy as possible:

|a|b|c| |1|2|3|

Will be processed into:

<table> <tr> <td>a</td> <td>b</td> <td>c</td> </tr> <tr> <td>1</td> <td>2</td> <td>3</td> </tr> </table>

If you want to customize the <table> tag, you must use the table signature:

table(class#id)[en]. |a|b|c| |1|2|3|

To customize a row, apply the modifier before the first |:

table. (class)<>|a|b|c| |1|2|3|

Individual cells can by customized by adding the parameters after the |, proceded by a period and a space:

|(#id). a|b|c| |1|2|3|

The allowed modifiers are:

{style rule}

  • A CSS style rule.

(class) or (#id) or (class#id)

  • A CSS class and/or id attribute.

( (one or more)

  • Adds 1em of padding to the left for each ’(’ character.

) (one or more)

  • Adds 1em of padding to the right for each ’)’ character.

<

  • Aligns to the left (floats to left for tables if combined with the ’)’ modifier).

>

  • Aligns to the right (floats to right for tables if combined with the ’(’ modifier).

=

  • Aligns to center (sets left, right margins to ‘auto’ for tables).

<>

  • For cells only. Justifies text.

^

  • For rows and cells only. Aligns to the top.

~ (tilde)

  • For rows and cells only. Aligns to the bottom.

_ (underscore)

  • Can be applied to a table row or cell to indicate a header row or cell.

\2 or \3 or \4, etc.

  • Used within cells to indicate a colspan of 2, 3, 4, etc. columns. When you see ”\”, think “push forward”.

/2 or /3 or /4, etc.

  • Used within cells to indicate a rowspan of 2, 3, 4, etc. rows. When you see ”/”, think “push downward”.

When a cell is identified as a header cell and an alignment is specified, that becomes the default alignment for cells below it. You can always override this behavior by specifying an alignment for one of the lower cells.

1.1.14. Inline

Inline formatting is applied within a block of text.

1.1.14.1. Quick tags

Quick tags allow you to format your text, making it bold, emphasized or small, for example. The quick tags operators include:

*strong*

  • Translates into <strong>strong</strong>.

_emphasis_

  • Translates into <em>emphasis</em>.

**bold**

  • Translates into <b>bold</b>.

italics

  • Translates into <i>italics</i>.

++bigger++

  • Translates into <big>bigger</big>.

--smaller--

  • Translates into: <small>smaller</small>.

-deleted text-

  • Translates into <del>deleted text</del>.

+inserted text+

  • Translates into <ins>inserted text</ins>.

superscript

  • Translates into <sup>superscript</sup>.

~subscript~

  • Translates into <sub>subscript</sub>.

%span%

  • Translates into <span>span</span>.

@code@

  • Translates into <code>code</code>.

Note that within a ”@…@” section, < and > are translated into HTML entities automatically.

Inline formatting operators accept the following modifiers:

{style rule}

  • A CSS style rule.

[ll]

  • A language identifier (for a “lang” attribute).

(class) or (#id) or (class#id)

  • For CSS class and id attributes.

1.1.15. Glyphs

Textile replaces some of the characters in your text with their equivalent numerical entities. These include:

  • Replace single and double primes used as quotation marks with HTML entities for opening and closing quotation marks in readable text, while leaving untouched the primes required within HTML tags.
  • Replace double hyphens (--) with an em-dash (—) entity.
  • Replace triple hyphens (---) with two em-dash (——) entities.
  • Replace single hyphens surrounded by spaces with an en-dash (–) entity.
  • Replace triplets of periods (...) with an ellipsis (…) entity.
  • Convert many nonstandard characters to browser-safe entities corresponding to keyboard input.
  • Convert (TM), (R), and (C) to ™, ®, and ©.
  • Convert the letter x to a dimension sign: 2x4 to 2×4 and 8 x 10 to 8×10.

1.1.15.1. Macros

Textile has support for character macros, which should be enclosed in curly braces. A few useful ones are:

{C=} or {=C}: euro sign {+-} or {-+}: plus-minus sign {L-} or {-L}: pound sign.

You can also make accented characters:

Expos{e'}

Becomes:

<p>Exposé</p>

You can also specify Unicode names like:

{umbrella} {white smiling face}

1.1.15.2. Acronyms

You can define acronyms in your text the following way:

This is XHTML(eXtensible HyperText Markup Language).

The resulting code is:

<p><acronym title="eXtensible HyperText Markup Language">XHTML</acronym></p>

Acronyms can have letters in upper and lower caps, or even numbers, provided that the numbers and upper caps are the same in the abbreviation and in the description. For example:

XHTML(eXtensible HyperText Markup Language) OPeNDAP(Open source Project for a Network Data Access Protocol) L94(Levitus 94)

are all valid acronyms.

1.1.16. Images

An image is generated by enclosing the image source in !:

!/path/to/image!

You may optionally specify an alternative text for the image, which will also be used as its title:

!image.jpg (Nice picture)!

Becomes:

<p><img src="image.jpg" alt="Nice picture" title="Nice picture" /></p>

If you want to make the image point to a link, simply append a comma and the URL to the image:

!image.jpg!:http://diveintopython.org

Images can also be resized. These are all equivalent:

!image.jpg 10x20! !image.jpg 10w 20h! !image.jpg 20h 10w!

The image image.jpg will be resized to width 10 and height 20.

Modifiers to the <img> tag go after the opening !:

!(class#id)^image.jpg!

Allowed modifiers include:

<

  • Align the image to the left (causes the image to float if CSS options are enabled).

>

  • Align the image to the right (causes the image to float if CSS options are enabled).

- (dash)

  • Aligns the image to the middle.

^

  • Aligns the image to the top.

~ (tilde)

  • Aligns the image to the bottom.

{style rule}

  • Applies a CSS style rule to the image.

(class) or (#id) or (class#id)

  • Applies a CSS class and/or id to the image.

( (one or more)

  • Pads 1em on the left for each ’(’ character.

) (one or more)

  • Pads 1em on the right for each ’)’ character.

Images receive the class “top” when using top alignment, “bottom” for bottom alignment and “middle” for middle alignment.

1.1.17. Links

A links is done the following way:

"This is the text link":http://example.com

The result from this markup is:

<p><a href="http://example.com">This is the text link</a></p>

You can add an optional title attribute:

"This is the text link(This is the title)":http://example.com

The link can be customised as well:

"(nospam)E-mail me please":mailto:[email protected]

You can use either single or double quotes. They must be enclosed in whitespace, punctuation or brackets:

You["gotta":http://example.com]seethis!

If you are going to reference the same link a couple of times, you can define a lookup list anywhere on your document:

[python]http://www.python.org

Links to the Python website can then be defined the following way:

"Check this":python

There are also shortcuts for Amazon, IMDB and Google queries:

"Has anyone seen this guy?":imdb:Stephen+Fry "Really nice book":amazon:Goedel+Escher+Bach "PyBlosxom":google ["Using Textile and Blosxom with Python":google:python blosxom textile]

Becomes:

<a href="http://www.imdb.com/Find?for=Stephen+Fry">Has anyone seen this guy?</a> <a href="http://www.amazon.com/exec/obidos/external-search?index=blended&keyword=Goedel+Escher+Bach">Really nice book</a> <a href="http://www.google.com/search?q=PyBlosxom">PyBlosxom</a></p> <a href="http://www.google.com/search?q=python+blosxom+textile">Using Textile and Blosxom with Python</a>

1.1.18. Sanitizing

Textile can help you generate valid XHTML. It will fix any single tags that are not properly closed, like <img />, <br /> and <hr />.

If you have mx.Tidy and/or µTidyLib installed, it also can optionally validade the generated code with these wrappers to ensure 100% valid XHTML.