Custom Text/HTML – Documentation and Support | Knowi

Custom visualization with HTML and Javascript to create/style your visualization. You can navigate to custom Text/HTML via Settings.

Customizable text/HTML-based display. It can be simple text or more powerful rendering to include your data in various forms.

Field	Interpretation
Font size	Default font size
Font color	Font color
Background color	Widget background color.
Text Code	Enter Text or HTML code. You can use *{{tag}}* to field data for the widget. Type in { to get a list of fields along with some options you can use to customize the display of data Tag Options: Simple field display: *{{field_name}}* - getting the first value for a field with the name "field_name". {{field_name:n}} - get the nth value of the field with name "field_name". {{field_name:n-c}} - get a list comma-separated from "n" to "c" with "field_name". Commands: _data - JSON object with data for the current dataset. Typically used within JavaScript. _ul - builds a bullet list using value field. Command form *{{_ul\|field_name:n-c}}, {{_ul\|field_name:n}}, {{_ul\|field_name}}. _ol* - builds a numbered list using value field. Command form *{{_ol\|field_name:n-c}}, {{_ol\|field_name:n}}, {{_ol\|field_name}}* (field_name - field name in the sheet, n - from, ? - to) _table - builds a table from the field. Command form *{{_table\|field_name1,field_name2:n-c}}, {{_table\|field_name1,field_name2:n}}, {{_table\|field_name1,field_name2}}* _count - total number of records *{{_count}}* _sum - the amount of field values *{{_sum\|field_name:n-c}}, {{_sum\|field_name}}* _max - maximum value of the field *{{_max\|field_name:n-c}}, {{_max\|field_name}}* _min - minimum value of field *{{_min\|field_name:n-c}}, {{_min\|field_name}}* _widget - add another widget (not HTML widget) {{_widget\|widget_name}} _class - returns field value without any HTML wrappers. Useful if you want to use field value as a class name *{{_class\|field_name:n}}, {{_class\|field_name}}*

Code Generator

Code Generator lets the users generate HTML, CSS, or JavaScript code using natural language. Code Generator would be specifically helpful for users not familiar with HTML, CSS, JS, or programming altogether. Also, it helps save time by avoiding visiting other websites for help. Knowi is using OpenAI APIs to process these requests.

Prerequisite: Users need to enable OpenAI to use the Code Generator.

To generate code:

Under the Widget Configuration, click the Open AI Code Generator link.
In the Text box, enter the text for which you want to generate the code. Mention the language you want the code to be in. For example, "JS code to create a button". Users can also use {{_data}} to set a context for OpenAI Code Generator requests.

Note: The {{_data}} object is an array of JSON objects referencing the current dataset.
Click Generate.
You can copy and use the generated code in the Text Editor. Click the collapse icon to exit the Code Generator window.

Note: Users can generate custom HTML widgets and banners without a dataset/query. The HTML code can be written in the Text Code box.

Related articles