Tags:
create new tag
view all tags

TWiki Variables » Search » Category: Formatting & Rendering

Variables in this category:

AQUA -- start aqua colored text

AUTOCOMPLETE{} -- autocomplete input field for use in HTML forms

  • Combo box input field with autocomplete. Start typing to see matching options to pick from. The %AUTOCOMPLETE{}% variable is handled by the AutocompletePlugin.
  • Syntax: %AUTOCOMPLETE{ name="..." value="..." options="..., ..." }%
  • Parameters:
    Parameter Description Default Example
    name Name of input field (required) name="Mood"
    value Form field value "" value="Happy"
    options Comma-space separated list of autocomplete options. Example options when type="values" is used:
    options="1: One, 2: Two, 3: Three" - when a user picks option Three, the input field will have text 3 inserted.
    "" options="Happy, Indifferent, Sad"
    size Size of input field, in number of characters "40" size="20"
    type Types of autocomplete:
    type="" (empty): Simple autocomplete
    type="restrict": Restrict input to list of autocomplete options. The value in the input field will be cleared if it does not match one of the autocomplete options. Partial input is expanded - for example if one of the options is "JavaScript" and the user typed "ja", the input field is expanded to "JavaScript" on focus loss.
    type="values": Define inserted values that are different to the displayed autocomplete options. An autocomplete option is defined as value: title, where the value is the text inserted into the input field when picking the title option.
    type="restrict, values": Types of autocomplete can be combined.
    "" type="restrict"
    id ID of input field (none) id="mood"
    class Add additional class(es) to input field, default is "twikiInputField twikiEditFormTextField autocompleteTextField" "" class="myClass"
    style Add CSS to input field. A width: num; is already added, where num is calculated from the size parameter; the width can be overloaded. "" style="color: blue;"
    selectstyle CSS of select element "" selectstyle="color: blue;"
    containerstyle CSS of autocomplete container div "" containerstyle="font-size: 90%;"
    ... Additional HTML 4 and HTML 5 attributes can be specified for the input field: formname, maxlength, onblur, onfocus, onchange, onselect, onmouseover, onmouseout, pattern, placeholder, spellcheck, tabindex, title   placeholder="How do you feel?"
  • Example:
    <form action="...">
    %AUTOCOMPLETE{ name="Mood" value="Indifferent" options="Happy, Indifferent, Sad" size="10" }%
    <form>
  • Expands to:
  • Category: ApplicationsAndComponentsVariables, DatabaseAndFormsVariables, EditingAndContentUpdateVariables, FormattingAndRenderingVariables
  • Related: AutocompletePlugin, TWikiForms (this topic)

BB -- bullet with line break

BB2 -- level 2 bullet with line break

BB3 -- level 3 bullet with line break

BB4 -- level 4 bullet with line break

BLACK -- start black colored text

BLUE -- start blue colored text

BR -- line break

BROWN -- start brown colored text

BUBBLESIG -- show bubble box and user signature with profile picture icon

  • Syntax: %BUBBLESIG{WikiName}% or %BUBBLESIG{WikiName - YYYY-MM-DD}%
  • The parameter can be either just the WikiName of a user, or by convention the WikiName followed by a dash and the date
  • Example:
    -- %BUBBLESIG{TWikiGuest - 2020-03-29}%
  • Expands to:
    -- TWiki Guest - 2020-03-29
  • Category: EditingAndContentUpdateVariables, FormattingAndRenderingVariables, UsersAndAuthenticationVariables
  • Related: USERREPORT, USERSIG, UserList, UserReports (this topic)

BULLET -- bullet sign

