Style Guide & Examples

h5p Examples

An H5P plugin makes it easy to create interactive content but it will not appear in PDF exports of the book. Preview and explore the content types used throughout our interactive textbooks below. Click here to find even more examples of H5P activities but remember to check the accessibility of new interaction types.

Settings

Quiz Questions

  • H5P pass percentage is always 100
  • Retry and Show solution (when more than 2 choices) should be enabled
  • When there are Multiple Answers, add “You missed this one!” to the Display if not selected box

iFrames

  • Title: use document title
  • Width: 400px
  • Height: 250px
  • Source: URL to doc is in Pressbooks Media
  • Check resize supported

Tip: If you have to replace a PDF with a different or updated version,  use the “Replace the file, use new file name and update all links” and update the H5P with the new name URL to get the iFrame to update.

Examples

Accordion

Reduce the amount of text presented to readers by using this responsive accordion to create vertically stacked expandable items.

Test Your Knowledge

Examine the following protocols for daily sanitation of single compartment cages occupied by the same cats.

Collage

Create a neat collage from multiple images. Hover over each individual image to view caption text.

Course Presentation (with interactive slides that may include quiz questions)

Create an HTML5-based presentation which allows users to add formatted text, images, external links, multiple choice questions, fill in the blanks, and more!

Dialog Cards

To create digital text and image based flash cards. Audio may also be embedded as an added learning tool.

Test Your Knowledge

Here are 3 cats with severe ulcerations of the mouth and tongue. Which one has ulcers due to QAC toxicity?

Essay (Think About It)

Modifying the Essay feature as seen below allows us to provide students with instant feedback as a response to text that they have composed. Using the “Learning Objectives” textbox to frame the activity, students are prompted to pause and reflect on a scenario.

Think About It

Iframe Embedder

The Iframe embedder uses H5P to display content existing in most JavaScript applications such as a PDF file or presentation.

Image Hotspots

Add hotspots to images that reveal text, images or videos when clicked on. Embed into frame using the “Key Takeaways” textbox.

Find the Problems

Multiple Choice

Test Your Knowledge

 

Question Set

Test Your Knowledge

 

 

License

Icon for the Creative Commons Attribution 4.0 International License

MSMP Digital Textbook Style and Procedures Copyright © 2020 by University of Florida is licensed under a Creative Commons Attribution 4.0 International License, except where otherwise noted.