This page is part of a static HTML representation of the TiddlyWiki at


 14th December 2023 at 9:37am


Introduced in v5.2.4 The $genesis widget allows the dynamic construction of another widget, where the name and attributes of the new widget can be dynamically determined, without needing to be known in advance.

Content and Attributes

The content of the $genesis widget is used as the content of the dynamically created widget.

$typeThe type of widget or element to create (an initial $ indicates a widget, otherwise an HTML element will be created)
$remappableSet to "no" to prevent the generated widget from being affected by any custom widget overrides. Needed when invoking the original widget within a custom widget definition
$namesAn optional filter evaluating to the names of a list of attributes to be applied to the widget
$valuesAn optional filter evaluating to the values corresponding to the list of names specified in $names
$modeAn optional override of the parsing mode. May be "inline" or "block"
{other attributes starting with $}Other attributes starting with a single dollar sign are reserved for future use
{attributes starting with $$}Attributes starting with two dollar signs are applied as attributes to the output widget, but with the attribute name changed to use a single dollar sign
{attributes not starting with $}Any other attributes that do not start with a dollar are applied as attributes to the output widget or HTML Element

Introduced in v5.2.6 If the $type attribute is missing or blank, the $genesis widget does not render an intrinsic element, instead just rendering its children.

Note that attributes explicitly specified take precedence over attributes with the same name specified in the $names filter.


<$genesis $type="div" class="tc-thing" label="Squeak">Mouse</$genesis>

That renders as:


... and the underlying HTML is:

<p><div class="tc-thing" label="Squeak">Mouse</div></p>

\define my-banner(mode:"inline",caption)
<$genesis $type={{{ [<__mode__>match[inline]then[span]else[div]] }}} class="tc-mybanner">

<<my-banner caption:"I'm in a SPAN">>

<<my-banner mode:"block" caption:"I'm in a DIV">>

That renders as:

I'm in a SPAN

I'm in a DIV

... and the underlying HTML is:

<p><span class="tc-mybanner">
I'm in a SPAN
</span></p><p><div class="tc-mybanner">
I'm in a DIV


In the following example the widget attribute named one is not present in the HTML output. This is because HTML attributes starting with the prefix on are removed for security reasons. See HTML in WikiText "Security" for more details. This restriction only affects generated HTML elements, and does not prevent the use of attributes prefixed on with other widgets

<$genesis $type="my-element" $names="one two" $values="1 2">Test Genesis Widget</$genesis>

That renders as:

Test Genesis Widget

... and the underlying HTML is:

<p><my-element two="2">Test Genesis Widget</my-element></p>