CALENDAR -- show a monthly calendar with highlighted events

  • Events are defined by bullets, see CalendarPlugin#Event_Syntax for details. The %CALENDAR{}% variable is handled by the CalendarPlugin.
  • Syntax: %CALENDAR{ parameters }%
  • Parameters:
    Parameter Description Default
    year="yyyy" The year Current year
    year="+yy" or "-yy" Relative year Current year
    month="mm" The month Current month
    month="+mm" or "-mm" relative month Current month
    gmtoffset="+/-hh" Timezone expressed as number of hours offset from GMT Server timezone
    topic="TopicName" Topic containing events The topic containing the tag
    topic="Web.TopicName1, Web.TopicName2" Topics containing events The topics containing the tags
    web="Webname" Web containing the event topic The current web
    lang="language" Language: First few characters of "English", "Francais", "Deutsch", "Espagnol", "Portugues", "Nederlands", "Italiano", "Norsk", "Svenska", "Dansk", "Suomi", "Magyar", "Polski "English"
    daynames="Mon|Tue|..." Custom day names "Monday|Tuesday|
    Wednesday|Thursday|
    Friday|Saturday|
    Sunday"
    header="..." Text at the top of the calendar; use $m for current month, $y for year Current month and year
    weekstartsonmonday="1" or "0" Flag to start week on Monday "0" (Sunday)
    showdatenumbers="0" Show day numbers 1...31 in date cells. Note that showdatenumbers=1 means that HTML::CalendarMonthSimple will add the date numbers to the cells. If showdatenumbers=0, then the plugin adds the date numbers. The result of this is that a calendar will always show the date numbers. "0" (except with aslist="1", see below)
    showweekdayheaders="1" Show the weekday headers "0"
    weekdayheadersbig="0" If enabled, show weekday headers in bold cell headings "1"
    cellalignment="left" Horizontal cell alignment of day cells: "left", "center", "right", "justify", "char" "center"
    vcellalignment="middle" Vertical cell alignment of day cells: "top", "middle", "bottom", "baseline" "top"
    cellheight="n" Height in pixels of each cell in the calendar Minimum height needed
    format="..." How to highlight a date See Event Formatting below
    width="n" or "n%" Width of calendar table in pixels or percent Minimum width needed
    sharpborders="n" If set to 1, this gives very crisp edges between the table cells. If set to 0 standard HTML cells are used. "1"
    border="n" Border width of calendar table. (sharpborders="0" required) "1"
    cellspacing="n" Spacing of calendar cells. (sharpborders="0" required) "0"
    cellpadding="n" Padding of calendar cells. (sharpborders="0" required) "3"
    nowrap="1" or "0" Prevent cell content from wrapping "0"
    bgcolor="#nnnn" Default background color of all cells unless redefined by other color settings below (use an HTML color-code like "#000000" as defined in StandardColors) "white"
    contentcolor="#nnnn" Default content color of all cells unless redefined "black"
    headercolor="#nnnn" Background color of the Month+Year header The web bgcolor
    headercontentcolor="#nnnn" Content color of the Month+Year header contentcolor setting
    weekdayheadercolor="#nnnn" Background color of weekdays' headers bgcolor setting
    weekdayheadercontentcolor=
    "#nnnn"
    Content color of weekdays' headers contentcolor setting
    weekendheadercolor="#nnnn" Background color of weekends' headers bgcolor setting
    weekendheadercontentcolor=
    "#nnnn"
    Content color of weekends' headers contentcolor setting
    weekdaycolor="#nnnn" Background color of weekday cells bgcolor setting
    weekdaycontentcolor="#nnnn" Content color of weekday cells contentcolor setting
    weekendcolor="#nnnn" Background of weekend cells light gray
    weekendcontentcolor="#nnnn" Content color of weekend cells contentcolor setting
    todaycolor="#nnnn" Background of today's cell The web bgcolor
    todaycontentcolor="#nnnn" Content color of today's cell contentcolor setting
    and other attributes of HTML::CalendarMonthSimple
    aslist Controls whether events displayed in calendar style (aslist=0) or list style (aslist=1). Note that specifying aslist=1 forces showdatenumbers=1. This is done to ensure that the date number is formatted according to datenumberformat and that only the days that have an event are listed. "0"
    days Specifies how many days of calendar data to list. Only valid if aslist="1". "1"
    months Specifies how many months of calendars to display. Only valid if aslist="0". "1"
    datenumberformat Specifies formatting for the date number in each cell. The formatting codes accepted are the same as those for the %GMTIME% variable. $day (if aslist="0")
      * $day $mon $year (if aslist="1")
    todaydatenumberformat Specifies formatting for the date number for the current day (today) in the calendar. The formatting codes accepted are the same as those for the %GMTIME% variable. datenumberformat
    multidayformat Specifies formatting of the description for multi-day events. See Multi-Day Event Formatting for details. $description
  • Example: %CALENDAR{ month="2" year="2020" bgcolor="cyan" }% shows a February 2020 calendar
  • Category: DateAndTimeVariables, FormattingAndRenderingVariables
  • Related: DATE, DISPLAYTIME, GMTIME{"format"}, SERVERTIME, CalendarPlugin (this topic)

CARET -- caret symbol

