Embedding: Adding white label dashboards to your website

Embedding: Adding white label dashboards to your website

Dashboard embedding

You can put client dashboards and reports on any page of your website by using dashboard embedding feature.

To setup embedding you should use an iFrame code generated by Octoboard and put it on any page of your website where you want to display client dashboards or reports. You can protect access to embedded dashboards easily by using a PIN security feature from Octoboard or implement your own login.

Embedded dashboards are fully white labeled - all references to Octoboard already removed. To your visitors and clients they will look like a neat feature of your website – a great looking data analytics technology. Octoboard will do all the heavy lifting on the background. All you need is generate iFrame code and put it on your website pages.

How to generate iFrame code for dashboard embedding

iFrame code is generated per Octoboard client. Go to LEFT MENU > SETTINGS > SELECT ORGANISATION > EMBEDDING.

Dashboard embedding feature

‬In embedding tab use the following configuration:

Access Type - specify the level of access you want to give to your clients. Viewer allows read-only access to dashboards, while Editor can modify dashboard configuration – change, remove, reposition widgets in dashboards.

Domain is an optional configuration. By specifying your domain, you will add security. It will guarantee that the generated iFrame code will only work when embedded in your website.

Display switch allows you to configure if you want to show reports, dashboards or both.

Secure access switch allows you to specify a 6-digit PIN code. Users can only see dashboards if they know and enter the PIN.

Language switch will set the language of the displayed dashboards and reports. This will affect timeframe labels. If you would like to change widget titles, you can always do so by modifying widget parameters (use widgets' Top-Left menu > Quick Switch option).

Once you have completed above actions you can copy the generated iFrame code to clipboard and paste it to your website html code.

iFrame code should be inserted anywhere in the part of the html page.

Before embedding the code to your website test is using this public page https://tinyurl.com/try-embed. Paste generated iFrame code there, click "RUN" button and check the results. While testing, make sure you clear "Domain" field above.

Which embedded dashboard will clients see first?

Your clients will see the very last dashboard or report in the list. You can always define which element will be displayed by default. Use drag-and-drop feature of reports and dashboards list to move default element to the bottom of the list.

Drag and drop reports

For more information about sharing data in Octoboard, please read our tutorial Sharing data with clients and internal teams

Can I embed Octoboard dashboards into my Wordpress site?

Absolutely. You embed dashboards by creating a generic iFrame and inserting it to your web pages. Wordpress is no different. You can use any of the available Wordpress iFrame plugins for embedding Octoboard iFrames.

During testing I see a login screen in my iFrame, why is that?

You will see an Octoboard login screen during testing because of multiple sessions that you have. You can ignore it since your clients will never have multiple sessions and will not see the request to authenticate. You can test this case by opening your embedded dashboard in incognito mode or in another browser with cookies deleted.

When I test the dashboard I see "Not authorised". Why?

This is because you entered Domain in the configuration screen (see images above). If during testing you are accessing your iFrame using an editor hosted on another website (Wordpress or Wix, for example), you will get "Not authorised" message from Octoboard. We suggest that you remove domain name from the configuration while testing and set it to correct domain when you are ready to release your embedded dashboards.

Embeds stops working when I use my white label domain (portal.mydomain.com)

You cannot use your white label domain because your CNAME (DNS) records would not support this. You have to use either agency.octoboard.com or app.octoboard.com depending on the Octoboard product that you are using.