Embed Dashboard Designer

This guide provides steps to embed the Bold BI Dashboard Designer in edit mode into a web application using an iframe for seamless integration.

Steps to Embed the Dashboard Designer

1. Obtain the Embed URL

Locate the dashboard in the Bold BI UI, click its context menu, and select Get Embed Code.
Embed Code Option

2. Set the Mode to Edit

In the embed dialog, select Edit mode to enable designing or modifying the dashboard.
Mode Option

3. Copy the Embed URL

Click the copy icon in the embed dialog to copy the generated URL.
Copy Embed URL

4. Embed the URL in Your Web Application

Add the copied URL to an iframe in your web application’s HTML. Example:

<iframe src="http://localhost:51777/bi/site/site1/dashboard-designer/8428c9d9-85db-418c-b877-ea4495dcddd7/Predictive%20Analytics/Sales%20Dashboard?isembed=true" id="dashboard-iframe" width="100%" height="100%" allowfullscreen frameborder="0"></iframe>

5. Run the Web Application

Open the web application in a browser. If a login window appears, enter valid credentials, and the dashboard designer will load automatically.
Login Window
Dashboard Designer

Enable Single Sign-On (SSO) (Optional)

To enable seamless authentication and bypass the login prompt:

  • In the embed dialog, toggle the SSO option and select an authentication provider (e.g., Windows Active Directory, Azure Active Directory, OAuth 2.0, or OpenID).
    SSO Windows Example
  • Alternatively, use an Embed Signature to securely bypass the login prompt with token-based authentication.