CODE{"language"} -- highlight source code fragments for many languages

  • The %CODE{}% and %ENDCODE% variables are handled by the SyntaxHighlightingPlugin.
  • Syntax: %CODE{"language"}% ...code... %ENDCODE%
  • Parameters:
    Parameter Description Default
    "..." or
    lang="..."
    Source language. Supported languages: ada, asm, awk, bash, changelog, cpp, csh, c, delphi, diffs, diff, diffu, dylan, eiffel, elisp, Name:, forth, fortran_pp, fortran, haskell, html, icon, idl, inf, javascript, java, ksh, lua, m4, mail, makefile, matlab, nroff, oberon2, objc, outline, oz, pascal, perl, php, postscript, pyrex, python, rfc, ruby, scheme, sh, skill, Smalltalk, sml, sql, states, synopsys, tcl, tcsh, tex, vba, verilog, vhdl, vrml, wmlscript, zsh (none, required)
    num="..." Show line numbers next to the source code. An integer indicates the start number. Also "on" and "off" "off"
    step="..." Increment line numbers with the given step. Negative numbers will decrement. "1"
    style="..." Style of box around the source code light gray box
    numstyle="..." Style of line number column light brown box
  • Example:                   • Expands to:
    <sticky>
    %CODE{"cpp" num="on"}%
    void foo() {
      print("Do stuff.\n");
    }
    %ENDCODE%
    </sticky>
     
    void foo() {
         print("Do stuff.\n");
       } 
  • Category: FormattingAndRenderingVariables, UIAndVisualizationVariables
  • Related: SyntaxHighlightingPlugin (this topic)

COLORPICKER{} -- color picker for use in HTML forms for TWiki applications

  • The %COLORPICKER{}% variable is handled by the ColorPickerPlugin.
  • Syntax: %COLORPICKER{ name="..." value="..." }%
  • Parameters:
    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:
    "below" - color picker is located below the input field;
    "popup" - pop-up a color picker window when clicking the button next to the input field
        (this uses very little vertical space);
    "view" - a read-only rectangular block colored in the color value (no color picker);
    "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.
  • Example:
    <form action="...">
    %COLORPICKER{ name="text_color" value="#123456" class="twikiInputField" type="popup" }%
    <form>
    Renders as:
  • Category: ApplicationsAndComponentsVariables, DatabaseAndFormsVariables, EditingAndContentUpdateVariables, FormattingAndRenderingVariables, UIAndVisualizationVariables
  • Related: ColorPickerPlugin, TWikiForms (this topic)

COPY -- Copyright symbol

DASHBOARD -- build a dashboard with banner and boxes

DATEPICKER{} -- pop-up calendar to select a date for use in HTML forms

  • The %DATEPICKER{}% variable is handled by the DatePickerPlugin.
  • Syntax: %DATEPICKER{ name="..." value="..." }%
  • Parameters:
    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.
    %a - abbreviated weekday name
    %A - full weekday name
    %b - abbreviated month name
    %B - full month name
    %C - century number
    %d - the day of the month (00 ... 31)
    %e - the day of the month (0 ... 31)
    %H - hour (00 ... 23)
    %I - hour (01 ... 12)
    %j - day of the year ( 000 ... 366)
    %k - hour (0 ... 23)
    %l - hour (1 ... 12)
    %m - month (01 ... 12)
    %M - minute (00 ... 59)
    %n - a newline character
    %p - "PM" or "AM"
    %P - "pm" or "am"
    %S - second (00 ... 59)
    %s - number of seconds since Epoch (since Jan 01 1970 00:00:00 UTC)
    %t - a tab character
    %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.
    %u - the day of the week (1 ... 7, 1 = MON)
    %w - the day of the week (0 ... 6, 0 = SUN)
    %y - year without the century (00 ... 99)
    %Y - year including the century (ex. 2012)
    %% - 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    
  • Example:
    <form action="...">
    %DATEPICKER{ name="Start_Date" }%
    <form>
  • Expands to:
  • Category: ApplicationsAndComponentsVariables, DatabaseAndFormsVariables, DateAndTimeVariables, EditingAndContentUpdateVariables, FormattingAndRenderingVariables, UIAndVisualizationVariables
  • Related: DatePickerPlugin, TWikiForms (this topic)

ENDBG -- end background color section

ENDCOLOR -- end colored text

