To set up H5P.com as a tool in Moodle using LTI 1.3 you need to:
Part 1: Create a registration on H5P.com
Step 1: Log in to H5P.com as an admin user with your e-mail address as user name and your password.
Step 2: Go to Manage Organization
Step 3: Go to "Connect LMS"
Step 4: Press “Add LMS Connection” and select your LMS: Moodle. Select LTI version 1.3 and press “Save”.
Note: If you want to use LTI v1.1 please follow this tutorial
Make note of the following information provided on H5P.com, these are the connection details and look something like this:
- Login URL: https://yourorganization.h5p.com/lti/login
- Redirect URL: https://yourorganization.h5p.com/lti/launch
- Public key: https://yourorganization.h5p.com/pem/jwks/numbers.pem
You’ll be needing these in the next section.
Important: Please, do not copy and paste the information above, it won't work, as it has been edited and are not the actual details you must use. You need to copy the valid values from inside H5P.com as they are personally and randomly generated. It looks something like the image below:
Part 2: Create the tool inside your Moodle site
Perform the following steps:
Step 1: Head over to the “Manage Tools” section of your Moodle site: yourdomain.com/mod/lti/toolconfigure.php
For Moodle versions older than 2.9
Step 2: Press the “configure a tool manually” link and fill in the data provided by your H5P.com registration created in the previous section:
- Tool name: Interactive Content - H5P
- Tool URL: https://yourorganization.h5p.com/
- Tool description: Create, share, and reuse interactive HTML5 content in your browser
- LTI version: LTI 1.3
- Public key: You need to copy and paste the text from the Public key URL in the previous step. (including the "-----BEGIN PUBLIC KEY-----" and "-----END PUBLIC KEY-----" public key lines)
- Initiate login URL: https://yourorganization.h5p.com/lti/login
- Redirection URI(s): https://yourorganization.h5p.com/lti/launch
- Tool configuration usage: Show in activity chooser and as a preconfigured tool
- Remember to enable: The content-Item Message
- Secure icon URL: https://yourorganization.h5p.com/img/h5p-icon.png
For Moodle version 2.9 or newer
Step 2: Press the “configure a tool manually” link and fill in the data provided by your H5P.com registration created in the previous section:
- Tool name: Interactive Content - H5P
- Tool URL: https://yourorganization.h5p.com/
- Tool description: Create, share, and reuse interactive HTML5 content in your browser
- LTI version: LTI 1.3
- Public key type: RSA Key
- Public key: You need to copy and paste the text from the Public key URL in the previous step.
- Initiate login URL: https://yourorganization.h5p.com/lti/login
- Redirection URI(s): https://yourorganization.h5p.com/lti/launch
- Tool configuration usage: Show in activity chooser and as a preconfigured tool
- Remember to enable: The content-Item Message
- Secure icon URL: https://yourorganization.h5p.com/img/h5p-icon.png
- IMS LTI Assignment and Grade Services: Select “Use this service for grade sync and column management”
- Share the launcher's name with tool: Always
- Share launcher's email with tool: Always
- Accept grades from the tool: Always
- Press “Save changes”.
Step 3: Locate the newly created tool and press the “View configuration details” on it. Make note of these details as you will need these in the next step.
Part 3: Add the Moodle details to H5P.com
Step 1: Head back to your H5P.com account, locate the registration you created, and press the “Connection settings” button next to it. The “Add registration data” dialog should appear.
Step 2: Fill in the form using the details from the previous section:
- Client ID: Same as Client ID in Moodle.
- Issuer: Same as Platform ID in Moodle.
- Login URL: Same as Authentication request URL in Moodle.
- Token URL: Same as Access token URL in Moodle.
- Key Set URL: Same as Public keyset URL in Moodle.
- Audience: Leave blank
- Private key(optional): Leave blank
- Press the “Save” button
Step 3: Press the “New deployment” button under the registration and paste the “Deployment ID” provided by Moodle in the previous section. Press “Save”.
Part 4: Verify that it works
Step 1: Head over to a course and turn editing on by toggling the setting in the top right corner, then press the "Add an activity or resource"
Step 2: Click on the Select Content button
Step 3: Find the Newly installed tool
Note: Make sure to select the tool with the name you just installed and not the preinstalled H5P plugins (not H5P or Interactive Content). You can also mark your tools as favorites by clicking the star icon (★), this way it'll be easier to locate them in the future.
Step 2: Create or select any content and press "Insert".
Automatic resizing of H5Ps
If you experience problems with H5Ps getting unwanted scrollbars, it is probably because Moodle's default LTI implementation lacks support for LTI content having dynamic sizing. There's a Moodle plugin, though, that is addressing this issue. The plugin is available here. Note that this plugin is not created by H5P, but it implements LTI resizing the same way as in other LMSes (e.g. Canvas and Brightspace).