logo

Examples of portlets with Iframe

In ELMA you can create Code portlets and add an existing or custom Iframe to them.

The figure above shows two Code portlets with a news website and a currency converter.

Before adding a portlet, make sure that the ELMA server has access to the resource, from which ELMA will load data. Usually, the server is required to have the Internet connection.

 There are many ready-made iframes on the Internet, which you can simply copy and paste on your page. For example, here is the above-mentioned currency converter: 

<iframe src="http://www.thetimenow.com/currency-converter/ccembed.php" frameborder="0" width="350" height="325" scrolling="no"></iframe>

To use it, go to the website http://www.thetimenow.com/currency-converter.php and click Add to Your Site. Copy the generated markup to a Code portlet on the main page in ELMA. If necessary, you can edit the iframe, e.g. adjust its size. To resize it, change the height and width parameters. You can learn more about iframe, for example, here https://www.w3schools.com/tags/tag_iframe.asp

You can also configure the portlet display in ELMA. Set a header, remove a header and/or borders, forbid collapsing.

 

However, you don't have to use ready-made iframes, you can use any link. It is best to use mobile versions of websites because they are optimized for small screens and resolutions. In the first figure, a mobile version of a news website is used. Iframe code: 

<iframe src="http://mobile.reuters.com/" width="600" height="400" frameborder="0"></iframe>

The link to the website is specified in the quotation marks, the width and height parameters define the frame size, and frameborder defines a border of the frame. In this example there is no border, that is why 0 is set.

You can find many ready-made solutions: news, weather forecasts, booking information, etc. Using the Code portlet you can embed them in ELMA in a few minutes.