ENTITY{string} -- encode a string to HTML entities

  • Encode "special" characters to HTML entities. Useful to encode text properly for HTML input fields.
  • Encoded characters:
    • all non-printable ASCII characters below space, including newline ("\n") and linefeed ("\r")
    • Space
    • HTML special characters "<", ">", "&", single quote (') and double quote (")
    • TWiki special characters "%", "[", "]", "@", "_", "*", "=" and "|"
  • Syntax: %ENTITY{string}%
  • Example: %ENTITY{text with "quotes" and
    newline}%
    expands to text&#32;with&#32;&#34;quotes&#34;&#32;and&#10;newline
  • Notes:
    • To protect against cross-site scripting (XSS), always entity encode text intended for HTML input fields. This is especially true if text is received dynamically via URLPARAM or the like.
      Example: <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.
  • Category: DevelopmentVariables, FormattingAndRenderingVariables, ExportAndPublishingVariables
  • Related: ENCODE, FORMFIELD, QUERYPARAMS, URLPARAM (this topic)

FLOWCHART{} -- create a flowchart from topic text

  • The %FLOWCHART{}%, %FLOWCHART_START% and %FLOWCHART_STOP% variables are handled by the FlowchartPlugin.
  • Syntax: %FLOWCHART{}% ... %FLOWCHART_START% ... %FLOWCHART_STOP%
  • Parameters of %FLOWCHART{}%:
    Parameter Description
    item-w Width for the flowchart's itens area
    item-h Height for the flowchart's itens
    area-w Width of the area of the flowchart's itens
    area-h Height of the area of the flowchart's itens
    percent Percentage of the PNG size presented in relation to the standard of the generated SVG
    text-size Size in pixels of the font text
    tag-style Style for the img tag
  • Example:
    %FLOWCHART%
    %FLOWCHART_START%
    ---++ Flowchart Start
      * Type: Start
    ---++ Question 1
      * Type: Question
      * Yes: trunk1
      * No: trunk2
    ---++ Start of Trunk 1
      * Id: trunk1
      * Color: 70B070
    ---++ End of Trunk 1
      * Type: End
    ---++ Start of Trunk 2
      * Id: trunk2
      * Color: E0B040
    ---++ End of Trunk 2
      * Type: End
    %FLOWCHART_STOP%
  • Category: FormattingAndRenderingVariables, UIAndVisualizationVariables
  • Related: FlowchartPlugin, FlowchartPluginExample (this topic)

GAUGE{ attributes } -- create graphical images of gauges, typically used for dashboards

  • The %GAUGE{}% variable is handled by the GaugePlugin.
  • Syntax: %GAUGE{ type="..." name="..." value="..." }%
  • Supported attributes:
    Attribute Comment Default
    type The type of gauge, type="tambar" for target measure bar, or type="trend" for trend icon Global TYPE setting
    name Name to uniquely identify the gauge file that is auto-created. None; required for tambar
    value For tambar: The actual value of the gauge
    For trend: Positive = arrow up, 0 = arrow right, negative = arrow down
    None. Show "no data" if missing
    alt Alternate text for image Value is value parameter
    width Defines the width of the gauge in pixels. Global <type>_WIDTH setting
    height Defines the height of the gauge in pixels. Global <type>_HEIGHT setting
    scale For tambar: Defines the number and position of the scales. For example a value of "5, 12, 35, 57" denotes that there are three regions on the bar gauge, "5...12", "12...35" and "35...57".
    For trend: N/A
    Global <type>_SCALE setting
    colors For tambar: List of colors, each region has two colors. For trend: N/A Global <type>_COLORS setting
  • Examples:
    • %GAUGE{ type="tambar" name="t1" scale="0, 10, 20, 40" value="27" }% shows 27
    • %GAUGE{ type="trend" name="t2" value="-3" }% shows down trend
  • Category: ChartingAndDrawingVariables, FormattingAndRenderingVariables, UIAndVisualizationVariables
  • Related: GaugePlugin, GaugePluginTests (this topic)

GRAY -- start gray colored text

GREEN -- start green colored text

GROUPS -- a formatted list of groups

  • Expands to a formatted list of user groups in your TWiki. The variable is intended to be used in TWikiGroups, to allow a group listing for various user mapping managers.
  • Syntax: %GROUPS{"format" ...}%
  • Supported parameters:
    Parameter: Description: Default:
    header="" Table header. Standard format tokens are expanded. To omit the header, specify an empty value or "none". "| *Group* | *Members* |"
    format="" Format of one row, may include tokens:
    $group - topic name of group
    $grouplink - link to group
    $members - list of members, up to limit
    standard format tokens
    "| $grouplink | $members |"
    separator="" Line separator. Standard format tokens are expanded. "$n" (newline)
    memberlimit="" Truncate member list. Specify "all" for full list. "32"
    memberformat="" Format of one member, may include tokens:
    $wikiusername - Web.TopicName of user
    $wikiname - TopicName of user
    "[[$wikiusername][$wikiname]]"
    memberseparator="" Separator for members. Standard format tokens are expanded. ", "
    sort="on" By default, the members of a group are listed in the same order as in the definition in the group topic. With this parameter, members are listed in the alphabetical order of their wiki names. "off"
  • Category: FormattingAndRenderingVariables
  • Related: REMOTE_USER, USERINFO, USERNAME, WIKIUSERNAME, WIKIUSERSTOPIC (this topic)

H -- help icon

HIDE -- hide content in topic view

  • Text inside the HIDE is removed when viewing the topic. This can be used to remove large amounts of text from being sent to the browser, such as the user list in Main.TWikiUsers if there are many thousands of users.
  • Syntax: %HIDE{ any text }%
  • Expands to: (empty string)
  • Notes:
    • Using HIDE is not a replacement for access control, because edit and raw view still show the content.
    • Variables inside HIDE still get expanded because variables execute inside out, e.g. you can't use it to speed up slow variables.
    • <!-- HTML comments --> also hide content from the user, but unlike HIDE, HTML comments are sent to the browser.
  • Category: FormattingAndRenderingVariables
  • Related: NOP, STARTINCLUDE (this topic)

HIDEINPRINT{text} -- hide content when printing

I -- idea icon

ICON{"name"} -- small documentation graphic or icon of common attachment types

  • Generates the HTML img tag of a small graphic image attached to TWikiDocGraphics. Images typically have a 16x16 pixel size. You can select a specific image by name, or you can give a full file path or URL, in which case the type of the file will be used to select one of a collection of common file type icons.
  • Syntax: %ICON{"name"}%
  • Supported parameters:
    Parameter: Description: Default:
    "name" Name of icon required
    format="..." Format of icon. Supported variables (with Person %ICON{"person"}% example):
    $name - name of icon (person)
    $type - type of icon (gif)
    $filename - icon filename (person.gif)
    $web - web where icon is defined (TWiki)
    $topic - topic where icon is defined (TWikiDocGraphics)
    $description - icon description (Person)
    $width - width of icon ('16')
    $height - height of icon ('16')
    $img - full img tag of icon (<img src="... />)
    $info - icon tag with usage info in title
    $url - URL of icon (http://example.com/pub/TWiki/TWikiDocGraphics/person.gif)
    $urlpath - URL path of icon (/pub/TWiki/TWikiDocGraphics/person.gif)
    format="$img"
    default="else" Alternate icon if named icon is not defined default="$name"
  • Examples:
    • %ICON{"flag-gray"}% returns: Gray flag
    • %ICON{"pdf"}% returns: PDF
    • %ICON{"smile.pdf"}% returns: PDF
    • %ICON{"/home/sweet/home.pdf"}% returns: PDF
    • %ICON{"http://twiki.org/doc/xhtml.xsl"}% returns: XSL (XML style sheet)
    • %ICON{"bubble" format="$description icon is defined in $web.$topic"}% returns: Speech bubble icon is defined in TWikiDocGraphics
  • Graphic samples: Arrow blue right arrowbright, Speech bubble bubble, Yes / Done choice-yes, Pointing hand hand
  • File type samples: Bitmap bmp, Microsoft Word file doc, GIF gif, Standard help file hlp, HTML html, Waveform sound file mp3, PDF pdf, PowerPoint ppt, Text txt, Microsoft Excel Spreadsheet xls, XML xml, Compressed Zip archive zip
  • Category: FormattingAndRenderingVariables
  • Related: ICONURL, ICONURLPATH, TWikiPreferences, FileAttachments, TWikiDocGraphics (this topic)

ICONURL{"name"} -- URL of small documentation graphic or icon

  • Generates the full URL of a TWikiDocGraphics image, which TWiki renders as an image. The related %ICON{"name"}% generates the full HTML img tag. Specify image name or full filename (see ICON for details on filenames.)
  • Syntax: %ICONURL{"name"}%
  • Examples:
    • %ICONURL{"arrowbright"}% returns http://twiki.mssl.ucl.ac.uk/twiki/pub/TWiki/TWikiDocGraphics/arrowbright.gif
    • %ICONURL{"novel.pdf"}% returns http://twiki.mssl.ucl.ac.uk/twiki/pub/TWiki/TWikiDocGraphics/pdf.gif
    • %ICONURL{"/queen/boheme.mp3"}% returns http://twiki.mssl.ucl.ac.uk/twiki/pub/TWiki/TWikiDocGraphics/wav.gif
  • Category: FormattingAndRenderingVariables
  • Related: ICONURLPATH, ICON, TWikiPreferences, FileAttachments, TWikiDocGraphics (this topic)

ICONURLPATH{"name"} -- URL path of small documentation graphic or icon

JQENDTAB -- end a JQuery tab within a tab pane

JQENDTABPANE -- end a JQuery tab pane

JQTAB -- start a JQuery tab within a tab pane

  • This variable is handled by the JQueryPlugin. For description see JQTABPANE
  • Syntax: %JQTABPANE% %JQTAB{"Tab 1"}% ... %JQENDTAB% %JQTAB{"Tab 2"}% ... %JQENDTAB% ... %JQENDTABPANE%
  • Supported parameters:
    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" ""
  • Example: See complete example at JQTABPANE
  • Example: Asynchronously load the content of TimBernersLee topic into a tab content:
    %JQTABPANE%
    %JQTAB{ "Tim Berners-Lee" url="%SCRIPTURL{view}%/TWiki/TimBernersLee?skin=text" }%
    %ICON{processing}%    
      =%JQENDTAB%

    %JQENDTABPANE%
  • Category: ApplicationsAndComponentsVariables, FormattingAndRenderingVariables
  • Related: JQENDTAB, JQENDTABPANE, JQTABPANE, JQueryPlugin (this topic)

JQTABPANE -- start a JQuery tab pane

  • Create nice looking horizontal tab panes in TWiki topics. Write a sequence of %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.
  • Syntax: %JQTABPANE{ select="1" }% %JQTAB{"Tab 1"}% ... %JQENDTAB% %JQTAB{"Tab 2"}% ... %JQENDTAB% ... %JQENDTABPANE%
  • Supported parameter:
    Parameter: Description: Default:
    select="" Select a tab pane, default is the first tab. "1"
  • Note: A tab can be selected with a tab URL parameter using %JQTABPANE{ select="%URLPARAM{tab}%" }%
  • Example:
    %JQTABPANE%
    %JQTAB{"Tab 1"}%
    Tab 1 content...
    %JQENDTAB%
    %JQTAB{"Tab 2"}%
    Tab 2 content...
    %JQENDTAB%
    %JQENDTABPANE%
  • Renders as:

    Tab 1

    Tab 1 content...

    Tab 2

    Tab 2 content...
  • Category: ApplicationsAndComponentsVariables, FormattingAndRenderingVariables
  • Related: JQENDTAB, JQENDTABPANE, JQTAB, JQueryPlugin (this topic)

LAQUO -- left double angle quote

LIME -- start lime colored text

M -- moved to... icon

MAKETEXT -- creates text using TWiki's I18N infrastructure

  • Syntax: %MAKETEXT{"string" args="..."}%
  • Supported parameters:
    Parameter Description Default
    "text" or string="text" The text to be displayed. none
    args="param1, param2" a comma-separated list of arguments to be interpolated in the string, replacing the [_N] placeholders in it. none
  • Examples:
    • %MAKETEXT{string="Notes:"}%
      expands to
      Notes:
    • %MAKETEXT{"If you have any questions, please contact [_1]." args="%WIKIWEBMASTER%"}%
      expands to
      If you have any questions, please contact j.gaudelli@ucl.ac.uk.
    • %MAKETEXT{"Did you want to [[[_1]][reset [_2]'s password]]?" args="%SYSTEMWEB%.ResetPassword,%WIKIUSERNAME%"}%
      expands to
      Did you want to reset Main.TWikiGuest's password?
  • Notes:
    • TWiki will translate the string to the current user's language only if it has such string in its translation table for that language.
    • Ampersands (&) followed by one letter (one of a...z, A...Z -- say, X) in the translatable string will be translated to <span class='twikiAccessKey'>X</span>. This is used to implement access keys. If you want to write an actual amperstand that stays just before a letter, write two consecutive amperstands (&&): they will be transformed in just one.
    • Translatable string starting with underscores (_) are reserved. You must not use translatable phrases starting with an underscore.
    • Make sure that the translatable string is constant. Specially, do not include %VARIABLES% inside the translatable strings (since they will get expanded before the %MAKETEXT{...}% itself is handled).
  • Category: DevelopmentVariables, FormattingAndRenderingVariables
  • Related: TWiki:Codev.UserInterfaceInternationalisation (on TWiki.org) (this topic)

MAROON -- start maroon colored text

N -- "new" icon

NAVY -- start navy blue colored text

NBSP -- non-breaking space

NOP -- template text not to be expanded in instantiated topics

  • Syntax: %NOP%
    • In normal topic text, expands to <nop>, which prevents expansion of adjacent variables and wikiwords
    • When the topic containing this is used as a template for another topic, it is removed.
  • Syntax: %NOP{...}% deprecated
    • In normal topic text, expands to whatever is in the curly braces (if anything).
    • Note: This is deprecated. Do not use it. Use %STARTSECTION{type="templateonly"}% .. %ENDSECTION{type="templateonly"}% instead (see TWikiTemplates for more details).
  • Category: FormattingAndRenderingVariables, SkinsAndTemplatesVariables
  • Related: HIDE, STARTSECTION, TWikiTemplates (this topic)

OLIVE -- start olive green colored text

ORANGE -- start orange colored text

P -- pencil icon

PARENTBC -- parent breadcrumbs for headings

PINK -- start pink colored text

PURPLE -- start purple colored text

Q -- question icon

QRCODE -- create QR Code (a matrix barcode) in TWiki pages

  • QR Code example The %QRCODE{}% variable is handled by the QRCodePlugin
  • Syntax: %QRCODE{ "..." ... }%
  • Parameter "..." - text to encode as QR Code.
  • Parameter ecc="..." - error Correction Capability. Valid values "L", "M", "Q", "H". Default "M".
  • Parameter version="..." - symbol version of QR Code, or size of matrix. Valid values "1" ... "40", and "auto" for automatic versioning. Default "8".
  • Parameter size="..." - module size, e.g. pixel size of a block (bit) that makes up the matrix of the barcode. Default "4".
  • Parameter format="..." - format of HTML img tag of generated QR Code image. Supported variables: $urlpath - URL path of image, $width - image width, $height - image height. Default: "<img src='$urlpath' width='$width' height='$height' border='0' alt='' />".
  • Example: %QRCODE{ "http://twiki.org/" version="2" size="3" }% returns above QR Code.
  • Category: ExportAndPublishingVariables, FormattingAndRenderingVariables, UIAndVisualizationVariables
  • Related: QRCodePlugin (this topic)

RAQUO -- right double angle quote

RED -- start red colored text

REDBG -- start red colored background section

REG -- Registered Trademark symbol

RENDERLIST -- render bullet lists in a variety of formats

  • The %RENDERLIST% variable is handled by the RenderListPlugin
  • Syntax: %RENDERLIST%
  • Syntax: %RENDERLIST{ "org" focus="Sales.WestCoastTeam" }%
  • Example:
    %RENDERLIST{ "org" }%
       * [[Eng.WebHome][Engineering]]
          * [[Eng.TechPubs][Tech Pubs]]
       * [[Sales.WestCoastTeam][Sales]]
          * [[Sales.EastCoastTeam][East Coast]]
          * [[Sales.WestCoastTeam][West Coast]]
  • Category: FormattingAndRenderingVariables
  • Related: RenderListPlugin (this topic)

S -- red star icon

SILVER -- start silver colored text

SLIDESHOWEND -- end slideshow

SLIDESHOWSTART -- convert a topic with headings into a slideshow

SPACEDTOPIC -- topic name, spaced and URL-encoded deprecated

  • The current topic name with added URL-encoded spaces, for use in regular expressions that search for backlinks to the current topic
  • Syntax: %SPACEDTOPIC%
  • Expands to: Var%20*SPACEDTOPIC
  • Note: This is a deprecated variable. It can be duplicated with %ENCODE{%SPACEOUT{"%TOPIC%" separator=" *"}%}%
  • Category: FormattingAndRenderingVariables
  • Related: SPACEOUT, TOPIC, ENCODE (this topic)

SPACEOUT{"string"} -- renders string with spaces inserted in sensible places

  • Inserts spaces after lower case letters that are followed by a digit or a capital letter, and after digits that are followed by a capital letter.
  • Useful for spacing out WikiWords
  • Syntax: %SPACEOUT{ "%TOPIC%" }%
  • Expands to: TWiki Variables Category Body
  • Supported parameters:
    Parameter: Description: Default:
    separator The separator to put between words e.g. %SPACEOUT{"DogsCatsBudgies" separator=", "}% -> Dogs, Cats, Budgies ' '
  • TIP Hint: Spaced out WikiWords are not automatically linked. To SPACEOUT a WikiWord but preserve the link use "double bracket" format. For example, [[WebHome][%SPACEOUT{"WebHome"}%]] expands to Web Home
  • Category: FormattingAndRenderingVariables
  • Related: SPACEDTOPIC, $PROPERSPACE() of SpreadSheetPlugin (this topic)

T -- tip icon

TABLE{ attributes } -- control attributes of tables and sorting of table columns

  • The %TABLE{}% variable is handled by the TablePlugin
  • Syntax: %TABLE{ attributes }%

  • Supported attributes:
    Argument Comment Default value Example
    sort Set table sorting by clicking headers "on" or "off". unspecified sort="on"
    initsort Column to sort initially ("1" to number of columns). unspecified initsort="2"
    initdirection Initial sorting direction for initsort, set to "up" (descending) or "down" (ascending). unspecified initdirection="up"
    disableallsort Disable all sorting, both initsort and header sort. This is mainly used by plugins such as the EditTablePlugin to disable sorting in a table while editing the table. unspecified disableallsort="on"
    headerbg Header cell background color. "#6b7f93" headerbg="#999999"
    headerbgsorted Header cell background color of a sorted column. the value of headerbg headerbgsorted="#32596c"
    headercolor Header cell text color. "#ffffff" headercolor="#0000cc"
    databg Data cell background color, a comma separated list. Specify "none" for no color, that is to use the color/background of the page the table is on. "#edf4f9,#ffffff" databg="#f2f2f2,#ffffff"
    databgsorted Data cell background color of a sorted column; see databg. the values of databg databgsorted="#d4e8e4,#e5f5ea"
    datacolor Data cell text color, a comma separated list. unspecified datacolor="#0000CC, #000000"
    tableborder Table border width (pixels). "1" tableborder="2"
    tableframe Table frame, set to "void" (no sides), "above" (the top side only), "below" (the bottom side only), "hsides" (the top and bottom sides only), "lhs" (the left-hand side only), "rhs" (the right-hand side only), "vsides" (the right and left sides only), "box" (all four sides), "border" (all four sides). unspecified tableframe="hsides"
    tablerules Table rules, set to "none" (no rules), "groups" (rules will appear between row groups and column groups only), "rows" (rules will appear between rows only), "cols" (rules will appear between columns only), "all" (rules will appear between all rows and columns). unspecified tablerules="rows"
    cellpadding Cell padding (pixels). "0" cellpadding="0"
    cellspacing Cell spacing (pixels). "0" cellspacing="3"
    cellborder Cell border width (pixels). unspecified cellborder="0"
    valign Vertical alignment of cells and headers, set to "top", "middle", "bottom" or "baseline". unspecified valign="top"
    headervalign Vertical alignment of header cells; overrides valign. unspecified headervalign="top"
    datavalign Vertical alignment of data cells; overrides valign. unspecified datavalign="top"
    headeralign Header cell alignment, one value for all columns, or a comma separated list for different alignment of individual columns. Set to "left", "center", "right" or "justify". Overrides individual cell settings. unspecified headeralign="left,right"
    dataalign Data cell alignment, one value for all columns, or a comma separated list for different alignment of individual columns. Set to "left", "center", "right" or "justify". Overrides individual cell settings. unspecified dataalign="center"
    tablewidth Table width: Percentage of window width, or absolute pixel value. unspecified tablewidth="100%"
    columnwidths Column widths: Comma delimited list of column widths, percentage or absolute pixel value. unspecified columnwidths="80%,20%"
    headerrows Number of header rows to exclude from sort. (will be rendered in a HTML thead section) (determined automatically) headerrows="2"
    footerrows Number of footer rows to exclude from sort. (will be rendered in a HTML tfoot section) "0" footerrows="1"
    id Unique table identifier string, used for targeting a table with CSS. tableN (where N is the table order number on the page) id="userTable"
    summary Table summary used by screenreaders: A summary of what the table presents. It should provide an orientation for someone who listens to the table. unspecified summary="List of subscribed users"
    caption Table caption: A title that will be displayed just above the table. unspecified caption="Users"

TEAL -- start teal colored text

TM -- Trademark symbol

TOC -- table of contents of current topic

  • Table of Contents. Shows a TOC that is generated automatically based on headings of the current topic. Headings in WikiSyntax ("---++ text") and HTML ("<h2>text</h2>") are taken into account. Any heading text after "!!" is excluded from the TOC; for example, write "---+!! text" if you do not want to list a header in the TOC. An abbreviated heading can be shown in the TOC, such as "---++ text!! this is excluded from TOC".
  • Syntax: %TOC%
  • Category: FormattingAndRenderingVariables, UIAndVisualizationVariables
  • Related: INCLUDE, TOC{"Topic"} (this topic)

TOC{"Topic"} -- table of contents

  • Table of Contents. Shows a TOC that is generated automatically based on headings of a topic. Headings in WikiSyntax ("---++ text") and HTML ("<h2>text</h2>") are taken into account. Any heading text after "!!" is excluded from the TOC; for example, write "---+!! text" if you do not want to list a header in the TOC. An abbreviated heading can be shown in the TOC, such as "---++ text!! this is excluded from TOC".
  • Syntax: %TOC{"SomeTopic" ...}%
  • Supported parameters:
    Parameter: Description: Default:
    "TopicName" Topic name Current topic
    web="Name" Name of web Current web
    depth="2" Limit depth of headings shown in TOC 6
    title="Some text" Title to appear at top of TOC none (TOC_TITLE setting)
    style="..." Style to apply to the TOC none (TOC_STYLE setting)
  • Example: %TOC{depth="2"}%
  • Example: %TOC{"TWikiDocumentation" web="TWiki" title="Contents:" style="float: right;"}%
  • Category: FormattingAndRenderingVariables, UIAndVisualizationVariables
  • Related: INCLUDE, TOC (this topic)

TWISTY{ attributes } -- dynamically open and close sections of content

U -- "updated" icon

USERSIG -- show user signature with profile picture icon

VBAR -- vertical bar

WHITE -- start white colored text

WIP -- work in progress icon

X -- warning icon

Y -- "yes" icon

YELLOW -- start yellow colored text

Total: 81 variables

Related Topics: TWikiVariables, TWikiVariablesSearch, TWikiVariablesQuickStart

Edit | Attach | Watch | Print version | History: r1 | Backlinks | Raw View | More topic actions
Topic revision: r1 - 2012-11-11 - TWikiContributor
 
This site is powered by the TWiki collaboration platform Powered by PerlCopyright © 1999-2020 by the contributing authors. All material on this collaboration platform is the property of the contributing authors.
Ideas, requests, problems regarding TWiki? Send feedback
Note: Please contribute updates to this topic on TWiki.org at TWiki:TWiki.FormattingAndRenderingVariables.