Using embed code is an advanced option that provides more control over the way H5P objects are displayed. It is not recommended for most users and should be approached with caution.

This document will guide you on how to:

Advanced users only

The use of embed code is not encouraged as this requires the editing of HTML code and prevents tracking student progress. It is also harder for a future Unit Assessor or writer to track down the original H5P to make changes.

The + Plus button method is the recommended method to publish H5Ps in a Blackboard site. You should be aware of the risks and be comfortable using embed code before using it with live unit sites.

Introduction

Embed code is a form of HTML, a scripting language used to create web pages. Although using embed code does not necessarily require programming skills, it is advantageous when things go wrong.

Using embed code with a H5P object requires turning on Public publishing. Using Public publishing allows the H5P content to be viewed without requiring a login, but also prevents tracking student progress. Public doesn’t mean that the content will be available on a public repository. The use of public publishing is not generally recommended for unit learning sites.

If you are aware of the risks and still wish to proceed using embed code, the following video steps through the process.

Sizing embed code

By default, a H5P object added using embed code will be responsively resized to fill the entire width of the browser window, with the height automatically scaled to fit (regardless of the Size specified in the H5P publish options).

To make the H5P smaller you can instead use the simpler +plus button method outlined in the Publishing H5P in Blackboard article.

Alternatively, you may write HTML code to set a custom width, but that is outside the scope of this article.

Use embed code to add a H5P to a Blackboard site

Open the H5P and click on Edit. Scroll down to the Publish tab.
Under the Publish tab, check the Public option and then click on the Embed code.
Copy the embed code by clicking on it to copy the code to the Windows clipboard.
To embed the H5P in Blackboard, create a new item in Blackboard to hold it.
On the Bb page where you wish to embed the H5P choose Build Content > Create > Item
Open the HTML Source Code panel by clicking the icon, which is found in the content editor toolbar (You may need to expand the content editor toolbar to view it, by clicking on the expand icon ).

16px20
Paste the embed code into the Source code panel that appears (Right-click and choose Paste). Ensure you click the Save button at the bottom of the HTML Source Code panel.
Then click the Submit button on the Blackboard Item to save the item.

(Please note - it's better to refer to the Online version rather than export, as it's always up to date)