How to access the iFrame widget

Widgets are the tools with which course administrators create and build the pages of their course.    

The iFrame widget allows users to embed iframes into their OpenLearning course by uploading page assets (HTML, CSS, images, …) in a .zip archive or with an external URL.

In order to access the widget:  

1. Go to the page in your course where you'd like to add this widget.
2. Select Edit mode.
3. In the lefthand widget menu, click on the drop-down menu with the word Core and toggle it to Integration.
4. Click on the iFrame widget icon (or you can hold and drag it wherever you'd like on the page).

How to set up the iFrame widget

After adding the widget to your page, you can set it up by following the instructions below:    

1. Click on the Setup tab at the top of the widget.
2. Edit the widget settings.

Upload method: Choose between uploading a .zip archive or pasting an external URL. 

Display: Choose from the following options:

• Embed within the page
• Open in an overlay
• Open in a new browser window

Height: Input the height (in pixels) you would like the widget to appear as on the course page.

Completion settings

Completing activities on a page is how learners make progress and receive their certificates or complete the course.    

As the administrator, you can modify how each widget tracks this progress.    

To do this, click on the Completion Settings tab on the widget and choose one of the following options:    

No completion tracking: This widget will not count towards completion.    

Completed when viewed:  This widget will count as completed as soon as the learner scrolls past it on the page.  

Share Settings

There are no share settings for this type of widget.

Developer Usage

Developers can enter JavaScript code to automatically resize the height of the displayed area. To update the height of the containing frame, use the postMesssage API to send the following message (e.g. to resize the height to 200px):

{ "event": "resize", "height": 200 }