Creating a Webviewer Object
This topic describes how to add a new Webviewer Object to a Screen or a Container and its specific properties.
To create a new Webviewer Object, you need to access a Screen in Design mode.
Once you're in the Screen editing page, locate the Label Object from the Screen Objects list in the left panel, then drag and drop it onto your Screen or Container.
The Webviewer Object, just like every other Object, can be moved, resized, duplicated via copy/paste and easily aligned with other Objects on the Screen.
See Configure Screen Objects for more details.
When you create a Webviewer Object, you need to define the web page it will display. You can do this in two ways: by entering a specific web address or by dynamically defining a URL using the Layout.
How to associate the Webviewer with a specific web address
To associate the Webviewer with a specific web address, select the Object and enter the desired URL in the "Web address" field located in the contextual right panel of the Screen editing page.
Once a URL has been entered, the Webviewer Object immediately shows the corresponding web page.
If the web page displayed in the Webviewer Object doesn't fit within its area, scrollbars will appear.
If the Board Platform URL is loaded over the HTTPS protocol, the web address associated with the Webviewer must also start with HTTPS.
The Webviewer does not support web pages that have the following directives in their HTTP header responses: frame-src, X-Frame-Options, frame-ancestors.
How to dynamically define a URL
The URL to be displayed can be dynamically determined using the Layout.
To do so, proceed as follows:
- Select the Object and click the "Configure layout" button (
) at the top right of the page - In the Layout editor, configure at least one Block that will define the URL (either a text Algorithm or a text Cube)
- In the Object Properties panel, select the desired Block in the "Show value" field. The first Block you create will be automatically selected
- Save the Layout
If you use a text Algorithm, the URL must be written in quotation marks and the Layout must contain a Cube (for technical reasons).
Once the Layout is executed, the Webviewer Object immediately shows the corresponding web page.
If the web page displayed in the Webviewer Object doesn't fit within its area, scrollbars will appear.
With this configuration, for example, you can enable the master option on a Data View Object associated with a text Cube that contains the URLs of your suppliers' websites. By clicking on a supplier, the Webviewer Object displays the corresponding web page using the address stored in the Cube.
You can also include substitution formulas in the web address to dynamically change it based on data from Board.
For example, the text Algorhitm whose syntax is "https://www.bing.com/search?q="&@Customer will open a search results page based on the member of the Customer Entity defined in the active Selection.
In the example below, you can see a Webviewer configured with the Algorithm mentioned above in conjunction with a Pager set on the Customer Entity: cycling through all members of that Entity loads a new page in the Webviewer.
Interacting with the Webviewer Object in Design mode
In Design mode, the Webviewer Object doesn't provide any interactive feature and that applies also to the embedded web page: scrollbars will not be operations and links will be disabled. If you need to test the behavior of the Object, please switch to Play mode.
Learn more about: