This page is part of a static HTML representation of the TiddlyWiki at http://tiddlywiki.com/

Lists in WikiText

7th June 2016 at 10:31am
WikiText

Bulleted Lists

You can create bulleted (unordered) lists with * characters ( ):

* First list item
* Second list item
** A subitem
* Third list item

That renders as:

  • First list item
  • Second list item
    • A subitem
  • Third list item

... and the underlying HTML is:

<ul><li>First list item</li><li>Second list item<ul><li>A subitem</li></ul></li><li>Third list item</li></ul>

Numbered Lists

Numbered (ordered) lists use # instead of * ( ):

  1. First item
  2. Second item
  3. Third item

You can also mix ordered and unordered list items:

* To do today
*# Eat
* To get someone else to do
*# This
*# That
*## And the other

That renders as:

  • To do today
    1. Eat
  • To get someone else to do
    1. This
    2. That
      1. And the other

... and the underlying HTML is:

<ul><li>To do today<ol><li>Eat</li></ol></li><li>To get someone else to do<ol><li>This</li><li>That<ol><li>And the other</li></ol></li></ol></li></ul>

Here's an example the other way around, with numbers as the first level:

# To do today
#* Eat
# To get someone else to do
#* This
#* That
#** And the other

That renders as:

  1. To do today
    • Eat
  2. To get someone else to do
    • This
    • That
      • And the other

... and the underlying HTML is:

<ol><li>To do today<ul><li>Eat</li></ul></li><li>To get someone else to do<ul><li>This</li><li>That<ul><li>And the other</li></ul></li></ul></li></ol>

CSS Classes

You can also assign a CSS class to an individual member of a list with this notation:

* List One
*.MyClass List Two
* List Three

That renders as:

  • List One
  • List Two
  • List Three

... and the underlying HTML is:

<ul><li>List One</li><li class="MyClass">List Two</li><li>List Three</li></ul>

Mixing Lists and Block Quotes

Note that Block Quotes in WikiText can be mixed with lists. For example:

* List One
** List Two
**> A quote
**> Another quote
* List Three

That renders as:

  • List One
    • List Two

      A quote

      Another quote

  • List Three

... and the underlying HTML is:

<ul><li>List One<ul><li>List Two<blockquote><p>A quote</p><p>Another quote</p></blockquote></li></ul></li><li>List Three</li></ul>

Paragraphs in Lists

Entries in the list are delimited with a linebreak, making it impossible to include linebreaks within a list entry. There are a couple of workarounds.

First, you can transclude paragraph content from another tiddler. For example:

* First entry
* <$transclude tiddler="MyTiddler" mode="block"/>
* Third entry

Secondly, you can use an HTML "div" element to contain the multiline content. For example:

# Step 1
# Step 2
# Step 3<div>

Here is the first of several paragraphs. Note that the double linebreak preceding this paragraph is significant.

And here is the second of several paragraphs.
</div>
# Step 4
# Step 5
# Step 6