template
string
The template option determines the layout of the widget once it is rendered on the page. The mustache.js plugin is used
to render the template strings into full HTML, based on the data available from the API call. Using the template
option is not required, as long as the yearTemplate
and/or itemTemplate
are used instead. The desired structure should
be listed as strings containing html elements, with mustache variables to indicate where data should be used.
Important Notes:
- HTML elements should be listed as strings and combined with plus sign at the end of each string. For example:
'<span>Content text</span>' +
- The last string in the template should not include a plus sign at the end as it will return an error
- Mustache variables are shown in curly brackets, ex.
{{title}}
this content will be replaced with the value it represents in the API.
- Variables with two curly brackets are rendered as text. Variables with three curly brackets (ex.
{{{body}}}
) are rendered as HTML.
- Arrays of data can be accessed with # and closed with
/
. For example using {{#docs}}
in a widget template will allow you to access an
array of documents inside of a single content item.
- The value of the variable is specific to the array in which it is contained. For example,
{{title}}
inside
of {{#docs}}
will refer to the document title, but if it is listed outside of the array it would refer to the title of the content item (ex. event title).
- If/Else logic can be applied using # and ^ before a variable. See the example code at the bottom of this section.
-
{{#items}}
If items exist, access them and do something.
{{^items}}
If items do not exist, do something else
The following tags are available:
-
{{text}}
The text value of the lookup.
-
{{type}}
The lookup type.
{{value}}
The value of the lookup
Example: (
template: (
'<select class="form-control security" size="1" id="keyFndg" style="display: block;">' +
'{{#items}}' +
'<option data-type="{{type}}" value="{{value}}">{{text}}</option>' +
'{{/items}}' +
'</select>'
)