This will require Builder privileges for setup and implementation.
Inserting a Website into Dashboards
You may want to link a company or external web source onto one or many of your dashboards. This can be done using the iFrame Panel which can display the contents of an external web page within a dashboard frame.
Inserting an iFrame Panel into Dashboards
1. Open your dashboard
2. Click on the folder icon below outline in red
3. Then insert your URL in the box outlined in red.
4. Click the check box next to Enable Pointer Lock API.
Please Note: You may need other iFRAME Sandbox Settings (un)checked as well, depending on what website you are trying to insert into your dashboard.
Now once you save your dashboards and view it, your website will be in your iDashboards.
Issues with your iFrame?
There are many restrictions beyond the control of iDashboards that may not allow a web page to render within the iFrame panel. Sometimes websites are not able to be inserted into an iFrame due to security features they have implemented. In those situations, consider using the feature “Drill to webpage” to open the web page in a new browser tab.
If you are unable to us a website you may get something like this, it may appear mostly blank with just the sad page, but if you hoover over it it shows that the website you selected refused to connect just like in the image below.
This is because of the Fetch Metadata Request Headers, which are to provide servers with enough information to make decisions about whether or not to service a request based on the following:
- the way it was made
- the context in which it will be used
These headers are shown below
They may not always say "SAMEORIGIN" as they could have any of the following values:
cross-site, same-site, same-origin, none
However if they do say SAMEORIGIN, you will not be able to use them in an iFrame Panel, so in those situations, you should consider using the feature “Drilldown to Webpage” to open the web page in a new browser tab.
So how do you know if it says SAMEORIGIN?
- Go to the Webpage
- Right Click and Select Inspect
- Click Network up at the top
- Click ALL on the left next to XHR JS CSS etc.
- If a list doesn't show up hit Ctrl+R and it will populate
- Select the website name in the left column
- Scroll down the right column until you see one of the two, the second one is usually further down the column.
Click to view more on same-site and same-origin.
For More Information:
- Dashboard & Chart Design Articles
- iDashboards Builder Manual 8 Designing Charts
- iDashboards Builder Manual 6.17.4 IFRAME Panel
- iDashboards Admin Manual15.4 Embedded Viewer Mode
- Read Next: iFrame: Embedding Videos
If the above is unable to resolve the issue, then please contact truOI Support for further assistance.