Customizing UI Elements in Bold BI Viewer and Designer via JavaScript Embedding
This article will guide you on how to enable or disable various elements in the Bold BI JavaScript embedded application, both in Viewer and Designer modes. You can control the visibility of UI components such as toolbars, export options, refresh, metrics, dashboard parameter and even add custom icons to the dashboard header.
Please refer to the following documentation for detailed guidance:
In Viewer:
Dashboard Header
Hide/Show the Dashboard Header
https://help.boldbi.com/embedding-options/embedding-sdk/embedding-api-reference/members/#showheader
Export Option
Hide/Show the Export Option
https://help.boldbi.com/embedding-options/embedding-sdk/embedding-api-reference/members/#showexport
Refresh Option
Hide/Show the Refresh Button
https://help.boldbi.com/embedding-options/embedding-sdk/embedding-api-reference/members/#showrefresh
Metrics
Hide/Show the Metrics in Dashboard Banner
https://help.boldbi.com/embedding-options/embedding-sdk/embedding-api-reference/members/#showmetrics
Show More Option
Hide/Show the Show More Option in the dashboard banner.
https://help.boldbi.com/embedding-options/embedding-sdk/embedding-api-reference/members/#showmoreoption
Filter Overview
Hide/Show the Filter Overview in the dashboard banner.
https://help.boldbi.com/embedding-options/embedding-sdk/embedding-api-reference/members/#enablefilteroverview
Full Screen
Hide/Show the Full Screen in the dashboard banner.
https://help.boldbi.com/embedding-options/embedding-sdk/embedding-api-reference/members/#enablefullscreen
Theme
Hide/Show the Theme in the dashboard banner.
https://help.boldbi.com/embedding-options/embedding-sdk/embedding-api-reference/members/#enabletheme
Localization Dropdown
Hide/Show the dashboard localization dropdown in the dashboard banner.
https://help.boldbi.com/embedding-options/embedding-sdk/embedding-api-reference/members/#languagesettings
AI Assistance
Hide/Show the AI Assistance
https://help.boldbi.com/embedding-options/embedding-sdk/embedding-api-reference/members/#enableaiassistant
Add Custom Icons to the Dashboard Header
https://support.boldbi.com/kb/article/796/how-to-add-a-custom-item-to-the-dashboard-header-via-embedding
In Designer:
Default Widgets
Hide/Show Default Widgets
https://help.boldbi.com/embedding-options/embedding-sdk/embedding-api-reference/members/#hidedefaultwidgets
Existing Widgets
Hide/Show Existing Widgets
https://help.boldbi.com/embedding-options/embedding-sdk/embedding-api-reference/members/#hideexistingwidgets
Customize Widget Panel
How to customize the widget’s panel
https://support.boldbi.com/kb/article/582/how-to-customize-the-designer-toolbar-using-api
Toolbar
Hide/Show Toolbar in Designer
Use the following configuration:
toolbarSettings: { showToolbar: false }
Data Source Icon
Hide the Data Source Icon in Design View
https://help.boldbi.com/embedding-options/embedding-sdk/embedding-api-reference/members/#dashboardsettingsdatasourceconfig
Sample Datasources
Hide/Show the Sample Datasources option under the datasource configuration in the dashboard designer banner
https://help.boldbi.com/embedding-options/embedding-sdk/embedding-api-reference/members/#hidesampledatasources
Datasource List
Hide/Show the Data source List dropdown configuration in the dashboard designer banner.
https://help.boldbi.com/embedding-options/embedding-sdk/embedding-api-reference/members/#hidedatasourcelist
Expression
Hide/Show the Expression configuration button in the dashboard designer banner.
https://help.boldbi.com/embedding-options/embedding-sdk/embedding-api-reference/members/#hideexpression
Add Custom Icons and Buttons to Embedded Dashboard Designer.
https://support.boldbi.com/kb/article/16414/how-to-add-custom-icons-and-buttons-to-embedded-dashboard-designer
Additional Reference:
.