Sample Template for multiple Public Widgets on the same web page

  • 1 July 2021
  • 0 replies
  • 127 views

Userlevel 1

Sometimes it is necessary to publish LP widgets on a central screen/monitor without having to authenticate the user. LogPoint has a built-in feature to publish URL’s that are Public - i.e. no authentication is needed.

This is a great feature, but also implies that only one widget can be displayed on the whole browser. To accommodate this and enable multiple widgets on the same browser page, one can use a template HTML page that contains multiple URL’s that are included with the HTML tag <iframe>. Each <iframe> tag can display a widget, and thus we can have multiple public widgets on the same Web page.

Below is an embryo for such a template. In the example below, there are two <iframe> tags that correspond to two different Public URL’s. The nice thing is that the size and placement of each <iframe> can be specified by using <iframe> attributes. The details of the tag attributes are out of scope for this post, but more information about them can be found here:

https://www.w3schools.com/tags/tag_iframe.asp

If you want to add more widgets on the same page, simply copy from ‘<iframe>’ until the next ‘</iframe>’ and adjust the attributes as you need (most likely ‘width=’ and ‘height=’). And you need to specify the correct Public URL in the ‘src=’ attribute.

The ‘<br>’ tag indicate a Break - i.e. a new line will be used for the following ‘<iframe’>.

 

<html>
<head>
<!--
A simple HTML template to insert multiple LogPoint Public Widgets URLs on the same page. Useful for 'Always On Monitors' to display relevant Widgets.
Mike Blomgren, LogPoint, 2021-06-31


To insert additional Widgets, just copy from <iframe ..... until ... </iframe> and modify the URL to point to the Public URL.

Sample:
<iframe src="https://<public URL>" width="600px" height="300px">
</iframe>

Change the Width and Height values to accomodate the desired Widget size in pixels.

The '<br>' tag inserts a new line, to display widgets beneath each other.

Change the refresh "content" value (in seconds) to set the refresh interval (sometimes not needed, though).


-->

<meta http-equiv="refresh" content="30">
</head>
<body>

<iframe src="https://<public LP Widget URL>" width="600px" height="300px">
</iframe>
<br>
<iframe src="https://<public LP Widget URL>" width="50%" height="400px">
</iframe>


</body>
</html>

 


0 replies

Be the first to reply!

Reply