HTML tags and comments

HTML tags and comments can be used directly in WikiText. For example:

<article class="hello">
This is my nice and simple block of text. HelloThere
<!-- This comment will not appear in the wikified output -->
</article>

Pragma Comments

Introduced in v5.2.0 Comments can now be freely intermixed with pragmas as well as within the main body of a block of wikitext.

<!-- NEW: Comment that describes the macro -->
\define test()
some text <!-- inline comment -->
\end

<<test>>

Important

Security

Widgets

Block mode versus Inline mode

To get the content of an HTML element to be parsed in block mode, the opening tag must be followed by two linebreaks.

Without the two linebreaks, the tag content will be parsed in inline mode which means that block mode formatting such as wikitext tables, lists and headings is not recognised.

See also WikiText parser mode: HTML examples and WikiText parser mode transitions.

Self closing elements

The following tags are treated as 'void'. This means that <tag> is treated as if it were <tag/>, and that no terminating </tag> is needed (if one is provided it will be ignored and treated as plain text).

• <area>, <base>, <br>, <col>, <command>, <embed>, <hr>, <img>, <input>, <keygen>, <link>, <meta>, <param>, <source>, <track>, <wbr>

If you do not close any other tag then it will behave as if the missing closing tag were at the end of the tiddler.

Attributes

In an extension of conventional HTML syntax, attributes of elements and widgets can be specified in several different ways:

• a literal string
• a transclusion of a textReference
• a transclusion of a macro/variable
• as the result of a filter expression
• New in v5.3.0 as the result of performing filter and variable substitutions on the given string

Style Attributes

TiddlyWiki supports the usual HTML style attribute for assigning CSS styles to elements:

<div style="color:red;">Hello</div>

Introduced in v5.2.2 In an extension to HTML, TiddlyWiki also supports accessing individual CSS styles as independent attributes. For example:

<div style.color="red">Hello</div>

The advantage of this syntax is that it simplifies assigning computed values to CSS styles. For example:

<div style.color={{!!color}}>Hello</div>

New in v5.3.6 TiddlyWiki also supports setting CSS custom properties as independent attributes. For example:

<div --bg-color={{{ [[red]] }}}>Hello</div>