HTML spans

You can enclose a bit of text in an HTML span tag by enclosing it in percent signs. Then you can apply attributes to the span (see attributes).

Textile
1
I can put in a %(myclass)span with a class% like this.
Browser

I can put in a span with a class like this.

HTML
1
<p>I can put in a <span class="myclass">span with a class</span> like this.</p>

Inline code

To mark code in your text, surround the code with at signs.

Textile
1
On the command line, you can just type @[email protected]
Browser

On the command line, you can just type redcloth.

HTML
1
<p>On the command line, you can just type <code>redcloth</code>.</p>

Block code

You can insert a block of code with the bc. block signature.

Textile
1
2
3
bc. # Output "I love Ruby"
say = "I love Ruby"
puts say
Browser
# Output "I love Ruby"
say = "I love Ruby"
puts say
HTML
1
2
3
<pre><code># Output "I love Ruby"
say = "I love Ruby"
puts say</code></pre>

Use bc.. and the block of code will continue to include blank lines until it encounters another block signature such as p.

Textile
1
2
3
4
5
6
7
8
9
bc.. # Output "I love Ruby"
say = "I love Ruby"
puts say

# Output "I *LOVE* RUBY"
say['love'] = "*love*"
puts say.upcase

p. And that is how you do it.
Browser
# Output "I love Ruby"
say = "I love Ruby"
puts say

# Output "I *LOVE* RUBY"
say['love'] = "*love*"
puts say.upcase

And that is how you do it.

HTML
1
2
3
4
5
6
7
8
<pre><code># Output "I love Ruby"
say = "I love Ruby"
puts say</code>

<code># Output "I *LOVE* RUBY"
say['love'] = "*love*"
puts say.upcase</code></pre>
<p>And that is how you do it.</p>

Inline HTML

You can use HTML right in your paragraph text, presuming the site administrator has not set :filter_html or :sanitize_html restrictions.

Textile
1
I can use HTML directly in my <span class="youbetcha">Textile</span>.
Browser

I can use HTML directly in my Textile.

HTML
1
<p>I can use <span class="caps">HTML</span> directly in my <span class="youbetcha">Textile</span>.</p>

Block HTML

You can use HTML freely within your RedCloth 4 Textile. HTML tags on a line by themselves will not be mangled. Don’t forget to leave a blank line after any Textile, just like usual.

Textile
1
2
3
4
5
6
7
8
9
10
11
<div id="shopping-cart">
<form action="/" method="get">
h3. Your cart

* Item one
* Item two

<p><input type="submit" value="Check Out" /></p>

</form>
</div>
Browser

Your cart

  • Item one
  • Item two

HTML
1
2
3
4
5
6
7
8
9
10
<div id="shopping-cart">
<form action="/" method="get">
<h3>Your cart</h3>
<ul>
	<li>Item one</li>
	<li>Item two</li>
</ul>
<p><input type="submit" value="Check Out" /></p>
</form>
</div>

No Textile

You can have RedCloth skip a chunk of text with the <notextile> tag or double-equals.

Textile
1
2
3
4
5
<notextile>
Don't touch this!
</notextile>

Use ==*asterisks*== to say something *strongly*.
Browser
Don't touch this!

Use *asterisks* to say something strongly.

HTML
1
2
Don't touch this!
<p>Use *asterisks* to say something <strong>strongly</strong>.</p>

Notextile can also be used as a normal or extended Textile block.

Textile
1
2
3
4
5
6
7
notextile. This has *no* textile formatting, see?

notextile.. And this notextile block

Just keeps going and going.

p. Until you end it with another block.
Browser
This has *no* textile formatting, see? And this notextile block Just keeps going and going.

Until you end it with another block.

HTML
1
2
3
4
5
This has *no* textile formatting, see?

And this notextile block

Just keeps going and going.<p>Until you end it with another block.</p>

Preformatted text

Preformatted text can be put in a pre. block and its whitespace will be preserved. pre. is almost identical to bc., except that <code>...</code> tags are not used within the <pre> block.

Textile
1
2
3
4
5
6
7
8
9
10
11
12
13
14
pre.      Text in a pre block
is displayed in a fixed-width
     font. It preserves
  s p a c e s, line breaks
     and ascii bunnies.
          _     _
          \`\ /`/
           \ V /
           /. .\
          =\ T /=
           / ^ \
        {}/\\ //\
        __\ " " /__
       (____/^\____)
Browser
     Text in a pre block
is displayed in a fixed-width
     font. It preserves
  s p a c e s, line breaks
     and ascii bunnies.
          _     _
          \`\ /`/
           \ V /
           /. .\
          =\ T /=
           / ^ \
        {}/\\ //\
        __\ " " /__
       (____/^\____)
HTML
1
2
3
4
5
6
7
8
9
10
11
12
13
14
<pre>     Text in a pre block
is displayed in a fixed-width
     font. It preserves
  s p a c e s, line breaks
     and ascii bunnies.
          _     _
          \`\ /`/
           \ V /
           /. .\
          =\ T /=
           / ^ \
        {}/\\ //\
        __\ " " /__
       (____/^\____)</pre>

Use pre.. to make a block of extended preformatted text that continues until it encounters another block signature, like p.

Textile
1
2
3
4
5
pre.. All monospaced

Even the blank lines

p. But now a paragraph
Browser
All monospaced
Even the blank lines

But now a paragraph

HTML
1
2
3
<pre>All monospaced</pre>
<pre>Even the blank lines</pre>
<p>But now a paragraph</p>