Widget Tabber
Dashboards are designed to deliver clarity, but they often become cluttered, sluggish, and difficult to navigate. The Widget Tabber solves this by introducing clean, tab-based navigation with lazy loading for faster performance. Instead of overwhelming users with crowded pages or scattered dashboards, it organizes widgets into intuitive tabs.
The Widget Tabber makes it simple to switch views, maintain context, and uncover insights without the wait.
Release Notes for Widget Tabber can be found here.
Installation and configuration
The Widget Tabber plugin can be installed by an Admin, following the directions in Installing QBeeQ Plugins.
Operating system and version support:
- Linux - Latest
- Windows - Latest
Creating a new Widget Tabber
To create a new Widget Tabber widget:
Before you begin, ensure that the widgets are built and added to the dashboard.
- Choose QBeeQ Advanced Widget Tabber from the widget dropdown list
- Select data as KPIs from the data panel
- Set the tab count and display names
- Select the widgets to manage via the Widgets Tabber
- For each tab, configure widget visibility
- Configure optional tab data
- Configure tab styling (individual and global)
- Save and refresh the dashboard
When first created, the widget will display as blank. Refresh the dashboard and the widget content should appear.
Select data
Data set as KPIs can be displayed as a primary metric or a trend metric on each tab. Add up to 20 KPIs in the Data Panel. KPIs can include formulas as well as standard columns.
As you add KPIs, they will not appear in the Design Panel.
If you do not want to display a primary or trend metric on the tabs, you do not need to add data in the data panel.
Set the tab count and display names
Define the number of tabs you want to display; you are limited to a maximum of 10 tabs.
Once the tab number is set, provide a display name for each tab.
The tab names are not related to the column or formula name in the Data Panel, and can be different. Changes made in one panel will not affect the settings in the other panel.
Select the widgets to manage
The Managed Widget section will display all widgets currently on the dashboard in a list. Users can select all of the widgets, or a subset.
Selecting widgets in this section will allow the user to set the visibility by tab.
Any widgets not selected will continue to persist on the dashboard, regardless of the tab selected.
If your tabber was configured using the previous widget ID input method, widget names will be resolved automatically. Any IDs that can no longer be resolved will be flagged with a 'Widget not found' indicator. Reassign or remove them as needed.
Configure widget visibility per tab
The design panel displays a summary of how many widgets are set to show and hide for each tab.
When configuring a tab for the first time, all widgets default to a show state.
For each tab, click the edit button to open the widget selector modal. The modal lists all widgets on the current dashboard by title (falling back to widget ID if no title is set), ordered by dashboard layout (left-to-right, top-to-bottom).
- Use the eye icon toggle on each row to assign the widget's state
- Click Confirm to save your assignments.
- Click Cancel to discard changes and return the design panel to its prior state.
- Click Reset to return all widgets to the default show state.
Configure optional tab data
Each tab can display contextual data to give viewers at-a-glance insight alongside the tab label. Use the checkboxes below to enable metrics and date context on a per-tab basis.
Setting | Description | Notes |
Show Primary Metric | The value that displays on the tab, below the tab name | |
Show Trend Metric | The value that displays on the tab, below the Primary Metric | The trend metric will automatically display as green when positive, and red when negative. |
Show As Of | Displays the oldest date available, if a date filter is added to the dashboard | ℹ️ To display an As Of date on tabs, make sure there is at least one date filter on the dashboard |
Color | Sets the color that displays at the top of the tab when it is selected |
Configure tab styling (individual and global)
Tab styling can be configured at the individual tab level or applied globally across all tabs. Font size, color, and type can be set for the following elements.
Setting | Description |
Title Font Style | Sets the size, color and font for the tab Title |
Sub Title Font Style | Sets the size, color and font for the Primary Metric |
As Of Date Font Style | Sets the size, color and font for the As Of value |
Tab Style Settings
Fine-tune the visual appearance of tabs across their active, inactive, and hover states.
Setting | Description |
Active Tab Font Color | Sets the font color of the KPI on the tab when it is clicked by the user |
Active Tab Background Color | Sets the background color of the tab when it is clicked by the user |
Inactive Tab Font Color | Sets the font color of the KPI on all tabs other than the active tab |
Inactive Tab Background Color | Sets the background color of all tabs other than the active tab |
Hover Tab Font Color | Sets the font color of the KPI on the tab when hovered over by the user |
Hover Tab Color | Sets the tab color of the KPI on the tab when hovered over by the user |
Border Radius | Controls the corner radius of the tab corners |
Show Top Border Color | Enable/Disable top border color |
Tab Border Color | Sets the color of the border of the tab when it is clicked by the user
⚠️ Show Top Border Color must be enabled for Tab Border Color to take effect. |
Other Settings
Use these global toggles to control the visibility of metrics and labels across all tabs at once.
Setting | Description |
Hide Active Tab | Hide/Show active tab |
All Primary Metric | Hide/Show all primary metrics |
All Trend Metric | Hide/Show all trend metrics |
All As Of Date | Hide/Show all as of dates |
Using the Widget Tabber
To use the Widget Tabber, select the tab you wish to view. The tabber will dynamically change the display of the dashboard based on how the tab has been configured.
Limitations
When using the Widget Tabber in Sisense, please be aware of the following limitations:
Export
- Exporting content directly from the Tabber Widget is not supported.
Dashboard Layout and Drag-and-Drop
- The Tabber Widget may affect the standard widget layout on dashboards. In some cases, Sisense’s drag-and-drop functionality may behave unexpectedly, including:
- Moving the Tabber Widget on the dashboard.
- Dragging widgets between tabs, or moving them in and out of tabs.
Row Layout and Resizing
- When multiple widgets are placed in the same row as a Tabber Widget, all visible widgets are automatically distributed evenly across the row. Horizontal resizing of widgets in that row is disabled.
Edit Mode Restrictions
- While in Edit Mode, switching between tabs inside the Tabber Widget is disabled.
Filters
- The Tabber Widget does not support Widget Filters applied to itself.
Widget visibility at design time
- The widget selector modal reflects all widgets on the dashboard regardless of viewer access permissions. Viewer-level access is not validated during configuration and remains the designer's responsibility.