%BUBBLESIG{WikiName}%
or %BUBBLESIG{WikiName - YYYY-MM-DD}%
-- %BUBBLESIG{TWikiGuest - 24 Apr 2025}%
%COLORPICKER{}%
variable is handled by the ColorPickerPlugin.
%COLORPICKER{ name="..." value="..." }%
Parameter | Description | Default | Example |
---|---|---|---|
name | Name of input field | (required) | name="text_color" |
value | Initial color value, in hexadecimal notation for the combination of Red, Green, and Blue color values (RGB). | (none) | value="#0000ff" |
size | Size of input field, in number of characters | (browser default) | size="8" |
class | CSS class of input field or the rectangular color block | (none) | class="twikiInputField" |
style | Style of input field or the rectangular color block | (none) | style="width: 190px; height: 32px" |
type | Type of color widget: รข\x{fffd}ยข "below" - color picker is located below the input field;รข\x{fffd}ยข "popup" - pop-up a color picker window when clicking the button next to the input field (this uses very little vertical space); รข\x{fffd}ยข "view" - a read-only rectangular block colored in the color value (no color picker);รข\x{fffd}ยข "view-hex" - like view , in addition shows the color value as an RGB hexadecimal code (no color picker); | type="below" | type="view-hex" |
Additional parameters can be supplied; they will be added to the HTML input field or the rectangular color block. |
<form action="...">
%COLORPICKER{ name="text_color" value="#123456" class="twikiInputField" type="popup" }%
<form>
%COPY%
%DASHBOARD{...}%
variable.
%DASHBOARD{ section="..." ... }%
%DASHBOARD{ section="dashboard_start" }%
%DASHBOARD{ section="banner" image="..." title="..." }%
%DASHBOARD{ section="box_start" title="Box 1 title" }%
Box 1 content
%DASHBOARD{ section="box_end" }%
%DASHBOARD{ section="box_start" title="Box 2 title" }%
Box 2 content
%DASHBOARD{ section="box_end" }%
...
%DASHBOARD{ section="dashboard_end" }%
%DATEPICKER{}%
variable is handled by the DatePickerPlugin.
%DATEPICKER{ name="..." value="..." }%
Parameter | Description | Default | Example |
---|---|---|---|
name | Name of input field. φ: No output is shown if the name parameter is missing, but the CSS and Javascript are loaded. | (requiredφ) | name="Start" |
value | Initial date value. | "" (today) | value="2012-12-31" |
format | Format of resulting date value. รข\x{fffd}ยข %a - abbreviated weekday nameรข\x{fffd}ยข %A - full weekday nameรข\x{fffd}ยข %b - abbreviated month nameรข\x{fffd}ยข %B - full month nameรข\x{fffd}ยข %C - century numberรข\x{fffd}ยข %d - the day of the month (00 ... 31)รข\x{fffd}ยข %e - the day of the month (0 ... 31)รข\x{fffd}ยข %H - hour (00 ... 23)รข\x{fffd}ยข %I - hour (01 ... 12)รข\x{fffd}ยข %j - day of the year ( 000 ... 366)รข\x{fffd}ยข %k - hour (0 ... 23)รข\x{fffd}ยข %l - hour (1 ... 12)รข\x{fffd}ยข %m - month (01 ... 12)รข\x{fffd}ยข %M - minute (00 ... 59)รข\x{fffd}ยข %n - a newline characterรข\x{fffd}ยข %p - "PM" or "AM"รข\x{fffd}ยข %P - "pm" or "am"รข\x{fffd}ยข %S - second (00 ... 59)รข\x{fffd}ยข %s - number of seconds since Epoch (since Jan 01 1970 00:00:00 UTC)รข\x{fffd}ยข %t - a tab characterรข\x{fffd}ยข %U , %W , %V - the week number. The week 01 is the week that has the Thursday in the current year, which is equivalent to the week that contains the fourth day of January. Weeks start on Monday.รข\x{fffd}ยข %u - the day of the week (1 ... 7, 1 = MON)รข\x{fffd}ยข %w - the day of the week (0 ... 6, 0 = SUN)รข\x{fffd}ยข %y - year without the century (00 ... 99)รข\x{fffd}ยข %Y - year including the century (ex. 2012)รข\x{fffd}ยข %% - a literal % character | "%Y-%m-%d" | format="%e %b %Y" |
id | ID of input field, optional. | "id_" + name | id="idStart" |
size | Size of input field, in number of characters. | (calculated as needed) | size="12" |
class | CSS class of input field. | "twikiInputField" | class="dateField" |
Additional HTML input field attributes, such as alt , disabled , maxlength , onblur , onchange , onfocus , readonly , style , tabindex , title |
<form action="...">
%DATEPICKER{ name="Start_Date" }%
<form>
ENDBG
is a rendering shortcut settings predefined in TWikiPreferences. See the section rendering shortcut settings in that topic for a complete list of background colors.
%REDBG% red background %ENDBG%
%<color>BG%
section must end with %ENDBG%
. If you want to switch from one background color to another one you first need to end the active background color with %ENDBG%
, such as %REDBG% some text %ENDBG% %GREENBG% more text %ENDBG%
.
%TWOCOLUMNS% ...text... %ENDCOLUMNS%
to get a page layout with two columns. See TWOCOLUMNS, THREECOLUMNS, FOURCOLUMNS.
%TWOCOLUMNS% ... %ENDCOLUMNS%
"\n"
) and linefeed ("\r"
)
"<"
, ">"
, "&"
, single quote ('
) and double quote ("
)
"%"
, "["
, "]"
, "@"
, "_"
, "*"
, "="
and "|"
%ENTITY{string}%
%ENTITY{text with "quotes" and
newline}%
expands to text with "quotes" and newline
<input type="text" name="address" value="%ENTITY{any text}%" />
%ENTITY{string}%
is roughly equivalent to %ENCODE{ "string" type="html" }%
, but the latter cannot handle strings that have double quotes embedded in it.
%FORM{topic="..." formfields="..." ...}%
Parameter: | Description:![]() | Default: | |||
---|---|---|---|---|---|
newline="$br" | Convert newlines in textarea to other delimiters. Variable $br expands to <br /> tag, and $n to a newline. Other text is encoded based on encode parameter. | "$br" if format is a TWiki table, else "\n" | |||
encode="html" | Encode special characters in form field value into HTML entities. Additional encodings available: encode="quote" , encode="moderate" , encode="safe" , encode="entity" and encode="url" . See ENCODE for details. | "" (no encoding) | |||
header="..." | Form header, typically containing the form name. If "on" , the default format " | *[[$formweb.$formtopic][$formtopic]]* | " is used. If "none" , the header is suppressed. Supported variables: รข\x{fffd}ยข $formweb - name of web containing the form definition. รข\x{fffd}ยข $formtopic - name of topic containing the form definition. | "on" | |
format="..." | Format of one form field. Supported variables: รข\x{fffd}ยข $title - raw field name (includes space and other special characters). รข\x{fffd}ยข $name - field name (sanitized title). รข\x{fffd}ยข $type - form field type. รข\x{fffd}ยข $size - size of field or selector. รข\x{fffd}ยข $value - form field value. รข\x{fffd}ยข $value(20, -<br />) - value hyphenated every 20 characters using separator -<br />. รข\x{fffd}ยข $value(30, ...) - value shortened to 30 characters. รข\x{fffd}ยข $length - length of form field value. รข\x{fffd}ยข $tooltip - tooltip message. รข\x{fffd}ยข $attributes - type attributes, such as H for hidden, M for mandatory. รข\x{fffd}ยข $formweb - name of web containing the form definition. รข\x{fffd}ยข $formtopic - name of topic containing the form definition. See details in TWikiForms#FormFieldTypes. | " | $title: | $value | " |
rev="..." | Get the form from the specified topic revision, range "1" to top revision of topic. "0" is equivalent to the top revision | The rev URL parameter value if present, else the top revision | |||
separator="..." | Line separator. Variable $br expands to <br /> tag, and $n to a newline. | "$n" | |||
"..." ortopic="..." | Name of topic containing the TWiki form, such as "Bug1234" . Specify topic name or Web.TopicName | Current topic | |||
showhidden="..." | Set to "on" to show also hidden form fields. | "" | |||
formfields="..., ..." | Specify names of TWiki form fields to show, in sequence. The all token shows all remaining fields. | "all" | |||
default="..." | Text shown when no form or form fields are found | "" |
%FORM{topic="%INCLUDINGTOPIC%"}%
- show form data of the including topic (typically used in an included header)
%FORM{topic="Projects.SushiProject" formfields="Title, Status, Deadline" header="none"}%
- show a subset of form fields
%FORM{format="$name" header="none" separator=", "}%
- get all visible form field names as a list
%FOURCOLUMNS% ...text... %ENDCOLUMNS%
to get a page layout with four columns. The layout is responsive, e.g. it automatically adjusts to a lower number of columns (4 => 3 => 2 => 1) depending on the window width or screen width of the device used. The 300 pixels minimum width of a column determines the number of columns shown. Embedded images scale down automatically to the width of the screen if needed.
%FOURCOLUMNS% ... %ENDCOLUMNS%
%HIDE{ any text }%
<!-- HTML comments -->
also hide content from the user, but unlike HIDE, HTML comments are sent to the browser.
%HIDEINPRINT{ any text }%
any text
in topic view, or empty string in printout
%JQTABPANE% %JQTAB{"Tab 1"}% ... %JQENDTAB% %JQTAB{"Tab 2"}% ... %JQENDTAB% ... %JQENDTABPANE%
%JQTABPANE% %JQTAB{"Tab 1"}% ... %JQENDTAB% %JQTAB{"Tab 2"}% ... %JQENDTAB% ... %JQENDTABPANE%
%JQTABPANE% %JQTAB{"Tab 1"}% ... %JQENDTAB% %JQTAB{"Tab 2"}% ... %JQENDTAB% ... %JQENDTABPANE%
Parameter: | Description: | Default: |
---|---|---|
"..." | Name of tab, shown as tab label | (required) |
before | When switching tabs, this is the Javascript fragment to be executed just before the tab is displayed | "" |
after | This Javascript handler is to be executed after the tab has been made visible | "" |
afterload | This Javascript handler will be called when content loaded asynchronously has finished loading (using the url parameter described below). Depending on the network latency and server response time, this can be significantly later than execution of the after handler above | "" |
url | Link from where to load the content of the tab asynchronously when selecting this tab; the result of the addressed handler will replace the content area; if no url is set the content of the TAB ... ENDTAB area will be shown when the tab is selected | "" |
container | Container element (".someClass" or "#someID" ) where content will be loaded asynchronously using Ajax; this is only used together with url | ".jqTabContents" |
class | Add additional class to existing tab class "jqTab" | "" |
%JQTABPANE%
%JQTAB{ "Tim Berners-Lee" url="%SCRIPTURL{view}%/TWiki/TimBernersLee?skin=text" }%
%ICON{processing}%
%JQENDTAB%
%JQENDTABPANE%
%JQTAB{"..."}%
and %JQENDTAB%
pairs, and enclose them in %JQTABPANE%
and %JQENDTABPANE%
. Tab panes can be nested, e.g. within one tab you can add another tab pane. These variable are handled by the JQueryPlugin.
%JQTABPANE{ select="1" }% %JQTAB{"Tab 1"}% ... %JQENDTAB% %JQTAB{"Tab 2"}% ... %JQENDTAB% ... %JQENDTABPANE%
Parameter: | Description: | Default: |
---|---|---|
select="" | Select a tab pane, default is the first tab. | "1" |
tab
URL parameter using %JQTABPANE{ select="%URLPARAM{tab}%" }%
%JQTABPANE%
%JQTAB{"Tab 1"}%
Tab 1 content...
%JQENDTAB%
%JQTAB{"Tab 2"}%
Tab 2 content...
%JQENDTAB%
%JQENDTABPANE%
%LAQUO%
into normal space. Use this variable where non-breaking space needs to be retained, such as in empty table headings.
'%NBSP%'
)
%PARENTBC%
to a heading of a topic to show the breadcrumb of its parents. Parent topics are linked, topic names are shown spaced out in a smaller font, and are separated by »
quotes. In addition, a parentlist
SetGetPlugin variable is set to the parent list, and a parent
variable is set to the immediate parent. This can be retrieved later in the topic using %GET{parentlist}%
and %GET{parent}%
, respectively.
%PARENTBC%
---+ %PARENTBC% Myself and me
%RAQUO%
REDBG
is one of the rendering shortcut settings predefined in TWikiPreferences. See the section rendering shortcut settings in that topic for a complete list of background colors.
%REDBG% red background %ENDBG%
%REDBG%
area must end with %ENDBG%
.
%REG%
%THREECOLUMNS% ...text... %ENDCOLUMNS%
to get a page layout with three columns. The layout is responsive, e.g. it automatically adjusts to a lower number of columns (3 => 2 => 1) depending on the window width or screen width of the device used. The 300 pixels minimum width of a column determines the number of columns shown. Embedded images scale down automatically to the width of the screen if needed.
%THREECOLUMNS% ... %ENDCOLUMNS%
%TM%
%TWIKISHEET{}%
variable is handled by the TWikiSheetPlugin
%TWIKISHEET{ parameters }%
Parameter | Description | Example | Default | |
---|---|---|---|---|
mode | Mode of operation: รข\x{fffd}ยข mode="classic" - regular TWiki table and an edit button; once pressed, the table switches into spreadsheet edit mode. รข\x{fffd}ยข mode="toggle" - spreadsheet in read-only mode and an edit button; once pressed, the table switches into spreadsheet edit mode. รข\x{fffd}ยข mode="toggle-edit" - like "toggle" but initial state is spreadsheet edit mode. รข\x{fffd}ยข mode="edit" - the table is always in spreadsheet edit mode. | mode="edit" | {Plugins} configure setting ( "toggle" ) | |
concurrent | Concurrent editing. If enabled, multiple people can edit TWiki Sheet and see each other's changes. This includes editing cells, pasting a range of cells, drag-filling cells, adding/removing rows, adding/removing columns, and undo. รข\x{fffd}ยข concurrent="0" - disable concurrent editing; changes by others will be shown after a page reload. รข\x{fffd}ยข concurrent="1" - enable concurrent editing; changes by others will show up while editing TWiki Sheet. | concurrent="1" | {Plugins} configure setting ( "0" ) | |
save | Optionally disable save; useful to demo the plugin | save="0" | save="1" | |
width | Table width in pixels; a horizontal scrollbar is added if needed | width="500" | (full window width) | |
height | Table height in pixels; a vertical scrollbar is added if needed | height="300" | (full table height) | |
colHeaders | Set to "false" to disable the default column headers (A, B, C); set to a function for custom headers, such as:colHeaders="function(index) { return String.fromCharCode(65+index) + ' (' + (index + 1) + ')'; }" , which will show headers A (1) , B (2) , C (3) , ... | colHeaders="false" | colHeaders="true" | |
rowHeaders | Set to "false" to disable the default row headers (1, 2, 3) | rowHeaders="false" | rowHeaders="true" | |
contextMenu | Defines the right-click context menu; set to "false" to disable; set to array of available strings, such as:contextMenu="['row_above', 'row_below', 'col_left', 'col_right', 'remove_row', 'remove_col', '---------', 'undo', 'redo']" | contextMenu="false" | contextMenu="true" | |
fixedRowsTop | Fixed number of rows shown on top; takes effect if height parameter is used | fixedRowsTop="1" | (none) | |
fixedColumnsLeft | Fixed number of columns shown on the left; takes effect if width parameter is used | fixedColumnsLeft="2" | (none) | |
formulas | Formula support; set to "false" to disable spreadsheet calculations in table cells, such as: =SUM(A1:A8) | formulas="false" | formulas="true" | |
maxCols | Maximum number of columns | maxCols="10" | (unlimited) | |
maxRows | Maximum number of rows | maxRows="1000" | (unlimited) | |
minSpareCols | When set to 1 (or more), automatically add a new column at the right if there are no more empty columns | minSpareCols="1" | minSpareCols="0" | |
minSpareRows | When set to 1 (or more), automatically add a new row at the bottom if there are no more empty rows | minSpareRows="1" | minSpareRows="0" | |
wordWrap | Word wrap; set to "false" to disable cell content wrapping if it does not fit in the fixed column width | wordWrap="false" | wordWrap="true" | |
more... | Additional Handsontable options![]() รข\x{fffd}ยข Number value: Specify the number, such as width="500" รข\x{fffd}ยข String value: Enclose the string in single quotes, such as preventOverflow="'horizontal'" รข\x{fffd}ยข Boolean value: Specify "true" or "false" , such as manualRowResize="true" รข\x{fffd}ยข Array value: Specify the array, such as manualRowResize="[40, 50]" รข\x{fffd}ยข Object value: Specify the object, such as columnSorting="{ column: 2, sortOrder: true }" รข\x{fffd}ยข Function: Specify the JavaScript function, such as: cells="function( row, col, prop ) { var cp = {}; if( row===0 ) { cp.readOnly = true; } return cp; }" |
%TWIKISHEET{ mode="edit" save="0" }% | | 16Q1 | 16Q2 | 16Q3 | 16Q4 | | East: | 163 | 182 | 208 | 193 | | Center: | 82 | 97 | 126 | 91 | | West: | 217 | 231 | 294 | 249 | | Total: | =SUM(B2:B4) | =SUM(C2:C4) | =SUM(D2:D4) | =SUM(E2:E4) | | Min: | =MIN(B2:B4) | =MIN(C2:C4) | =MIN(D2:D4) | =MIN(E2:E4) | | Max: | =MAX(B2:B4) | =MAX(C2:C4) | =MAX(D2:D4) | =MAX(E2:E4) | | ![]() |
%TWISTY{}%
variable is handled by the TwistyPlugin.
%TWISTY{}% ... %ENDTWISTY%
%TWISTY{}%
my twisty content
%ENDTWISTY%
%TWOCOLUMNS% ...text... %ENDCOLUMNS%
to get a page layout with two columns. The layout is responsive, e.g. it automatically adjusts to a single column (2 => 1) depending on the window width or screen width of the device used. The 300 pixels minimum width of a column determines the number of columns shown. Embedded images scale down automatically to the width of the screen if needed.
%TWOCOLUMNS% ... %ENDCOLUMNS%
%USERSIG{WikiName}%
or %USERSIG{WikiName - YYYY-MM-DD}%
-- %USERSIG{TWikiGuest - 24 Apr 2025}%
%WIP%