The Rich Text Editor is a visualization type that allows users to add textual content for a dashboard or widget. The editor supports text formatting options like font, font size, bold, italic, text color, text highlight, text alignment, and much more. The editor supports text styles like bullet lists, block quotes, headings, ordered lists, etc. In addition, users can add images, videos, links, and customizable JavaScript code.
Adding a Rich Text Editor Widget
To add a Rich Text Editor,
- Navigate to the three-dots menu on the desired widget on the dashboard.
- Click Settings.
- Click on the Visualization Type dropdown.
- Select Rich Text Editor . Notice that the visualization data has been changed to an editor type.
-
Click Save.
Configuring a Rich Text Editor Widget
There are multiple collapsible menus on the left side of the window where the users can configure the widget.
Note: Use the search bar to find the menu options, a global search for all the menus.
Settings
In the Settings menu:
- Give the Rich Text Editor Widget a name in the Visualization title box.
-
Choose the widget category under the Category dropdown. (optional)
-
The Ignore Fields dropdown lists the fields (column names) from the data. Whichever fields are chosen to ignore don't show up on the visualization. (optional)
- In the Max Records field, enter the number of data records (rows) that must be displayed on the visualization. (optional)
- The Live Data slider, when enabled, prompts the user to enter the number of seconds. This will refresh the widget data after the number of seconds entered.
-
The Description is a free text box that allows the user to enter a description for the widget. (optional)
Note: The Description entered here will be displayed via an info icon (i) on the widget.
-
The text entered in the Footnote will be displayed at the bottom of the widget. (optional)
Display and Formatting
The display and Formatting collapsible menu has the following options, allowing users to configure the widget's appearance.
- Choose a title color in the Title Font Color color picker.
This is how it looks:
- Enter the title font size in the Title Font Size.
- Choose a display theme for the widget in the Display Themes dropdown.
- Choose a background color for the widget in the Background color color picker. It's transparent by default.
Widget Menu
The Widget Menu collapsible menu has the following options that allow users to configure the Rich Test Editor widget. All checkboxes are enabled by default.
- Show Title - Unchecking this would make the Widget title disappear.
- Alerts - Unchecking this would hide the Alerts icon.
- Drilldowns - Unchecking this would hide the Drilldowns menu.
- Data/Export - Unchecking this would hide the Data/Export menu.
- Share - Unchecking this would hide the Share menu.
- Maximize - Unchecking this would hide the Maximize menu.
- InstantSights - Unchecking this would hide the InstantSights menu.
- Analyze - Unchecking this would hide the Analyze menu.
- Filters - Unchecking this would hide the Filters icon.
- Query - Unchecking this would hide the Query menu.
- Data Diagram - Unchecking this would hide the Data Diagram menu.
- Refresh - Unchecking this would hide the Refresh menu.
-
Remove from Dashboard - Unchecking this would hide the Remove from Dashboard menu.
Advanced Configuration
Under the advanced settings menu, has an option to change the dataset.
At a given time, only one dataset can be used. In the example below, the Customer_data gets replaced with the Hotels data.
On click event handler - Users can define custom JavaScript behavior when a point is clicked. Read More.
Rich Text Editor Window
The Rich Text Editor Widget allows users to display text on dashboards. It has some advanced editing options that can be used to enhance the text displayed. The editing window is on the right pane of your screen. There are two tabs here: Visualization and Data Transformation.
Visualization
In the visualization tab, users can format and style the text and reference the data from the dataset.
Formatting and Styling Options
The top menu bar has all the formatting and styling options. In this example, some dummy text is used for illustration purposes.
- Text Editor - The text box to add the text/data you want to display on your dashboard.
- Font Style - Dropdown with different font options for the text.
- Font size - Dropdown to choose text size in pixel
- Font Format - Dropdown to choose the text format: Heading levels or normal.
- Bold - Choose the text and click on Bold to bold the text.
- Italic - Choose the text and click on Italic to italicize the text.
- Underline - Choose the text and click on Underline to underline the text.
- Strike Through - Choose the text and click on Strike Through to strike through the text.
- Font Color - Color picker to add color to the chosen text.
- Font Background Color - Color picker to add background color to the chosen text.
- Numbered List - Add a numbered list
- Bullet List - Add a Bullet list
- Checkbox - Add a checkbox list/data
- Quote - Add a quote/highlight text
- Add Code Pane - Add a code pane for the program code
- Subscript - Format data as subscript
- Superscript - Format data as superscript
- Right Indent - Indent text to right
- Left Indent - Indent text to left
- Paragraph - Add a paragraph
- Text Alignment - Choose the alignment of text: left, right, center, or justify
- Add Link - Add hyperlinks to text or media.
- Add Image - Add an image locally, with the ability to resize and reposition images.
- Add Video - Add a video locally, with the ability to resize and reposition videos.
- Reset - Reset all formatting to default
JavaScript-based Data Referencing
Users can also use Javascript-based referencing to display the dataset on the dashboard. Here are the placeholder formats supported:
Placeholder Format | Meaning | Example |
{{_count}} | Count all | |
{{_sum|<field>}} | The sum of all rows in a column | {{_sum|Clicks}} |
{_sum|<field>:<lower range - upper range>}} | The range sum of rows in a column | {{_sum|Clicks:1-10}} |
{{_max|<field>}} | The max of all rows in a column | {{_max|Clicks}} |
{{_max|<field>:<lower range - upper range>}} | The max of a range of rows in a column | {{_max|Clicks:1-10}} |
{{_min|<field>}} | The minimum of all rows in a column | {{_min|Clicks}} |
{{_min|<field>:<lower range - upper range>}} | The minimum of a range of rows in a column | {{_min|Clicks:1-10}} |
{{<field_name>}} | Value in the first row data in a column | {{Customer}} |
{{<field_name>:<row>}} | Value in the fifth row data in a column | {{Customer:5}} |
Data Transformation
Navigate to the Data Transformation tab to edit the data. The Data Transformation tab allows users to transform the data before visualizing it on the Rich Text Editor. Click Save after making the edits and switch to the Visualization tab to see the changes. For example, sort by and filter.
Menu Options
Use these menu options on the top right to save, clone, or export the widget.
- Click to save the Rich Text Editor Widget
- Click to clone the Rich Text Editor Widget
- Click to delete the Rich Text Editor Widget
- Click to export the Rich Text Editor Widget as a PDF
- Click to close the Rich Text Editor Widget