Adding hotspots to an image using H5P

Tags Moodle h5p

1. Go to the Moodle course you would like to edit and click "Turn editing on" by clicking on the gear at the top right of the page.


2. Under the topic where you would like to add H5P, click "Add an activity or resource". 


3. A new window will open. Scroll down and choose "H5P".


4. A new page will load and now you can choose which H5P feature you would like to use. 

If the H5P feature is not available, simply click the white and blue button on the right called "Get". A new page will load. Click "Install". Once the content has successfully downloaded, click "Use"


5.  Add a title to your image hotspot, the background image, and choose the colour of the hotspots.

 


6. Next, add hotspots to the background image. Click on the image and choose where you would like the hotspot to appear. Add an optional header. Add the pop up content. Pop up content can be text, video, or an image. 


7. To add another hotspot on the same image, click the "Add hotspot" button. 


8. When you have added all relevant hotspots, scroll down and click "Save and Display". 

 

Details

Article ID: 71765
Created
Mon 2/11/19 11:13 AM
Modified
Fri 6/23/23 8:27 PM