Accessing H5P in Canvas
You can access H5P in Canvas through the Rich Content Editor (RCE), which is accessible via the edit view of Page, Assignment, Discussion Board, Announcement and Quiz questions.
For this example, we will be adding H5P onto a Canvas page. The first thing you will need to do is either open the page you want to embed the H5P content into or create a new page. Then click the ‘Edit’ button which will open the RCE. (You will automatically go into edit mode if you create a new page.)
Next, you will need to locate H5P in the RCE toolbar by clicking on the more external tools icon.
Clicking on that menu item will open a pop-up showing your H5P library. From here, you will have the option to either insert previously created content or create something new.
Using the dropdown menu, set your Content Type and type Find the Hotspot.
Add a Title
Add Image and Hotspots
Under Background image, click the green plus icon 
to choose the image that you will place hotspots on for this interactive. For example, this could be a model from your course content.
Click the Hotspots tab to start placing hotspots on the image you have uploaded.
In the Hotspots tab, enter your Task description.
This will explain to the student what they need to do to answer the question, so make it a short, direct instruction.
This will explain to the student what they need to do to answer the question, so make it a short, direct instruction.
Click one of the buttons in the bar above the image to place a circular or square hotspot. Choose the shape that is going to cover the most area of the object in your image - for our example, we're going to use a circle.
A pop-up box will open for the details of this new hotspot. Tick the Correct tickbox if this hotspot is a correct answer (you can have as many correct answers as you like or leave it unticked for an incorrect answer.
Enter some Feedback for the hotspot based on whether it is a correct or incorrect answer. One or two sentences work best.
Click Done to place the hotspot on the image.
The hotspot will appear on the image. Click and drag it to the corresponding part of the image based on your feedback. Remember, the hotspot will not be visible to students.
You can edit, reorder and delete hotspots by clicking on them.
Click the pen icon 
if you need to Edit the details you have entered.
if you need to Edit the details you have entered. 
Keep placing hotspots until you have added all your desired answers to the image.
Adjust the size of each hotspot by dragging it at the corners, so that it covers the whole answer area. This is important, as the hotspots you have placed will not be visible to students.
Add some Feedback for clicks in blank areas.
Click Save and Insert. A preview of the H5P object will appear. This will help you see how your questions appear to students.
