What is H5P and why should you care?

H5p stands for “HTML 5 Package”. The name, you shouldn’t care so much about.

All you need to know is that H5P is a free web tool used to create interactive content ranging from simple multiple choice questions to very complex interactive books/courses.

https://h5p.org – This website offers support for the free version of H5P.

https://h5p.com – This website offers support for the paid subscription.

Don’t be discouraged. By using the free version, you won’t miss much and you can achieve some awesome results. The paid service of H5P is for specific and special use cases(as will be discussed in the advanced – who uses H5p section).

Basic – Who uses H5P

Mainly, it’s used by teachers and trainers. You can use it to create a simple knowledge check activity to make sure your students understand a topic.

For example, you’ve just taught your students about the solar system and you want to run a couple of drills to see if they remember plant names. You can use basic H5P activities like multiple choice, fill in the blanks, true or false, and much more.

Moderate – Who uses H5P

Beyond simple knowledge checking questions and review activities, the free version of H5P can be a very powerful teaching tool. Activities can be combined into a digital workbook containing over 20 different types of activities. In addition, presentations can be included in these workbooks with progress tracking, scores, and focus on missed questions.

Advanced – Who uses H5P

The advanced use of H5P could be a bit tricky. The type of activities available are the same as the free version. However, what you get for a H5P subscription is full integration of H5P with your institution’s LMS. For example, if your institution uses Blackboard, Moodle, or Canvas, the activities you create using H5P can be directly linked to the grade-book. This provides great oversight over the attempts, progress, and completion of H5P activities. This also means that activity scores can be automatically logged to the grade-book and integrated with your LMS’s features.

Simplest Way to get Started

If you have access to any website using WordPress, Moodle, or Drupal, then you are set. H5P has plugins/modules for all these platforms. It is as easy as installing the plugin/modules and starting to create.

After creating a H5P activity, you can get the embed link and embed it anywhere you want for your students to access.

What I have created here is

I have created a collection of 46 tutorial videos. One video for each H5P module. These are long-form tutorials that are very detailed. They go from installing the specific modules to creating the activities and going over all available options.

Also, you can try every activity I made in my tutorial on website here.

The tutorial videos are available on my youtube channel https://youtube.com/@ed-hermit

The videos are also available along with a live version of the created activity on this website

Please subscribe to my youtube channel as this niche of education and video making is very small with low view count. Every subscription matters.

You can leave any questions or comments either on the tutorial page in this website, or better yet, on the YouTube video itself.

👨‍🏫 How It Feels to Use

When learners open an Interactive Book:

• They’re greeted by a custom cover page 📘—complete with a title, image, and description.
• Navigation is simple with page arrows ➡️ or a table of contents 📑.

Each page is like a mini-lesson:

• 🎞️ A Course Presentation slideshow
• 🔤 Drag-the-Words vocabulary practice
• 🔍 Find the Hotspot image-based activity

It all lives on one scrollable page, and each module contributes to a final score 🏁.

---

🎯 Why It’s Useful

The Interactive Book is perfect for:

🧑‍💻 Online Courses

Deliver a full lesson—video explanations, interactive quizzes, and follow-up tasks—all in one place.

🏠 Flipped Classrooms

Students engage with the lesson at home, arriving to class ready to apply what they learned 💡.

🏢 Training Manuals

Perfect for onboarding: combine policies, walkthroughs, and quick checks to create engaging internal content 📚.

🌍 Language Learning

Mix grammar, audio clips 🔊, translation tasks, and vocabulary games into one cohesive unit.

🕹️ Gamified Learning

Track scores, progress bars, and completions to encourage replayability and challenge learners.

---

🌟 What Makes It Stand Out

🧮 Auto-Scoring & Progress

• Tracks total score across pages ✅
• Shows completion per page 📈
• Displays interaction stats (e.g. how many tasks were attempted)

📋 Flexible Behavior Settings

• Enable/disable progress bars
• Let students check off “I’ve finished this page” manually ✅
• Auto-complete based on activity interaction 🤖

✍️ Custom Text Overrides

Change button labels like:

• “Read” ➡️ “Start Chapter 1”
• “Submit” ➡️ “Check Answer”

🌐 Multilingual Friendly

You can translate interface text for use in other languages 🇪🇸🇫🇷🇯🇵.

---

⚠️ A Few Quirks to Know

Like any tool, it has a few bugs:

• 🧭 Find the Hotspot may not register as “completed”
• ⏳ Timeline module sometimes needs a refresh to display properly in full-screen

But once you’re familiar with these quirks, they’re easy to avoid or fix.

---

✅ Final Thoughts

The Interactive Book is more than a tool—it’s a learning platform in a box 📦.

You get:

• A clean, scrollable layout
• Rich multimedia options
• Deep activity tracking
• A user-friendly experience for both learners and educators

Whether you’re creating an ESL chapter, onboarding course, or flipped lesson—this is H5P at its best 🔝.

---

📢 Want more interactive content tutorials?

👉 Subscribe to Edu-Hermit on YouTube for weekly deep dives into H5P, WordPress, and other education technology for building engaging digital content: youtube.com/@edu-hermit

Got questions or creative ways you’re using H5P? Drop them in the comments—I’d love to hear what you’re building!

🧠 H5P Question Set (Quiz)

The Question Set module in H5P is a flexible and powerful way to bundle multiple question types into a single, trackable quiz. Unlike the Column module, which simply stacks separate content vertically, the Question Set combines all questions into one activity and calculates a total score, allowing for formal assessments and performance tracking.

A key feature of this module is its ability to host a wide range of interactive question types, such as:

• Multiple Choice
• Fill in the Blanks
• Drag and Drop (Text or Image)
• True/False
• Mark the Words
• Essay Questions

Each question retains its own behavior settings, but all are unified under a single structure with cumulative grading, customizable navigation, and global feedback settings.

---

🔍 Key Behavior

• Combines multiple interactive questions into a single quiz
• Cumulative score from all questions is calculated and displayed at the end
• Feedback can be shown based on score ranges (e.g., grade A/B/C/F)
• Optional: Allow or disable backtracking, randomize questions, limit number of questions shown
• Users can optionally see correct answers or retry the quiz

---

📌 Use Cases

• Formal assessments: Create a scored quiz with mixed question types for summative evaluation
• Self-paced review: Design a low-stakes test with retry options and solutions visible at the end
• Placement or diagnostic tests: Randomize a selection of questions from a question bank for initial screening
• Reading comprehension tasks: Combine essay questions, multiple choice, and true/false about a passage or image
• Homework assignments: Track performance by embedding quizzes into WordPress posts and monitoring results

---

⚠️ Limitations

• Questions are navigated one at a time using next/previous buttons; there’s no option to display all at once
• Each question must still be created or imported manually
• Visual layout is rigid; difficult to embed media-rich text followed by questions in a seamless format
• Essay questions are not auto-graded and may skew the total score

---

🧾 Summary

The Question Set is one of the most complete and structured quiz options in H5P. It provides a unified experience for learners, complete with progress indicators, score tracking, and end-of-quiz feedback. It’s ideal for building complete quizzes, tests, and structured activities where you need results from multiple types of questions all rolled into a single score. Though the navigation is sequential and slightly rigid, it remains one of the most trackable and assessable modules in the H5P ecosystem.

📢 Want more interactive content tutorials?

👉 Subscribe to Edu-Hermit on YouTube for weekly deep dives into H5P, WordPress, and other education technology for building engaging digital content: youtube.com/@edu-hermit

Got questions or creative ways you’re using H5P? Drop them in the comments—I’d love to hear what you’re building!

🧩 H5P Column Module (WordPress)

The Column module in H5P acts as a container that allows multiple H5P content types to be displayed in a single, vertically stacked layout. Rather than navigating through content one module at a time (as in question sets or presentations), users scroll through all activities on a single page.

Each H5P activity placed within a column maintains its own layout, settings, and scoring. For example, dialog cards, multiple choice questions, presentations, fill-in-the-blanks, and essays can all appear one after the other in a linear format. Visual separators (horizontal lines) can be placed between modules for clarity, but there’s no way to group scoring across them—each remains an independent unit.

A column can contain both static content (like text and instructions) and interactive content (like quizzes or drag-and-drop tasks). Pasting pre-existing H5P modules into a column is supported, making it easy to reuse previously created activities without duplication of effort.

---

🔍 Key Behavior

• Displays multiple H5P modules in a single scrollable view
• Each activity is scored separately with its own “Check” button
• There is no cumulative score
• Activities retain their individual behavior settings
• All content is presented on a single page, avoiding slide-based navigation

---

🧠 Example Use Cases

• Self-contained review lessons: Combine a video, summary text, and a mix of practice activities like MCQs, fill-in-the-blanks, and an essay response into one flow.
• Pronunciation or vocabulary practice: Use dialog cards followed by short-answer or audio response tools.
• Mini workbooks: Stack 5–10 exercises with brief instructions to create a self-paced unit on one skill.
• Assessment practice: Offer learners a mock exam with various question types, all accessible without navigating across different screens.
• Course module hubs: Combine course presentations, review questions, and reflection prompts in one package.

---

⚠️ Limitations

• No final score that combines all activities
• Individual modules are functionally disconnected
• Can’t adjust spacing between modules—only a horizontal line separator is available
• Activities are not submitted as a package (no centralized tracking)

---

🧾 Summary

The Column module offers a way to visually organize and bundle multiple interactive elements in a streamlined, vertical format. It’s especially useful for instructors or course designers who want to create a seamless learning experience without forcing learners to jump between separate modules. While it lacks integrated scoring or backend submission, it works well for practice, exploration, and low-stakes engagement.

📢 Want more interactive content tutorials?

👉 Subscribe to Edu-Hermit on YouTube for weekly deep dives into H5P, WordPress, and other education technology for building engaging digital content: youtube.com/@edu-hermit

Got questions or creative ways you’re using H5P? Drop them in the comments—I’d love to hear what you’re building!

🔊 How to Use the Audio Module in H5P (WordPress)

The H5P Audio module is a lightweight tool that allows you to embed simple audio players into your WordPress site. Whether you’re looking to add background music, voice instructions, or audio clips, this module offers just enough customization for various use cases.

---

🎧 What Does It Do?

With the Audio module, you can:

• Upload or link to an audio file
• Choose from 3 player styles: minimalistic, full, or transparent
• Enable or disable controls like play, pause, volume, and download
• Decide whether to auto-play the audio when the page loads

---

🧠 Use Cases

• Listening activities in ESL or language learning
• Instructions or narration for a lesson
• Background music using the transparent/auto-play combo
• Organizing a library of reusable audio clips
• Embedding audio inside interactive H5P content like columns or workbooks

---

🎛️ Audio Player Style Comparisons

Style	Description	Best For
Minimalistic	Tiny button, no scrub bar or volume control	Small UI, background sounds
Full	Playback controls, scrubber, volume, download	Instructional or learning use
Transparent	Invisible player, often used with autoplay	Background narration/music

⚠️ Modern browsers may block autoplay unless the user interacts with the page first.

---

💡 Pro Tips

• 📁 Upload your own audio for full control over the content
• 🎵 Want audio in an interactive workbook? You can:
  1. Add it directly as a content block
  2. Or create it as a standalone module and reuse it by copy-pasting
• ⚠️ There’s no place to add text instructions in the audio module, so use your WordPress post content to provide context

---

📌 Summary: Two Main Uses

1. Simple Audio Embedder
   Perfect for standalone audio files on a page—choose full or minimal UI, autoplay, etc.
2. Reusable Audio for Interactive H5P Content
   Use it to insert audio into interactive workbooks, columns, or presentations by copying from external audio modules.

---

📢 Want more interactive content tutorials?

👉 Subscribe to Edu-Hermit on YouTube for weekly deep dives into H5P, WordPress, and other education technology for building engaging digital content: youtube.com/@edu-hermit

Got questions or creative ways you’re using H5P? Drop them in the comments—I’d love to hear what you’re building!

🎙️ How to Use the Audio Recorder in H5P (WordPress)

The Audio Recorder module in H5P is a lightweight tool that allows users to record their voice, pause/resume, and download their audio. While limited in terms of assessment or feedback features, it can still be quite useful—especially for language practice or self-reflection tasks.

---

🧭 What Does It Do?

The Audio Recorder allows users to:

• 🎤 Record their voice by clicking a button.
• ⏸️ Pause and resume the recording.
• 🎧 Listen to their recorded audio.
• 💾 Download the audio file for personal use.
• 🔁 Retry and re-record.

⚠️ Important: The recording is not saved to the server and is not accessible by instructors/admins. It’s strictly local and user-controlled.

---

🔄 Example Use Case

Prompt:
“Can you list all the months of the year in order?”

Students:

1. Read the prompt.
2. Click “Record” and speak.
3. Pause if needed.
4. Click “Done” to finish.
5. Play back their recording or download it.

This tool is ideal for pronunciation practice, verbal fluency drills, or adding a simple voice recorder to your site.

---

🛠️ How to Set It Up

1. Install the Module

• Go to H5P Content in your WordPress dashboard.
• Click “Add New”.
• Search for “Audio Recorder”.
• Click Get to install (if not already installed), then select it.

2. Create Your Recorder

• Add a title (e.g., “Audio Recorder”).
• Add a task prompt (e.g., “Can you list the months of the year in order?”).
• Optionally customize interface text (under “Text overrides and translations”).

✅ That’s it—very minimal setup.

---

👁️ Preview & Test

Once created:

• The user sees a prompt, record button, and timer.
• After recording, they can:
  • Listen to the audio.
  • Download it.
  • Retry and record again.
• You’ll also see a live audio waveform while recording, which is a nice visual touch.

🔒 Browser Permissions: On first use, the browser will ask for mic access. The user must click “Allow” for it to work.

---

🌐 Embedding It into a Post

To use the recorder in a blog post or lesson:

1. Copy the shortcode from your created H5P activity.
2. Go to Posts > Add New.
3. Give it a title (e.g., “Audio Recorder Activity – #40”).
4. Add a Shortcode block.
5. Paste the shortcode, then publish the post.

The recorder will appear in your post, ready to use.

---

❗ Limitations

• ❌ No server-side storage — audio is not submitted to the backend.
• ❌ Instructors cannot access user recordings.
• ❌ Not ideal for graded assignments or formal feedback.
• ✅ Can be included in Interactive Workbooks or Columns in H5P.

---

💡 Final Thoughts

The Audio Recorder is simple, clean, and easy to implement. While it’s limited in functionality, it’s a great tool for:

• 💬 Pronunciation drills
• 🗣️ Speaking practice
• 🎙️ Adding basic voice capture to any page

---

📢 Want more interactive content tutorials?

👉 Subscribe to Edu-Hermit on YouTube for weekly deep dives into H5P, WordPress, and other education technology for building engaging digital content: youtube.com/@edu-hermit

Got questions or creative ways you’re using H5P? Drop them in the comments—I’d love to hear what you’re building!

🌐 Using the iFrame Embedder in H5P (WordPress)

The iFrame Embedder in H5P is a simple but versatile tool for displaying external content within your WordPress site. While it lacks deep integration with other H5P content types, it allows you to pull in a variety of media—videos, PDFs, websites, presentations—into your course or site using standard iframe functionality.

⚠️ Note: On WordPress, the iFrame Embedder has limited functionality. You cannot embed H5P content inside itself or use it in complex content types like Question Sets or Interactive Books.

---

🔧 What Can You Embed?

You can use the iFrame Embedder to display content hosted outside your WordPress site, including:

• 🖼️ Images
• 📄 PDFs (external or uploaded via WordPress Media Library)
• 🌍 Websites (if they allow embedding)
• 🎞️ Videos
• 📊 Interactive Presentations (like Prezi)

It essentially works by displaying a window to another source using an iframe.

---

✏️ Key Settings:

• Width & Height: Set in pixels (e.g., 600px). You can also set a minimum width for responsiveness.
• Fixed Height Only: H5P currently does not support auto-height iframes.
• Source URL: Paste the URL of the content you want to embed (PDF, video, webpage, etc.).

---

🧪 Examples:

✅ Embed a PDF:

• Upload a PDF to WordPress → Copy the file URL → Paste it in the source field.
• The PDF will appear embedded and scrollable.

✅ Embed a Website:

• Works only if the website allows embedding (some sites block iframe access).
• Example: Embedding https://vmix.com works, but some secure sites may reject loading.

✅ Embed a Prezi:

• Use the embed code from Prezi and paste the src URL into H5P’s source field.
• Resize the height/width for a better fit.

---

🚫 Limitations:

• ❌ Cannot be used within other H5P content types like Interactive Books or Presentations.
• ❌ Cannot embed H5P content itself due to WordPress permissions.
• ❌ Some websites may block iframe embedding for security reasons (e.g., mixed HTTP/HTTPS).

---

💡 Use Cases:

• Embed class readings (PDFs) directly into your lessons.
• Show live presentations without hosting them.
• Display interactive tools or external websites within your WordPress course.

---

If you’ve found creative ways to use this tool—or know a workaround for embedding H5P content—drop a comment or let others know!

📺 Thanks for watching/reading, and see you next time!

📢 Want more interactive content tutorials?

👉 Subscribe to Edu-Hermit on YouTube for weekly deep dives into H5P, WordPress, and other education technology for building engaging digital content: youtube.com/@edu-hermit

Got questions or creative ways you’re using H5P? Drop them in the comments—I’d love to hear what you’re building!

🧠 Guess the Answer (H5P on WordPress)

The Guess the Answer activity is a straightforward, interactive tool built with H5P that lets users engage with a single image or video by trying to guess what’s being shown. The setup is minimal: you display a piece of media, ask a question (like “What is this animal called?”), and let the learner think before clicking a button to reveal the correct answer.

There’s no scoring, no tracking—just a quick moment of interaction designed to prompt recall or spark curiosity. A hover text can be added over the image for an extra clue, but overall, the format stays clean and simple.

What makes it useful?

• 🧒 For young learners, it works great for vocabulary checks—animals, fruits, landmarks, or simple objects.
• 🌍 Language teachers can use it to introduce new words with visual cues before a lesson.
• 🎥 Media-based learning can include a short video clip followed by a “What just happened?” question.
• 🧠 Memory games or review exercises—students guess from memory, then self-check.
• 🧘 Low-pressure engagement for self-study or warm-up activities before quizzes or discussions.

It’s not meant for assessment or tracking progress, but it fits perfectly when you want to encourage curiosity or reinforce visual learning in a lightweight, zero-stress way.

📢 Want more interactive content tutorials?

👉 Subscribe to Edu-Hermit on YouTube for weekly deep dives into H5P, WordPress, and other education technology for building engaging digital content: youtube.com/@edu-hermit

Got questions or creative ways you’re using H5P? Drop them in the comments—I’d love to hear what you’re building!

🎭 The H5P Personality Quiz Activity: What It Does & How It Can Be Used

The H5P Personality Quiz is a dynamic, interactive activity that guides users through a series of questions and reveals a personalized result based on their responses. Each answer is associated with one or more predefined “personalities,” and the final result is calculated by determining which personality matches most closely with the user’s choices.

At its core, the activity simulates the familiar format of BuzzFeed-style personality tests — a lightweight, user-friendly interaction where users answer questions like “What do you like to do on weekends?” or “How do you prepare for an exam?” and then receive a persona like “The Outgoing One,” “The Hermit,” or “The Outcast.” Each persona comes with a short description and an optional image to reinforce the result.

The quiz can display results in multiple ways — from simple text-based feedback to more engaging visual formats, such as a “Wheel of Fortune” spinner that randomly highlights the user’s dominant personality, adding an element of anticipation and play.

The experience is highly customizable:

• Questions can have images and multiple answer choices.
• Answers can be mapped to more than one personality.
• The look and feel of the quiz (colors, fonts, animations) can be adjusted.
• The final result is determined by the most frequently associated personality from the user’s answers.

---

🌟 What Makes It Unique?

Unlike standard quizzes that test knowledge or provide right/wrong feedback, the Personality Quiz:

• Doesn’t have correct answers — it categorizes, not scores.
• Adapts its result based on user behavior, not logic.
• Feels more like self-discovery or entertainment than evaluation.

---

🔍 Use Cases Beyond Personality Testing

While it’s labeled a “personality” quiz, the format opens doors for creative applications far beyond that:

1. Career or Learning Style Match

Help users discover their learning preferences, strengths, or potential career paths based on how they answer situational questions.

Example: “Which project excites you most?” → Designer / Analyst / Leader

2. Product or Service Recommendations

Use the quiz format as a lightweight recommendation engine to match customers with products, services, or content based on preferences.

Example: “What’s your ideal Saturday?” → Suggest a subscription box, travel package, or playlist.

3. Interactive Storytelling

Turn each question into a narrative branch, where user responses shape their character in a story world, leading to a unique outcome.

Example: “Choose your weapon…” → Warrior / Mage / Rogue

4. Onboarding or Orientation Tools

Use the quiz to guide users toward tailored onboarding materials or tutorials depending on their background or goals.

Example: “What’s your experience with coding?” → Beginner Track / Advanced Track

5. Awareness and Advocacy

Create quizzes that lead users to understand their alignment with certain social, political, or environmental values — a soft way to raise awareness.

Example: “What do you value most in your community?” → Activist / Volunteer / Policy Maker

---

🎮 The Experience

The flow of the quiz is smooth and game-like. Visual feedback, animations, and the ability to retake the quiz make it feel more like an interactive experience than a form. Images can be used for each question, answer, and result, making it visually engaging.

At the end, users can reflect on their result, share it, or explore more content based on their outcome — all within a single seamless interaction.

---

💡 A Tool for Creativity

The real power of the Personality Quiz lies not in the personalities themselves, but in how creators choose to define and use them. Whether for fun, education, marketing, or engagement, this tool is as flexible as your imagination allows.

Have a unique use for it? That’s the whole point.

📢 Want more interactive content tutorials?

👉 Subscribe to Edu-Hermit on YouTube for weekly deep dives into H5P, WordPress, and other education technology for building engaging digital content: youtube.com/@edu-hermit

Got questions or creative ways you’re using H5P? Drop them in the comments—I’d love to hear what you’re building!

📱 The H5P “KewAr Code” Activity: Turning QR Codes into Smart, Interactive Tools

The H5P KewAr Code activity—despite its quirky spelling—is a powerful tool that transforms simple QR codes into dynamic, interactive gateways to content, contacts, events, and more. Integrated into WordPress via the H5P plugin, this activity allows users to generate QR codes with a variety of embedded information types, which mobile devices can instantly recognize and act on.

Rather than merely linking to URLs, these QR codes can store structured data such as contact details, calendar events, H5P content, and more—allowing users to interact directly with the encoded information in just a few taps.

---

🧩 What It Does

At its core, the KewAr Code activity enables the creation of QR codes that embed one of several types of data. When scanned with a smartphone or tablet, the code triggers specific actions depending on the content type. For instance, it may prompt the user to save a contact, add an event to their calendar, open a map, or launch a website.

Once created, each QR code can be embedded in a WordPress post or page via a shortcode, or exported and used in physical formats like posters, business cards, or flyers.

---

💡 Supported Content Types & Use Cases

The KewAr Code activity supports a variety of content types—each opening up different real-world applications:

👤 Contact Information (vCard)

Use Case: Networking, business cards, events

• Encodes full contact details (name, title, organization, phone, email, address, URL).
• Scanning the QR code prompts the user to save a new contact on their phone.

📆 Event (Calendar Entry)

Use Case: Conferences, public events, invitations

• Users scan the QR code to instantly add an event—with title, date, time, and location—to their device’s calendar.

📧 Email Address

Use Case: Direct communication, support, inquiries

• Launches the user’s email client with a pre-filled recipient address, simplifying the process of reaching out.

📦 H5P Content

Use Case: Learning materials, interactive experiences, digital signage

• Embeds a link to any H5P content (like quizzes, videos, or games). When scanned, users are taken directly to the activity.

📍 Geolocation (Latitude/Longitude)

Use Case: Business directions, event venues, outdoor installations

• Opens the device’s map app with a pin dropped at the specified coordinates.

📞 Phone Number

Use Case: Customer service, emergency contact, sales

• Triggers a prompt to call the embedded phone number directly.

💬 SMS (Text Message)

Use Case: Lead generation, service inquiries, automation

• Opens the SMS app with a phone number and message pre-filled—ideal for simple “Text to Connect” campaigns.

📄 Plain Text

Use Case: Ingredient lists, instructions, historical info

• Displays a block of text. Some devices also offer the option to search it online.

🌐 URL

Use Case: Website promotion, product pages, sign-ups

• Redirects users to any URL when scanned—works especially well for mobile-first landing pages or portfolio links.

---

📦 Real-World Applications

The modularity of this activity makes it ideal for countless use cases across industries:

• Education: Teachers can create posters that link to interactive H5P activities. Students scan to access learning materials instantly.
• Events & Conferences: QR codes can contain schedules, location directions, or vCards for speakers and attendees.
• Retail & Marketing: QR codes placed in stores or on packaging can offer product info, promotions, or contact support directly.
• Public Installations: Museums, galleries, and parks can offer digital experiences or narratives without app installs.
• Customer Service: Simplifies ways to reach out via call, SMS, or email—removing friction from support inquiries.

---

⚙️ Dynamic Behavior & Management

One of the most useful features is that the QR code content remains editable from the backend. That means once a QR code is placed on a page or printed out, its destination or content type can still be changed—without updating the QR code image. This offers an excellent degree of flexibility and control.

The behavioral settings also allow basic customization, including alignment, display size, and language/label overrides.

---

🔄 A Bridge Between Physical and Digital

The H5P KewAr Code activity acts as a seamless bridge between printed materials and digital interaction. It supports a mobile-first approach by allowing real-world objects and printed assets to link users directly to valuable, contextual, and interactive experiences.

With QR codes now ubiquitous—and users increasingly familiar with scanning them—the tool provides an easy and elegant way to deliver content or connect with people in just one or two taps.

---

🧠 Final Thoughts

While the KewAr Code activity may seem simple at first glance, it’s a robust and flexible tool with real-world utility across sectors. Whether used to share information, prompt user actions, or enhance engagement, it enables WordPress and H5P users to make everyday interactions faster, smarter, and more accessible.

It’s not just about creating a QR code—it’s about creating an experience.

📢 Want more interactive content tutorials?

👉 Subscribe to Edu-Hermit on YouTube for weekly deep dives into H5P, WordPress, and other education technology for building engaging digital content: youtube.com/@edu-hermit

Got questions or creative ways you’re using H5P? Drop them in the comments—I’d love to hear what you’re building!

🧾 The H5P Documentation Tool: A Flexible Framework for Project Planning and Reflection

The H5P Documentation Tool is a versatile activity type designed to help users structure and articulate complex processes, project plans, and reflective narratives in a clear and organized way. Integrated seamlessly into WordPress via the H5P plugin, it offers a lightweight but surprisingly capable interface for capturing user-generated input across a structured series of pages.

📚 What It Is

At its core, the Documentation Tool is a templated, interactive content type that supports a mixture of free-text input, goal-setting, self-assessment, and document generation. It allows users to move through a predefined sequence of pages where they can enter information, set objectives, evaluate progress, and finally export everything as a polished Word document.

It’s best thought of as a guided writing and planning activity, especially well-suited for personal, academic, or project-based contexts where structured reflection or documentation is useful.

🧩 Key Components

The tool is built from four types of pages:

• Standard Page: A flexible page that can contain text, text input fields (both short and long-form), and images. It is ideal for introductory content or descriptive sections like “Project Info” or “Background.”
• Goals Page: Allows users to define multiple goals. Each goal is entered individually and tracked.
• Goals and Assessment Page: A follow-up to the Goals Page, where users rate their progress against each goal using predefined assessment levels (e.g., “Not started,” “50%,” or “Completed”).
• Document Export Page: Combines all the entered data into a structured document that users can either download as a .docx file or copy and paste elsewhere.

Despite its simplicity, these four page types are adaptable enough to build complex documentation flows.

---

🔍 Example Activity: Project Documentation Template

A typical use of the Documentation Tool might include:

1. Introductory Page: Users enter the name of the project, start and end dates, and a description.
2. Goal-Setting Page: They add as many project goals as they want.
3. Progress Evaluation Page: Users self-assess their progress against those goals.
4. Export Page: The entire record can be exported for submission, printing, or archiving.

Each section is interactive, with required fields, input validation, and clear instructions.

---

💡 Possible Use Cases

While originally intended for project documentation, the tool lends itself to many other applications:

1. Academic Reflection & Journals

Students can use it to reflect on learning outcomes, assess their own progress, and export reports for submission. Instructors can provide prompts for each section.

2. Research Planning & Protocols

Researchers may document study plans, hypotheses, and track milestones. The tool becomes a lightweight lab notebook or planning document.

3. Grant or Funding Applications

Organizations can structure application templates, allowing team members to fill in key sections collaboratively and export final versions for submission.

4. Employee Onboarding & Training Logs

HR teams can build guided forms where new employees document training goals, track progress, and submit summaries.

5. Creative or Editorial Project Briefs

Writers or designers can use the tool to outline briefs, track deliverables, and document iterations on a project.

6. Client Intake Forms or Service Scoping

Consultants or service providers might use the tool to capture detailed client information in a format that is easy to export and share internally.

7. Post-Project Reviews or Case Studies

Teams can use the template for structured project retrospectives, allowing for narrative input and quantitative assessments, all exportable as documentation.

---

⚠️ Limitations

One key limitation is the absence of a Submit button—user data is only available to the end-user and must be exported or copied manually. This limits its use in situations where submissions need to be collected automatically, unless additional plugins or workarounds are implemented.

However, the ability to generate a clean .docx file makes it a great companion to processes that still rely on document-based workflows.

---

🧠 Final Thoughts

The H5P Documentation Tool fills a unique niche: it acts like a simplified form builder blended with a lightweight report generator. Its greatest strength lies in how structured it is without being rigid, making it ideal for thoughtful, multi-step activities that combine planning, goal-setting, and reflection.

It’s not a replacement for more powerful survey or form tools—but for teams and educators looking to enable structured documentation without code or complex setup, it’s a solid option that encourages clarity and self-guided input.

📢 Want more interactive content tutorials?

👉 Subscribe to Edu-Hermit on YouTube for weekly deep dives into H5P, WordPress, and other education technology for building engaging digital content: youtube.com/@edu-hermit

Got questions or creative ways you’re using H5P? Drop them in the comments—I’d love to hear what you’re building!

🌿 H5P Branching Scenario on WordPress: What It Is and What It Can Do

The Branching Scenario module in H5P is a dynamic, choice-based activity that lets learners explore multiple outcomes based on their decisions. At its core, it functions like an interactive story or guided simulation. Each step in the experience unfolds based on the user’s previous choices — creating a personalized, adaptive journey.

What sets Branching Scenario apart is its flexibility. You can integrate various types of content at each stage, including:

• Course presentations
• Videos (YouTube or uploaded)
• Images and image-based interactions
• Text blocks
• Branching questions
• Custom end screens

The entire experience is designed around decision points, which act like forks in the road. These can send users forward, backward, or in entirely different directions, depending on how they answer a question or make a choice.

---

🛠️ What It Supports

• Multimedia: You can embed video clips, still images, and interactive presentations at different stages of the scenario.
• Feedback: Each choice can trigger custom feedback — including messages, imagery, or redirection to previous steps.
• Flexible logic: Branching logic is controlled using dropdowns that tell the system where to go next depending on the user’s response.
• Custom endings: Scenarios can conclude with tailored messages, images, or follow-up instructions.

---

🧩 How It Works (In Action)

Imagine a scenario that begins with a short course presentation — for example, about African animals. After watching, the learner is asked a question: Which animals were covered in the presentation?

• If the learner answers incorrectly, they’re taken back to the presentation to study again.
• If they answer correctly, they’re congratulated and offered new activity choices: go skydiving, try car racing, or go diving.

Each of these options launches a different path:

• Skydiving shows a video and ends with a message about fixing your hair (with an image of a comb).
• Diving leads to a diving video and a message with a towel image — the end of that path.
• Car racing is more complex: it shows a video, simulates a crash, and then asks what the learner wants to do next — go back and check their memory or proceed and waive responsibility. Depending on the choice, the scenario ends or loops back to the start.

The flow is visual, nonlinear, and highly customizable — allowing for endless permutations and unique learning paths.

---

💡 Use Cases

Branching Scenario is a rich, narrative-driven tool. While it can be used in simple ways, it truly shines when it’s used to simulate decision-making, consequences, or process-based workflows. Some ideal use cases include:

🎭 Interactive Stories or Games

Great for building “choose your own adventure” style experiences — learners can guide a character through challenges, make story-altering choices, and explore different endings.

🧠 Training Simulations

Useful for job training or compliance scenarios. For example: What should a nurse do in an emergency? How should a manager respond to a workplace complaint? Each response leads to a different path, reinforcing decision-making skills.

📚 Scenario-Based Learning

In educational contexts, you can simulate real-world problems in subjects like ethics, environmental science, or psychology. Students learn by making decisions and seeing the outcomes.

🎥 Interactive Video Experiences

You can embed videos with branching decisions between them. Think of interactive documentaries, case studies, or marketing walkthroughs — where viewers choose what to see next.

🧭 Guided Learning Paths

Learners can be routed through different resources based on what they know (or don’t know). This adaptive structure works well in e-learning modules that assess comprehension before moving forward.

---

🔍 What It Doesn’t Do

• No free-form input: All interactions are multiple-choice or selection-based — users don’t write their own responses.
• Limited scoring control: It’s not meant to be a quiz tool. While scoring is possible, the value lies more in the experience than the grade.
• No built-in analytics: You’ll need an LMS integration or external tracking if you want detailed user data.

---

🎯 Bottom Line

H5P’s Branching Scenario module is perfect for creative, story-driven, or decision-based learning activities. It’s one of the most flexible tools in the H5P ecosystem, capable of blending multiple media types into a unified, immersive experience. Whether you’re building a training simulation, a branching case study, or a lighthearted interactive game, this module lets you take your audience on a path that feels personal and responsive.

📢 Want more interactive content tutorials?

👉 Subscribe to Edu-Hermit on YouTube for weekly deep dives into H5P, WordPress, and other education technology for building engaging digital content: youtube.com/@edu-hermit

Got questions or creative ways you’re using H5P? Drop them in the comments—I’d love to hear what you’re building!

🎓 H5P Course Presentation Module on WordPress

Welcome, everyone! Today I’m sharing how to create an interactive course presentation using the H5P Course Presentation module on WordPress.

This module lets you build a slideshow packed with media, interactive tasks, and navigation — all in one place. Let’s take a look at what it can do and how you can use it.

⸻

👀 Preview: What We’ll Be Making

Here’s a sample of what we built:

• 🔢 10-slide presentation
• 🖊️ Text, shapes, and links
• 🦁 Clickable silhouettes to navigate to animal pages
• 🎥 Embedded video
• 🧠 Exportable text & drag-and-drop tasks
• 📊 Summary with scores at the end

This module is perfect for teachers, presenters, or anyone looking to share content interactively.

⸻

🧱 What You Can Add

You can add:

• 🖊️ Text
• 🔗 Links
• 🖼️ Images
• 🔷 Shapes (rectangle, circle, lines)
• 🎥 Video or 🎧 Audio
• 🔘 Buttons (Go to Slide)
• ❓ Fill in the Blanks, Multiple Choice, True/False
• 🧠 Drag and Drop, Mark the Words, Dialog Cards
• 🧾 Continuous Text, Exportable Text Area
• 📊 Summary slides
• 🐦 Twitter Feed (experimental)

⸻

🧾 Continuous Text

A great tool for handling long blocks of text:

• Add all your text into the first slide.
• Use the Continuous Text element on following slides — it will automatically continue from where it left off.
• Great for storytelling, chapters, or long articles.

⸻

💬 Exportable Text Area

Let users answer questions or reflect:

• Users can type their own text (e.g., “What did you learn about animals?”)
• Text can be exported at the end of the presentation.
• Ideal for reflection, journaling, or personal input.

⸻

🧪 Bonus: Twitter Feed (⚠️ Not Working)

The Twitter User Feed element currently does not work without Twitter API setup. I tried usernames with and without @, but no luck. If you figure it out, let me know!

⸻

🧠 Adding Activities from Other Modules

Here’s a useful trick:

• Copy an existing activity (e.g., Drag and Drop) from another H5P module.
• Paste it directly into a Course Presentation slide.
• Edit the copy without affecting the original!

✅ Works great for reusing content across modules.

⸻

📊 Summary Page

The final slide includes:

• A summary of scores from all activities
• Options to retry, view answers, or export text

Perfect for tracking student understanding or self-review.

⸻

🧠 Use Cases for the H5P Course Presentation Module

This versatile tool can be used in many contexts, both educational and professional. Here are some ideas:

⸻

🎓 1. Online Lessons for Students

Use it to create engaging, structured lessons with interactive elements like:

• Embedded videos 🎥
• Clickable image navigation 🖼️
• Drag and drop and quiz activities 🧩
• Exportable text fields for reflection 📝

✅ Ideal for flipped classrooms, homework, or remote learning.

⸻

📚 2. Self-Paced E-learning Modules

Great for asynchronous learning — learners move at their own pace:

• Combine reading with interactive activities
• Provide feedback instantly
• Summarize performance at the end

✅ Perfect for LMS platforms, staff training, or corporate learning.

⸻

🧪 3. Interactive Science or Geography Lessons

Create branching presentations like:

• 🧬 Biology: Navigate between organs in a human body
• 🌍 Geography: Clickable maps to learn about countries or ecosystems
• 🌌 Astronomy: Jump between planets or stars with videos and text

⸻

🐾 4. Children’s Educational Stories

Make interactive digital books with:

• 🐘 Clickable animals that “speak”
• 🎨 Shapes and colors to identify
• ✏️ Input fields to write or draw responses

✅ A creative way to blend storytelling with learning.

⸻

📢 5. Product Demos & Internal Training

For businesses, use it to:

• Train new staff on tools or processes
• Demo product features step-by-step
• Collect feedback with exportable text areas

✅ Combine text, shapes, and videos into one seamless walkthrough.

⸻

🧘 6. Mindfulness, Journaling, and Reflection

If you’re in coaching, wellness, or self-development:

• Use exportable text areas for journaling
• Add inspirational videos or quotes
• Let users reflect at their own pace

✅ A great fit for therapists, coaches, or motivational content creators.

⸻

🛠️ 7. Tech Tutorials or App Walkthroughs

Combine screen recordings with:

• Annotated steps
• Clickable menus for navigation
• Inline quizzes to check understanding

✅ Ideal for software onboarding or digital skills training.

🚀 Final Thoughts

The H5P Course Presentation module is one of the most powerful and flexible tools in H5P’s toolbox:

• Easy to use
• Rich multimedia support
• Interactive features
• Works well on desktop and mobile
• Fully embeddable in WordPress

Whether you’re an educator, content creator, or just looking for a better way to present ideas, this module is worth exploring.

📢 Want more interactive content tutorials?

👉 Subscribe to Edu-Hermit on YouTube for weekly deep dives into H5P, WordPress, and other education technology for building engaging digital content: youtube.com/@edu-hermit

Got questions or creative ways you’re using H5P? Drop them in the comments—I’d love to hear what you’re building!

🎁 Using the H5P Advent Calendar for More Than Just Christmas

So this isn’t really an advent calendar — not in the traditional sense anyway. I mean, yes, I used the H5P Advent Calendar module on WordPress, but not to count down to Christmas. Instead, I tried bending it into something more useful for me: a simple interactive display.

In this case, it was about the Brazilian soccer team. Each door on the calendar became a box I could fill with something different — a photo, a short player bio, even a YouTube video. Some doors opened to show a team photo, others showed a player’s profile or linked out to a website. One even autoplayed a video highlight.

Not bad for a module originally meant for daily chocolates.

⸻

🧩 Here’s how it went

You’re stuck with 24 boxes. The module won’t let you add more, and weirdly, if you try to delete some — like, say, use only 10 boxes — the whole thing just breaks. Doesn’t load at all. It’s still in beta, so fair enough, but worth knowing before you start.

So I kept all 24. Just left the ones I wasn’t using with a message that says, “Nothing to see here.”

Each box lets you upload a square image as the “cover” — and yeah, square is key. If your image isn’t a 1:1 ratio, it gets weirdly cropped and looks off-center. I learned that the hard way. Same deal for background images (the image behind the open door).

What can you add per door?
• 🖼️ Image
• 📝 Text
• 🎧 Audio
• 🎥 Video
• 🔗 Link

But only one content type per box — no combos.

⸻

⚠️ Not everything is perfect

Here are a few things that felt off or needed tweaking:

• 🟢 The little door knobs looked clunky → hid them
• 🔢 The numbering (1–24) wasn’t useful → turned it off
• 🟥 The default calendar background was bright red → swapped it for white
• ❄️ There’s a snow effect → skipped that
• 🛠️ The “design mode” must stay on — otherwise doors stay locked until December

And a reminder: if your image isn’t square, expect some… weirdness.

⸻

💡 Surprisingly flexible

I honestly didn’t expect much from this module. It’s quirky and a bit dated, but once you figure out the limitations and work around them, it actually turns out pretty useful.

Here’s what I ended up with:

• 🧍 Click a box → see a player’s photo
• 📄 Read their bio and career details
• ▶️ Watch a highlight video
• 🌐 Visit an external site for more info

It works on both desktop and mobile. The scroll bar pops up when there’s too much content, and links/video embeds are all functional. All I did was copy the shortcode into a WordPress post using the Shortcode block — no extra plugins.

⸻

🛠️ What you could use it for

If you’re creative, this could become more than a calendar. Think:

• 👨‍🏫 “Meet the Students” roster
• 🏆 A showcase of team members or employees
• 🎮 Mini scavenger hunts or trivia games
• 📚 Book-of-the-day for a class or club

Just… don’t delete the boxes. Keep all 24, even if some say “Nothing to see here.”

⸻

✅ Final thoughts

It’s a little buggy and a bit forgotten by its developer, but it does what it promises — especially if you think outside the box (literally).

For what it’s worth, I enjoyed repurposing it. It’s not flashy, and you won’t be building complex quizzes or interactive timelines with it. But for something that feels different and lets you surprise users with hidden content, it’s kind of fun.

📢 Want more interactive content tutorials?

👉 Subscribe to Edu-Hermit on YouTubefor weekly deep dives into H5P, WordPress, and other education technology for building engaging digital content: youtube.com/@edu-hermit

Got questions or creative ways you’re using H5P? Drop them in the comments—I’d love to hear what you’re building!

🔽 How to Create an Accordion Using H5P in WordPress

Welcome everyone!
Today, we’re learning how to create a basic accordion using the H5P plugin on WordPress. Accordions are useful for organizing large chunks of content into collapsible panels. While H5P’s Accordion module is simple and limited to text, links, and lists, it’s functional and easy to use.

⸻

🧩 What Is an Accordion?

An accordion is a vertical list of headings that reveal content when clicked. In H5P’s version:
• Only one panel can be open at a time.
• It automatically closes other panels when a new one is opened.
• You can’t embed images, videos, or other H5P content inside — it’s text-only (with minimal formatting).

⸻

🔧 Install and Launch the Accordion Module

1. In your WordPress dashboard, go to H5P Content → Add New.
2. From the content types list, select Accordion.
3. If it’s not installed, click Get to add it.
4. Once installed, click to open and begin creating.

⸻

✍️ What Content Can You Add Inside Panels?

You can only add:
• Text
• Hyperlinks (e.g., Click here)
• Bullet or numbered lists

🚫 You cannot add:
• Images
• Video or audio
• Interactive H5P content
• Embedded code

The module is minimal by design and hasn’t been actively updated in years.

⸻

✅ Result:

You now have a clean, functional accordion embedded in your site. It’s a great tool for:
• FAQs
• Course content outlines
• Step-by-step guides
• Condensing large amounts of text

⸻

🧠 Use Cases & Limitations

✅ Good For

• FAQs
• Course summaries
• Minimizing scroll on long pages
• Quick collapsible text sections

❌ Not Ideal For

• Multimedia presentations
• Embedding videos or images
• Interactive or dynamic content
• Custom animation or multiple open tabs

---

💬 Final Thoughts

The H5P Accordion module is easy to use and works well for simple content structuring. While it lacks flexibility and multimedia support, it’s a good choice for lightweight interactions.

If you have questions or suggestions, feel free to leave a comment.

Thanks for watching/reading, and see you next time!

📢 Want more interactive content tutorials?

👉 Subscribe to Ed-Hermit on YouTubefor weekly deep dives into H5P, WordPress, and other education technology for building engaging digital content: youtube.com/@edu-hermit

Got questions or creative ways you’re using H5P? Drop them in the comments—I’d love to hear what you’re building!

📊 Creating a Chart Using H5P on WordPress

Welcome everyone! In today’s tutorial, we’re diving into how to create a chart using H5P on WordPress. Charts are a simple and effective way to present data visually, and with H5P, it’s easy to make both bar charts and pie charts. Let’s see how it works and explore some potential use cases for your content.

🍏 What’s a Chart in H5P?

H5P allows you to display data in two basic formats: bar charts and pie charts. You can use these charts to present anything from survey results to sales data in a clear, organized way. You can customize the chart by adjusting labels, colors, and values. It’s a simple yet powerful tool for data presentation.

---

🧑‍🏫 Use Cases for H5P Charts

Let’s take a look at some real-world applications for charts, so you can understand how to make the most out of them:

1. Education:

Charts can be extremely useful in an educational setting to represent data visually. For example:

• Math Lessons: Teachers can use bar charts to show the distribution of test scores or the frequency of certain numbers in a data set.
• History Lessons: A pie chart could showcase how different empires contributed to world history by their territories.
• Science: Use pie charts to explain element composition in chemistry, or bar charts to show the population of species in a biodiversity lesson.

2. Business and Marketing:

Charts are a quick and easy way to display business statistics. Here are some ways businesses could use them:

• Sales Performance: A bar chart could show the monthly sales numbers of different products.
• Customer Demographics: Use a pie chart to show the percentage breakdown of age groups or customer types.
• Market Share: A pie chart could easily represent the market share of different competitors in an industry.

3. Personal Blogs and Portfolios:

If you run a blog or portfolio, charts can be a unique way to visualize your personal achievements or statistics. For example:

• Blog Analytics: Use a bar chart to show traffic growth over time.
• Personal Achievements: Track your progress toward personal goals like reading, workouts, or creative projects.
• Art Portfolio: Showcase the number of projects completed per year, or a breakdown of different mediums you’ve worked with.

4. Project Management:

In any project, visualizing progress with charts can help stakeholders grasp important metrics quickly:

• Task Completion: A bar chart could show the progress of various tasks in a project.
• Budget Breakdown: A pie chart could illustrate how a project budget is allocated across different categories.

5. Surveys and Polls:

Charts are a great way to display results from surveys or polls:

• Customer Feedback: Use pie charts to show the percentage of customer satisfaction across various categories.
• Poll Results: Present the breakdown of different options or opinions in a bar chart or pie chart.

---

🛠 How to Create a Chart Using H5P

Let’s break down how to create your own chart using H5P on WordPress. It’s straightforward and involves just a few steps:

Step 1: Install the Chart Module

1. First, navigate to H5P in your WordPress dashboard.
2. Click Add New Activity and from the module list, select the Chart module.
   If the module isn’t installed, click on Get it to install it.

Step 2: Create Your Chart

Once the module is added, you’ll be taken to the editor where you can create your chart:

---

🔍 What Does the Chart Look Like on Your Website?

Once added, your chart will appear as an embedded element on your page. If you used the bar chart, it will display neat bars with the values clearly labeled at the top. If you chose the pie chart, you’ll see a circular display with color-coded slices.

---

⚠️ Limitations to Keep in Mind

• Dynamic Data: H5P charts are great for presenting simple, static data. However, for large datasets or dynamic updates, this module might not be the best solution.
• Complex Data: If your data includes multiple categories or values, a pie chart or bar chart may not be the most effective way to display it. H5P is best suited for basic, easy-to-read charts.
• Mobile View: On smaller screens, the chart may be harder to read if the data is too detailed.

---

🤔 Final Thoughts

Creating a chart with H5P on WordPress is simple, effective, and visually engaging. Whether you choose a pie chart or bar chart, it’s a great tool for presenting basic data without the need for complex software. Perfect for education, business, and even personal blogs.

Would you use this tool to present your data? Or do you think you’d need a more interactive chart? Let me know in the comments!

---

📢 Want more interactive content tutorials?

👉 Subscribe to Ed-Hermit on YouTube for weekly deep dives into H5P, WordPress, and other education technology for building engaging digital content: youtube.com/@edu-hermit

Got questions or creative ways you’re using H5P? Drop them in the comments—I’d love to hear what you’re building!

🖼 Creating a Simple Collage Using H5P on WordPress

Hey everyone! Today, we’re diving into the world of collages using H5P on WordPress. If you’re looking for a straightforward way to showcase multiple images in a neat and organized layout, this tool is perfect. There’s not much interactivity—it’s essentially a static collage of images—but it’s a great way to present your visuals in a beautiful and structured format.

---

📸 What’s an H5P Collage?

An H5P collage is a simple visual display of images arranged in a layout. You can choose a style and upload your photos, but there’s no way to interact with them—no clicks, no zooming in or out of individual images. It’s just about creating a clean and aesthetic layout for showcasing pictures.

This tool is perfect for presenting visual content in a structured yet minimalistic way, whether for educational purposes, portfolios, or just creating a visually-appealing design for your website.

---

🧑‍🏫 Use Cases for H5P Collages

Now that we know what it is, let’s explore some practical use cases for this collage tool. H5P collages can be used in a variety of ways, from educational environments to business marketing. Here are some examples:

1. Educational Content (Interactive Books & Lessons)

In an interactive book or lesson, you could use a collage to present key images related to the subject matter. For example:

• History or Art Class: Show different artworks or historical events arranged in a collage layout to allow students to visually compare and contrast them.
• Science Lessons: Display various types of animals, plants, or biomes in a collage format to provide a visually rich overview of different species or ecosystems.

2. Photography Portfolio

For photographers, a collage can serve as a portfolio for showcasing multiple photos in one space. It can act as a mini-gallery or a highlight reel, allowing potential clients to see a variety of your work without needing to click through multiple images. This could be especially useful for:

• Wedding photographers showcasing various event moments.
• Nature photographers highlighting wildlife, landscapes, and their versatile skill set.
• Fashion or Portrait photographers displaying different styles or themes.

3. Product Showcase for E-Commerce Websites

If you run an e-commerce site, you can use a collage to present multiple products in an organized, eye-catching way. Imagine:

• Clothing brands showing different outfits in one collage.
• Food products displayed with different angles and contexts.
• Electronics with various product features displayed side-by-side.

4. Event Displays

When you want to showcase an event, such as a conference, trade show, or even a birthday party, a collage can give an at-a-glance view of the event through images. You could include:

• Photo highlights from the event.
• Images of key speakers, booths, or activities.
• Event decorations or crowd shots that convey the vibe and excitement of the event.

5. Personal Websites or Blogs

Whether you’re running a personal blog or a creative website, a collage is a fun and engaging way to display your photos or personal work. For example:

• Travel bloggers can create collages of their favorite travel destinations, with each image representing a different country or landmark.
• Food bloggers might use a collage to display their recipes or showcase multiple food photography shots.
• Art or craft bloggers can show multiple designs, artwork, or DIY projects in one tidy layout.

6. Marketing & Campaigns

For marketing purposes, especially in a social media campaign, you could use a collage to display promotions or brand highlights. It can be used to visually communicate your message in a way that’s digestible and appealing. Examples include:

• Seasonal sales where you display different products on sale in one collage.
• Before-and-after shots for services like home renovations or fitness programs.
• Highlighting customer testimonials or social proof with a collage of happy customer photos or reviews.

7. Showcasing Creative Work

Designers, illustrators, and other creatives can use a collage to display their work in a compact space. Whether it’s for a portfolio page or to share project snapshots:

• Web designers can show mockups of their recent websites in a single view.
• Graphic designers can combine logos, posters, and promotional designs in a collage layout.
• Illustrators might want to share their artwork in one visual space, whether it’s sketches, completed pieces, or concepts.

---

🛠 How Does It Work?

Let’s break it down step by step:

1. Choose Your Layout:
   When you start creating your collage, you’ll pick a layout template—whether it’s one image, two, four, or more. The layout options are simple, with an easy-to-navigate interface showing you how the images will look. For this example, we’ll go with a 4-image collage.
2. Add Your Images:
   Now comes the fun part—uploading the images. You can choose pictures that are meaningful to you. For instance, in my example, I’ve picked a smiley face, grapefruit, mobile phone, and horse. Once added, you can move the images around within their spaces, using simple drag-and-drop functionality.
3. Position & Scale:
   Each image can be resized and adjusted to fit your layout perfectly. You can either zoom in or zoom out using the zoom tools or by holding Ctrl (or Cmd on Mac) and moving your mouse. If you want to adjust the framing, there’s a simple tool to zoom in or out with buttons as well. A neat thing to note is that H5P doesn’t resize the images to fit the frames perfectly—it crops them. So, depending on the aspect ratio of your photos, parts of the images may be cropped out.

---

🔧 Customizing Your Collage

Once your images are uploaded, there are a few settings to play around with to make it look just right:

• Spacing:
  Adjust the space between images. You can go all the way up to 20px for a large gap, or set it to zero for images that sit right next to each other, looking like tiles.
• Height:
  Control the height of your images and their frames. For example, increasing the height setting will make images taller, while decreasing it can make them more compact.
• Frames:
  You can also add frames around your images. If you increase the spacing, the frame will match the size of the spacing, adding a subtle border around the images.

---

🎨 Previewing Your Collage

Once all the customization is done, you can preview your collage before publishing it. Here, you’ll see exactly how the images will look with the chosen spacing, size, and layout.

If I zoom out and tweak the spacing to 5px, the images look much cleaner. It’s all about finding that balance where the images fit together nicely without looking too cramped or too distant from one another.

---

🖥 What Does It Look Like on Your Site?

Once live, the collage will appear as a beautiful, clean grid of images. Users won’t be able to click on individual pictures for a closer look (like in a gallery), but it’s still a great way to display multiple images on your site. You can use it to showcase things like:

• Product showcases
• Photography portfolios
• Infographics
• Decorative images in blog posts

---

🤔 Final Thoughts

While the H5P collage might not have much interactivity (like clicking or zooming), it’s a fantastic tool for showcasing images neatly. You can use it in educational settings, on product pages, or anywhere you just need a simple visual layout.

The best part? It’s super easy to create and implement, even if you’re not a web design expert. The lack of interactivity isn’t necessarily a drawback—it keeps things clean and focused on the visuals themselves.

---

📢 Want more interactive content tutorials?

👉 Subscribe to Ed-Hermit on YouTube for weekly deep dives into H5P, WordPress, and other education technology for building engaging digital content: youtube.com/@edu-hermit

Got questions or creative ways you’re using H5P? Drop them in the comments—I’d love to hear what you’re building!

🖼 Exploring the Image Slider with H5P on WordPress

Welcome, everyone! Today, we’re going to dive into the Image Slider feature offered by H5P on WordPress. It’s a simple yet powerful tool that lets you create an engaging image slideshow, allowing users to move through different images in a visually appealing way. Whether you’re showcasing a series of photos, products, or even telling a story with visuals, the Image Slider can elevate the user experience on your site.

---

📸 What is the Image Slider?

The Image Slider is a dynamic display that lets you show multiple images in a sequence. You can navigate through these images using arrows or dots at the bottom of the slider. For a full-screen view, there’s also an option to expand the slider to occupy the entire screen. This feature gives you a lot of flexibility in how you present images—whether it’s for an interactive before and after comparison, a gallery of photos, or even a marketing carousel.

In this demonstration, I’ve set up a simple slider with four images:

1. A horse 🐴
2. A beautiful lake 🌊
3. A grapefruit 🍊
4. A mobile phone 📱

Each image is accompanied by hover text that pops up when you hover over the picture, giving more context about the image. This hover effect is a subtle way to provide additional information without overcrowding the design.

---

🛠 How Does the Image Slider Work?

Interactive Elements:

The slider gives users multiple ways to interact with it:

• Arrows on either side to scroll through the images.
• Dots at the bottom that serve as navigation buttons to jump to a specific image in the sequence.
• A Full-Screen option for an immersive view of the images, especially useful if the images are high-quality or need more space to be appreciated.

---

🔧 Adjusting Settings and Aspect Ratios

One of the features that make this image slider versatile is its aspect ratio settings. The aspect ratio controls how the images are displayed and scaled within the slider:

• Not Fixed: This option maintains the original aspect ratio of each image, adjusting the slider’s size depending on the dimensions of the images. This is perfect when you want to maintain the integrity of the image, but it does cause the slider to resize every time you switch to a different image. If you have images of varying sizes, the slider will expand or contract, which can lead to some awkward visual shifts.
• Automatic: If you prefer a more uniform look, choosing the automatic option will make the slider maintain the same size for all images, regardless of their aspect ratio. This ensures that the images are resized to fit the slider’s fixed dimensions, and you won’t experience any shifting of the layout as you move through the images. It’s a cleaner, more polished way to present a series of images that might otherwise have inconsistent dimensions.

Choosing the Right Aspect Ratio:

If your images are consistent in size and aspect ratio, the not fixed option can work great, allowing the slider to adjust dynamically. But if your images are all different sizes, automatic is probably the better choice for a more seamless visual experience.

---

🔄 Navigating the Slider

Once the slider is in place, navigating through the images is straightforward:

• Click the arrows to move forward or backward through the images.
• Click on the dots at the bottom to jump to a specific image.
• Full-screen option: If you want to dive deeper into the visuals, clicking the full-screen icon will expand the slider, offering a larger, more immersive view of the images.

---

🖥 Responsive Design and Full-Screen Mode

One of the standout features of this slider is its responsive design. Whether you’re viewing it on a desktop, tablet, or mobile device, the slider will adjust to fit the screen. The images are scaled to fit the display size, and you won’t have to worry about horizontal or vertical scroll bars.

When you switch to full-screen mode, the slider transforms into an expansive view that allows users to appreciate the details of the images. This feature is particularly useful when showcasing high-quality visuals or when you want the images to take center stage.

---

🎨 Design Considerations

• Consistent Image Sizes: If your images have varying aspect ratios, using the automatic aspect ratio setting ensures that the slider looks uniform. Otherwise, you might run into issues where the slider resizes unpredictably as users switch between images.
• Hover Text: Each image can have custom hover text, which will appear when a user hovers over the image. This provides additional context for each picture, without cluttering the screen. It’s a great way to offer brief descriptions or highlight key features about each image.

---

🌍 Use Cases for the Image Slider

The Image Slider feature can be utilized in a variety of ways, depending on your needs:

1. Before and After Comparisons:
   • A great way to show progress or transformation, like renovations, city development, or changes in nature.
2. Photo Galleries:
   • Whether you’re showcasing products, portraits, or scenic landscapes, the slider can act as a gallery where users can move through the images at their own pace.
3. Interactive Storytelling:
   • Use the slider to tell a story with images, allowing users to explore different chapters or scenes. For example, you could show a series of product iterations over the years or different seasons of a location.
4. Marketing and Sales:
   • Businesses often use image sliders on their websites to showcase multiple products, promotions, or features. You can even add a call-to-action within the hover text or integrate links directly into the slider for easy navigation.

---

🎯 Final Thoughts

In essence, the Image Slider with H5P on WordPress is an elegant and user-friendly way to display multiple images on your site. Whether you’re telling a visual story, comparing products, or just creating an interactive experience for your users, this tool is a simple yet effective way to engage visitors.

Would you consider using it for a before-and-after comparison, or perhaps as part of a photo gallery or marketing slider? The possibilities are endless!

If you have any questions or want to share how you plan to use the image slider, feel free to drop a comment below!

---

📢 Want more interactive content tutorials?

👉 Subscribe to Ed-Hermit on YouTube for weekly deep dives into H5P, WordPress, and other education technology for building engaging digital content: youtube.com/@edu-hermit

Got questions or creative ways you’re using H5P? Drop them in the comments—I’d love to hear what you’re building!

🖼 Creating an Image Juxtaposition Display in H5P on WordPress

Welcome everyone! Today, we’re going to create an Image Juxtaposition display using H5P on WordPress. This tool allows you to compare two images side-by-side, where you can reveal differences between two states of an object or location. A great example of this would be showing before and after images of a place, like the transformation of Abu Dhabi over time.

🚀 Installing the Juxtaposition Module

1. Start by accessing H5P in WordPress:
   • Go to your WordPress dashboard.
   • Navigate to the H5P content area and create a new activity.
2. Search for “Image Juxtaposition”:
   • If it’s not already installed, you can click the “Get” button to install it.
   • Once installed, select Image Juxtaposition to begin creating the activity.

---

👀 Preview the Activity

Once you’ve added everything, preview your display:

1. You should see the two images side-by-side, with the slider positioned at 50% by default.
2. Hovering over the images will display the descriptions.
3. Use the slider to reveal the difference between the two images, showing the transformation of Abu Dhabi over 50 years!

---

💡 Use Cases for Image Juxtaposition

The Image Juxtaposition feature is perfect for various use cases:

1. Historical Comparison:

• Show how a city, landmark, or landscape has changed over time, like the transformation of Abu Dhabi or New York City.

2. Product Evolution:

• Compare before and after images of a product’s design changes (e.g., the evolution of a car model or smartphone).

3. Scientific Studies:

• Compare before and after states of an experiment or natural process, like comparing the effect of deforestation on a forest or the progress of a medical condition.

---

🎯 Final Thoughts

Creating an Image Juxtaposition activity in H5P is a powerful way to engage your audience with a visual, interactive experience. Whether for educational purposes, marketing, or simply to showcase the transformation of an object or place, this tool is a great way to highlight change over time.

Would you like more examples or tips for customizing this further? Let me know, and I’d be happy to help!

---

✅ Key Takeaways:

• Use H5P’s Image Juxtaposition feature to compare before-and-after images.
• Customize the slider’s position and color for the best user experience.
• Add the activity to WordPress using the shortcode block for easy embedding.

I hope this guide helps you get started with your own image juxtaposition displays!

---

📢 Want more interactive content tutorials?

👉 Subscribe to Ed-Hermit on YouTube for weekly deep dives into H5P, WordPress, and other education technology for building engaging digital content: youtube.com/@edu-hermit

Got questions or creative ways you’re using H5P? Drop them in the comments—I’d love to hear what you’re building!

🖼 Setting Up Scenes in H5P Virtual Tour 360

The first step in creating your immersive 360-degree virtual tour is setting up your scenes. A scene is essentially the background or view that the user will see. You can choose between 360-degree images or static images, depending on your needs.

To get started:

1. Create a New Scene: After installing the H5P plugin in WordPress, navigate to your H5P content area and select “Virtual Tour 360” to start creating the activity.
2. Choose Your Scene Type: For a truly immersive experience, we recommend using 360-degree images. These allow the user to look around in all directions (up, down, left, right) within a scene. A static image, on the other hand, is a standard image and does not offer the interactive 360-degree effect.
3. Add Descriptions: Each scene can be customized with a title, description, and specific button styles (e.g., arrows or plus signs). Descriptions help give context to your scene, telling your audience about the location or object they are viewing.

For example, you might start with a beach scene as your main view. Your description could say, “This beautiful beach is located on a remote island near the coast,” providing users with a sense of place before they navigate further.

Use Case:

• Educational Use: If you’re teaching geography, history, or travel, a 360-degree scene of famous landmarks or historical sites can allow students to “visit” these places without leaving the classroom. You could create a tour of ancient Egypt, the Great Wall of China, or the Colosseum in Rome.

---

🎬 Adding Interactive Elements to Scenes

Once your scenes are set up, it’s time to add interactive elements that make your virtual tour engaging. H5P allows you to place various objects within each scene. These could be images, text, videos, audio, or even quizzes and assessments.

Examples of Interactive Elements:

• Images: Add images that explain or highlight features of the scene. For instance, you can add a picture of surfboards on the beach. When the user clicks on it, a larger version of the image might appear, or more information could be displayed.
• Text: Add informational text about the object or location the user is viewing. You can also provide clues or hints, depending on the activity.
• Audio: You can upload an audio track that describes the scene in more detail or plays ambient sounds to enhance the experience (like the sound of waves at the beach).
• Videos: Insert a video, such as a YouTube link or a local file, that users can watch while exploring the scene.
• Quizzes & Surveys: Make your virtual tour educational by adding questions that test what the users have learned. You can include multiple-choice questions, true/false questions, or even interactive summaries.

For example, you can add a TV in your room scene that plays a relaxing music video, or a quiz that asks questions about the geography of the beach scene, such as, “Where is this beach located?”

Use Case:

• Virtual Museums: Museums or galleries can use this feature to create virtual exhibitions. Each object in the collection can be clicked on to show more detailed images, videos, or historical context.
• Real Estate: Real estate agents can create virtual tours of homes or apartments, allowing potential buyers to click through rooms, learn about the property, and even view video tours of specific areas.

---

🔗 Connecting Scenes Together for Seamless Navigation

One of the most powerful features of the H5P Virtual Tour 360 is the ability to link scenes together, allowing users to navigate through the tour seamlessly. Think of it like a Choose Your Own Adventure book, but with interactive visuals!

Connecting Scenes:

• Go to Scene Tool: This tool allows you to link one scene to another, creating a navigational flow. For instance, if the user is in a beach scene, you could add a button or an object (like a “surfboard” icon) that, when clicked, takes them to a different scene, such as an underwater coral reef.
• Button Styles: You can use different button styles (like arrows or plus signs) to indicate different types of interactions. For example, an arrow might be used to navigate between two scenes, while a plus sign could be used to display a piece of additional content (like a video or text).

This ability to connect scenes allows you to create a non-linear experience, where users can explore at their own pace, and even choose their path. For example, you could start with a beach scene, then let the user decide whether they want to visit the ocean, explore a room, or look at a map.

Use Case:

• Virtual Field Trips: In education, you could create a virtual field trip experience where students can explore different locations based on their interests. One student might explore the coral reef, while another might head to the beach to learn about sand dunes.
• Interactive Storytelling: Authors or content creators could use the virtual tour to tell a story, where users must make choices about what to explore next. This could work well for educational games or interactive storytelling for children.

---

🏆 Use Cases for H5P Virtual Tour 360 in Different Fields

The H5P Virtual Tour 360 has endless possibilities for educational and business use. Here are some examples of how you can apply this tool to various fields:

1. Education

• Interactive History Lessons: Teachers can create 360-degree tours of historical sites, allowing students to explore them as if they were there.
• Language Learning: You could design a tour of a city, where learners must interact with objects to practice vocabulary or answer questions about their surroundings.

2. Real Estate

• Property Tours: Real estate agents can create virtual property tours, letting potential buyers explore the space without leaving their home.

3. Tourism and Travel

• Virtual Destinations: Tourism boards can create virtual tours of attractions, beaches, or museums to attract travelers.

4. Business Training

• Virtual Onboarding: Companies can create a virtual onboarding tour for new employees, guiding them through the office, introducing them to various departments, and explaining company policies.

---

Final Thoughts

Creating a 360-degree virtual tour using H5P on WordPress offers a wide range of possibilities, whether you’re looking to create an engaging learning experience, a stunning real estate tour, or an immersive marketing campaign. The ability to link scenes, add multimedia, and embed quizzes makes it an incredibly versatile tool for interactive content.

The best part? The learning curve is minimal, and the results are incredibly rewarding. Whether you’re an educator, a business owner, or a content creator, H5P Virtual Tour 360 can be tailored to fit your needs.

---

📢 Want more interactive content tutorials?

👉 Subscribe to Ed-Hermit on YouTube for weekly deep dives into H5P, WordPress, and other education technology for building engaging digital content: youtube.com/@edu-hermit

Got questions or creative ways you’re using H5P? Drop them in the comments—I’d love to hear what you’re building!

🔥 Flashcards: A Fun Way to Test Knowledge

Flashcards are a classic tool for learning and testing knowledge, and now you can create them easily using H5P on WordPress! Here’s how it works: Users see a question (like “What animal is in the picture?”) and have to type in the correct answer. You get immediate feedback, and it moves on to the next card. Here’s a breakdown of what makes this activity cool! 👇

---

🃏 What You Can Do with Flashcards:

• Interactive Learning:
  • 📸 Each flashcard has an image, question, and a space to type the answer.
  • 🧠 After answering, you get instant feedback — you’ll know if you got it right or wrong!
• Hints to Help You Out:
  • 💡 You can add hints for each card to guide users in the right direction.
• Navigating Cards:
  • 🔄 Move through cards automatically after answering or use arrows to go forward/backward.
• Track Your Progress:
  • 📝 Once you’re done, you can review the results and see which cards you got right or wrong.

---

🌟 Why It’s Awesome:

• Engaging: Perfect for quizzes and interactive tests.
  • ❓ Example: Questions like “What fruit is this?” and “What animal is this?”
• Great for Any Subject:
  • 📚 Whether it’s language learning, history, geography, or anything else, flashcards work for everything!
• Instant Feedback:
  • ✅ Right answers get confirmed immediately, while wrong answers show the correct solution.

---

🛠️ Creating Flashcards:

1. Add Your Cards:
   • Text: Write your question (e.g., “What animal is in the picture?”)
   • Answer: Type the correct answer (e.g., “Horse”)
   • Picture: Add an image that corresponds to your question (e.g., a photo of a horse).
2. Hints and Tips:
   • Add hints like “People ride this animal” to guide users toward the correct answer.
   • Optional: You can choose to show the answer only after users type their response.
3. Customizable:
   • Control whether the answers are case-sensitive or not.
   • Write instructions that are shown at the top of the activity (e.g., “Look at the pictures, read the questions, and write your answer”).

---

🎯 Examples of Flashcards:

1. Animal Identification
   • Question: “What animal do you see in the picture?”
   • Answer: Horse
   • 🖼️ Image: A picture of a horse
2. Fruit Guessing Game
   • Question: “What fruit is this?”
   • Answer: Grapefruit
   • 🖼️ Image: A photo of a grapefruit
3. Geography Knowledge
   • Question: “What is the biggest freshwater lake in the world?”
   • Answer: Lake Superior
   • 🖼️ Image: A picture of Lake Superior

---

👀 Previewing Your Flashcards:

• Navigation: Move between cards by using arrows or just clicking on the cards.
• Results: After answering, see your results:
  • ✅ Right answers are shown instantly.
  • ❌ Wrong answers will tell you the correct solution.
• Retry: You can always go back and retry after checking your results.

---

💻 Adding to Your WordPress Site:

1. Generate the Shortcode:
   After creating your flashcards, grab the shortcode from H5P.
2. Paste It into a Post:
   • Create a new post on WordPress.
   • Add a Shortcode block, and paste the shortcode you copied.
   • Publish the post!
3. Preview:
   Now, your flashcard activity is live on your site for anyone to interact with!

---

🎉 Final Thoughts:

Flashcards are a simple yet powerful way to engage users, reinforce learning, and test knowledge. Whether you’re teaching language, history, or any other subject, H5P’s Flashcards activity gives you a fun, interactive platform to make learning more engaging. The best part? It’s super easy to set up and add to your WordPress site.

---

📢 Want more interactive content tutorials?

👉 Subscribe to Ed-Hermit on YouTube for weekly deep dives into H5P, WordPress, and other education technology for building engaging digital content: youtube.com/@edu-hermit

Got questions or creative ways you’re using H5P? Drop them in the comments—I’d love to hear what you’re building!

🔥 Image Hotspots: An Interactive Learning Experience

Imagine turning a simple image into an interactive learning tool! That’s what Image Hotspots allows you to do using H5P on WordPress. It’s a fun and engaging way to make any image come to life by adding clickable hotspots. These hotspots can reveal all kinds of content when hovered over or clicked, making learning a lot more interactive. Here’s a quick look at what you can expect: 👇

---

🖼️ What You Can Do with Image Hotspots:

• Clickable Hotspots: Place clickable icons (like a green plus ➕) over specific parts of your image.
• Hover to Learn: Hover over a hotspot and see information pop up — whether it’s text, images, or videos.
• Rich Content: Add any type of content to the hotspots:
  • 📄 Text
  • 🖼️ Images
  • 🎬 Videos (YouTube or your own!)
• Customizable: You can make the pop-up cover the full page or just show up in a small box, depending on what suits your design.

---

🎯 Where It Shines:

• Education: Perfect for teaching complex concepts or vocabulary in a visual way.
  • 🏡 Example: A room layout with hotspots on the stairs, couch, window, and painting. Click on each and learn about them in detail.
• Exploration: You can use it for interactive tours, like exploring a museum or a historical site.
• Engagement: Students or users click and explore at their own pace, making it far more engaging than static images.

---

✨ Key Features:

• Multi-Content Support: Hotspots can contain multiple types of content in one place:
  • Text descriptions ✍️
  • Images 🖼️
  • Videos 🎥
• Easy Navigation: Click a hotspot and view the content in a neat, pop-up box or full screen.
• Flexibility: You decide whether the content appears in a small box or takes over the entire screen.
• Visual Appeal: The hotspots are customizable — choose from predefined icons or upload your own for a unique look.

---

📚 Use Cases:

• Subject Versatility: Use it for any subject! Whether it’s:
  • 🏛️ History (click on artifacts to learn more)
  • 🧬 Science (explore the parts of a cell)
  • 🌍 Geography (click on countries to see info and stats)
• Interactive Learning: Great for interactive workbooks or as a standalone activity where users explore content on their own.

---

🎥 Why It’s Awesome:

• Multi-layered Learning: Users get text, images, and videos — all in one place!
• Self-paced Discovery: It gives learners control over their journey, letting them explore hotspots at their own pace.
• Visually Engaging: With icons and pop-ups, it feels more like a dynamic, interactive game than just reading or clicking through a textbook.
• Perfect for Presentations: The full-screen option transforms it into a slick presentation tool, perfect for teaching or showcasing content.

---

🔑 Takeaways:

• Add interactive hotspots to any image to make it informative and fun.
• Choose from text, images, or videos to enhance the experience.
• Great for interactive learning, virtual tours, and presentations.
• Customizable to fit any subject or activity!

---

🎉 Final Thoughts

Image Hotspots with H5P is a powerful tool to engage your audience. Whether you’re teaching complex concepts, giving a tour, or just making an image more interactive, it’s a versatile and dynamic activity. Best part? It works on WordPress, so it’s easy to integrate into your site and share with others. 🙌

---

📢 Want more interactive content tutorials?

👉 Subscribe to Ed-Hermit on YouTube for weekly deep dives into H5P, WordPress, and other education technology for building engaging digital content: youtube.com/@edu-hermit

Got questions or creative ways you’re using H5P? Drop them in the comments—I’d love to hear what you’re building!

🕰️ Create Interactive Timelines with H5P: A Fun Way to Present History and More

If you love sharing stories through time, you’ll want to check out the Timeline module in H5P — one of the coolest ways to create interactive presentations right on your WordPress site. Whether you’re teaching history, mapping a project, or showcasing events, this module brings timelines to life with multimedia and easy navigation.

✨ What Makes the H5P Timeline Special?

The Timeline module isn’t just a simple list of dates. You can add 🎥 videos, 🖼️ images, 📝 text, and 🎧 audio to each event, making your timeline a rich, immersive experience. It supports zooming in and out, so viewers can get the big picture or focus on specific moments. Plus, it includes a handy 🔳 full-screen mode that turns your timeline into a clean, professional presentation.

For example, I created a timeline of Iraq’s history starting from 3500 BC to modern times. Each event is packed with pictures, captions, and detailed descriptions — and some events even stretch across periods, shown by a 🔵 blue line to indicate the timespan. It’s super easy for users to click through events or use navigation arrows to explore the story at their own pace.

💡 How You Can Use It

• 🧑‍🏫 Educational timelines for history, science, or literature classes
• 📈 Project timelines for business presentations or portfolios
• 📖 Storytelling tools to showcase company milestones or product evolution
• 📚 Interactive workbooks where learners explore topics visually and at their own pace

Tags and eras help organize events, making complex timelines easier to follow. For instance, I used tags like “Sumer” and “Writing” to group related events, which appear neatly aligned on the timeline.

---

📢 Want more interactive content tutorials?

👉 Subscribe to Ed-Hermit on YouTube for weekly deep dives into H5P, WordPress, and other education technology for building engaging digital content: youtube.com/@edu-hermit

Got questions or creative ways you’re using H5P? Drop them in the comments—I’d love to hear what you’re building!

---

🖼️ What is an Image Blender?

Basically, it’s an image gallery slider where you can scroll through a series of images. You can use it as:

• A simple image gallery or slider
• A zoom-in effect on a single image using multiple zoomed-in photos
• Or even for layering images to reveal different parts

For example, we’ve created a zoom-in effect on a photo of mountain goats using 4 pictures, each one zoomed in closer. When you scroll through, it feels like you’re moving closer to the object!

---

⚙️ How to Create an Image Blender Using H5P on WordPress

Step 1: Install the Agamotto Module

• Head to your WordPress dashboard
• Go to H5P Content > Add New
• Find the module called Agamotto or Image Blender
• If it’s not installed, click Get to install it, then open it to start creating your activity

---

Step 2: Set Up Your Activity

• Title: e.g., Image Blender
• Heading: e.g., Watch the Goat

This title and heading show up on your activity.

---

Step 3: Add Your Images

• Add your first image (e.g., a wide shot of mountain goats)
• Add alternative text (required for accessibility) — e.g., “Far shot of goat”
• Add a label — e.g., “Go 1”
• Add an image description — e.g., “This is a far shot of a goat”

Repeat for your other images, each zoomed in closer (you can leave some optional fields blank if you want).

The more images you add, the smoother your zoom or transition will feel!

---

Step 4: Configure Behavioral Settings

• Snap slider: If enabled, the slider will snap to the nearest image tick mark instead of stopping anywhere in between
• Display tick marks: Show markers to indicate where images are
• Display labels: Show labels for each image (if you added them)
• Transparency replacement color: Choose a background color if your images have transparent areas (not needed if images are fully opaque)

---

Step 5: Preview Your Activity

• You’ll see your first image with the label and description
• Drag the slider and watch the picture zoom in or transition through the different images
• The tick marks help you know how many images there are
• If snap is off, you can stop anywhere between images; if snap is on, it jumps to the closest image

---

💡 Pro Tips & Use Cases

• Great for step-by-step diagrams — each image shows the next step in a process
• Interactive zoom-ins on detailed photos or maps
• Reveal parts of an image gradually (like borders appearing on a globe)
• Perfect to include inside interactive workbooks or lessons

---

🙌 That’s it!

There’s really not much to it — just upload your images, configure a few settings, and you have a slick interactive gallery.

If you have any questions or ideas, leave a comment below! Thanks for watching, and see you next time!

---

📢 Want more interactive content tutorials?

👉 Subscribe to Ed-Hermit on YouTube for weekly deep dives into H5P, WordPress, and other education technology for building engaging digital content: youtube.com/@edu-hermit

Got questions or creative ways you’re using H5P? Drop them in the comments—I’d love to hear what you’re building!

🚀 Creating a Dialogue Cards Activity with H5P on WordPress

Welcome, everyone! Today we’re exploring how to build an interactive Dialogue Cards activity using H5P on WordPress — a super simple yet effective way to help learners review and drill content.

---

🔍 What Are Dialogue Cards?

Think of digital flashcards with a twist! Each card has two sides:

• 🎨 Front Side:
  • Picture
  • Audio you can click to play
  • Text hint or keyword
• 📖 Back Side:
  • Same picture
  • Full definition or explanation
  • Option for learners to mark if they got it ✔️ right or ❌ wrong

The system tracks progress over multiple rounds, making it easy to master all cards.

---

✨ Why Use Dialogue Cards?

• 💡 Great for memorizing vocabulary, scientific terms, historical facts, or any key concepts
• 🔄 Interactive repetition helps boost retention
• 📊 Tracks correct/incorrect answers and shows progress
• 🎧 Audio supports pronunciation practice

---

🛠 How to Create Dialogue Cards in H5P

1. 📥 Install Dialogue Cards Module

• Go to your WordPress dashboard
• Click H5P > Add New
• Find Dialogue Cards content type
• If missing, click Install, then Use

2. 📝 Set Up Your Activity

• Title: e.g., “Good to Remember”
• Mode:
  • 🆗 Normal — simple flashcards without progress tracking
  • 🔁 Repetition — users mark right/wrong and repeat until mastery

---

3. 🃏 Add Your Cards

Each card has:

• Front (Hint):
  • 📷 Picture related to the term
  • 🗒️ Keyword or hint
  • 🔊 Audio file for pronunciation
• Back (Answer):
  • 📷 Same picture again
  • 📚 Full definition or description
  • 💡 Optional tips to help remember

---

Example Cards:

• 🐻 Card 1:
  • Front: Picture of bear, keyword “Ursidae,” audio saying “Ursidae”
  • Back: Scientific classification and facts about bears
• 🦭 Card 2:
  • Front: Picture of seals, keyword “Pinapedia,” audio pronunciation
  • Back: Description of the seal family
• 🛡️ Card 3:
  • Front: Picture of Lapu Lapu, keyword “Lapu Lapu,” audio pronunciation
  • Back: Brief history of this Filipino hero

---

4. ⚙️ Behavioral Settings

• 🔄 Enable retry so users can try again
• 🔙 Allow or block backwards navigation
• 🔀 Decide if you want to randomize cards or keep fixed order
• 🔤 Adjust text size scaling if needed
• 🌐 Customize button prompts or change language

---

5. 🔄 Using Repetition Mode

• Buttons appear: I got it right ✔️ / I got it wrong ❌
• Tracks how many rounds completed
• Set max proficiency level (3–7 rounds)
• Cards repeated if answered wrong, helping learners focus on tough ones
• Summary screen shows progress after each round

---

🎬 What It Looks Like

• Activity title and instructions on top
• Front side with image, audio, and hint text
• Tap audio to hear pronunciation
• Flip card to see definition and tips
• In repetition mode: mark right/wrong and see progress summary

---

🎯 Why This Works

• Ideal for exam prep, presentations, or language drills
• Interactive and engaging alternative to paper flashcards
• Easy to build and customize inside WordPress
• Perfect standalone or as part of an interactive course

---

If you want, I can help you create a quick step-by-step guide or a sample template. Want me to hook you up? 😄

---

📢 Want more interactive content tutorials?

👉 Subscribe to Ed-Hermit on YouTube for weekly deep dives into H5P, WordPress, and other education technology for building engaging digital content: youtube.com/@edu-hermit

Got questions or creative ways you’re using H5P? Drop them in the comments—I’d love to hear what you’re building!

🧠 What is an H5P Interactive Video?

An H5P Interactive Video takes a regular video—whether uploaded or from platforms like YouTube—and turns it into a dynamic, engaging learning tool by layering interactive elements on top. These could include:

• Labels that introduce characters or visuals
• Questions that test comprehension mid-video
• Information pop-ups, images, or even navigation paths that guide or challenge the viewer

Think of it as a way to stop passive watching and turn it into active learning—where the viewer responds, explores, and reflects as they watch.

---

🔧 Getting Started – Setting Up the Video

Step 1: Installing & Launching the Module

• In WordPress, navigate to H5P > Add New.
• Choose Interactive Video from the content types list. If not installed, click “Get” to download it.

Step 2: Adding the Video

You can:

• Upload a video file from your computer
• Use a YouTube URL (easiest, but limited in control)
• Paste it and click Insert to load it into your project

Note: YouTube videos come with branding and suggestion overlays—great for simplicity, but a bit messy visually.

---

🏗 Structuring Your Interactive Video

Once the video is in place, you move on to building the interaction. The process involves three core layers:

1. Basic Settings

You define key attributes like:

• Title of the activity
• Start time (e.g. skip an intro and start at 00:07)
• Autoplay, looping, or preventing fast-forward
• Chapters/bookmarks, if you want users to navigate by section

You can also enable global behavior like:

• Allowing retries on questions
• Showing the “Show solution” button
• Opening the chapter/bookmark menu on start

---

🧱 Building Interactions – What You Can Add

This is where the video comes alive. You pause at specific moments and overlay interactive tools.

🔖 1. Labels

• Simple floating text boxes to point out names, items, or details.
• Example: Label “Becky” appears when she’s introduced, from 00:07 to 00:17.
• These don’t pause the video—just annotate it.

❓ 2. Questions

Add learning checkpoints with various question types:

• Single Choice Set: One correct answer from a list. You can show it with a button that the user clicks.
• Multiple Choice: More than one correct answer.
• True or False
• Fill in the Blanks
• Drag & Drop, Mark the Words, etc.

You control:

• Whether they pause the video
• If users can retry
• Whether they need the correct answer to continue

🖼 3. Posters

Instead of a button, a poster pops up automatically, pausing the video. You can:

• Add images (e.g. US flag)
• Pose questions or notes without needing clicks

🧩 4. Text & Tables

• Text boxes: Informational pop-ups—e.g. “Mark and Todd enter the room.”
• Tables: Display quick-reference info, like character comparisons or timelines.

You can customize:

• Background color, opacity
• Text size, boldness, alignment
• Timing and visual style

---

🔗 Adding Links and Navigation

🌐 Links

• Add clickable links to external sites (e.g. Google, YouTube)
• Display as overlay text or embedded buttons
• Useful for extended reading or related videos

🧭 Navigation Hotspots

• Add clickable shapes (e.g. a blue circle) that transport the user:
  • To a specific time in the video
  • Or to a web URL

Great for letting users explore content out of order or branch into bonus material.

---

🔀 Crossroads – Branching Choices

Unique to H5P Interactive Video, Crossroads allow users to make decisions:

• Show a question like: “Where do you want to go next?”
• Offer paths like:
  • “Go back to the beginning” (timestamp: 00:07)
  • “Review the middle” (timestamp: 01:00)
  • “Jump to the end” (timestamp: 01:45)

This gives learners autonomy in their journey—ideal for revision, non-linear narratives, or gamified scenarios.

---

📽 Preview & Test

Once everything is in place:

1. Click Create to generate the interactive video
2. Play through it to test each interaction
3. Make sure:
   • Labels appear and disappear at the right times
   • Questions pause the video and respond properly
   • Navigation and links work as expected

---

🧩 Summary of Elements You Can Add

Type	Use Case	Example
Label	Name characters or items	“Becky”, “New York”
Text	Add narration or instructions	“Mark and Todd enter the room”
Table	Present structured info	“People vs Places” comparison
Questions	Check understanding	Fill in the blank, multiple choice
Poster	Auto-popup for focus moments	Image + question combo
Link	External resource	“Visit Google.com”
Navigation Hotspot	Clickable link on video	Circle to go to another timestamp
Crossroads	Choose your path	“Go back to start / end / middle”

---

🏁 Final Thoughts

H5P’s Interactive Video tool transforms any basic video into an interactive, learner-driven experience. It’s especially powerful for:

• Language learning
• Online courses
• Training scenarios
• Educational storytelling

By combining video with embedded questions, branching paths, and rich overlays, it becomes more than just a viewing experience—it becomes active learning.

---

📢 Want more interactive content tutorials?

👉 Subscribe to Ed-Hermit on YouTube for weekly deep dives into H5P, WordPress, and other education technology for building engaging digital content: youtube.com/@edu-hermit

Got questions or creative ways you’re using H5P? Drop them in the comments—I’d love to hear what you’re building!

🧩 What is the Single Choice Set?

• This H5P activity is designed for creating multiple-choice quizzes where only one answer can be selected per question.
• Once a user clicks an answer, it’s locked in — there’s no way to change it.
• Unlike standard multiple choice, this activity adds sound feedback, auto-advance behavior, and a more linear quiz flow.
• Best used for quick assessments, drills, or low-stakes practice where response speed and decisiveness matter.

---

🔁 How It Works

• Each question has a prompt and up to four answer choices.
• The first answer entered is always treated as the correct one (H5P shuffles the display later).
• After selecting an option:
  • A sound effect plays (if enabled).
  • The user is shown whether their answer was right or wrong.
  • The system either automatically advances to the next question or waits for manual navigation, depending on the settings.
• Once all questions are answered, users land on a results screen that summarizes their performance.

---

🎯 Key Features

• Auto-Continue Option:
  • Controls whether the activity moves to the next question automatically.
  • Delay timers let you choose how long to wait after right or wrong answers.
• Sound Feedback:
  • Adds a more engaging and responsive experience.
  • Different sounds for correct and incorrect answers.
• No Do-Overs (Per Question):
  • The moment a choice is clicked, it’s final — can’t be changed.
  • Encourages thoughtful responses but adds a bit of pressure.
• End-of-Quiz Options:
  • Retry: User can take the quiz again if they didn’t score perfectly.
  • Show Solution: Displays correct answers for each question.
  • Pass Percentage: Define the minimum score required to pass.

---

🧠 Question Behavior

• All answer options are shuffled when shown to the user.
• The user progresses through a series of discrete steps:
  • Question → Answer Lock-in → Feedback → Next Question → Final Score
• The system uses a progress bar at the bottom to indicate how far along the user is.
• Great for creating a flow-like learning experience where the quiz feels fast-paced and automatic.

---

📋 Examples of Use

• Science Facts: “How many Earths fit in the sun?” with plausible distractors.
• Math Drills: Simple problems like “What is 3 + 3?”
• General Knowledge: Planet order, historical dates, or geography.
• Language Comprehension: Questions testing vocabulary or grammar in quick succession.

---

🔍 User Experience Highlights

• Fast and responsive — each choice gives instant feedback.
• Visually clean and simple — limited distractions.
• Encourages active recall and quick thinking.
• Works especially well in mobile or touch-based environments due to the straightforward interaction style.

---

⚠️ Considerations & Limitations

• Only supports one correct answer per question.
• Can’t handle multi-select, open-ended responses, or free text input.
• Once a user selects an option, they cannot revisit or correct it.
• Best used for short quizzes — not ideal for deep assessment or nuanced learning checks.

---

🧩 When to Use It

• If you need something quick, focused, and auto-grading.
• When building a simple quiz or flashcard-style review.
• As a piece of a larger interactive course (can be embedded inside a Question Set or Interactive Book for more variety).

---

📢 Want more interactive content tutorials?

👉 Subscribe to Ed-Hermit on YouTube for weekly deep dives into H5P, WordPress, and other education technology for building engaging digital content: youtube.com/@edu-hermit

Got questions or creative ways you’re using H5P? Drop them in the comments—I’d love to hear what you’re building!

🎙️ Speak the Words Set – H5P Guide

A “Speak the Words Set” is an extended version of the original “Speak the Words” H5P content type. Unlike the single-question version, this one allows you to create multiple questions in a single activity — ideal for language learning, pronunciation training, and multilingual comprehension checks.

---

✅ Key Features

• Supports multiple questions.
• Users speak answers via microphone.
• Works only in Chrome.
• Supports multiple languages with accurate speech recognition.
• Provides feedback based on spoken responses.

---

🛠️ How to Create a “Speak the Words Set” Activity

1. Install the Content Type

• Go to H5P > Add New in WordPress.
• Search and install “Speak the Words Set” (not just “Speak the Words”).

---

2. Add Questions to the Set

You can add multiple questions, each with its own:

• Prompt or Task Description
• Accepted answers
• Language for voice recognition
• Feedback messages

---

✏️ Example Questions for Use Cases

---

🟦 Question 1: Basic Q&A in English

Field	Content
Task	What planet do we live on?
Accepted Answers	Earth, Planet Earth, The Earth
Language	English (US)
Feedback	Good job! / Try again

---

---

---

3. Set Up Scoring & Feedback (Optional)

• You can define score ranges for grading (e.g., 0–50 = fail, 60–100 = pass).
• Use the text overrides section to change default prompts (e.g., “Retry,” “Show Solution”).

---

4. Preview the Activity

Test questions one by one:

• Click the mic icon.
• Speak your answer.
• System will score and show what it thinks you said.
• Option to retry or show solution.

---

📊 User Experience Flow

1. User sees a prompt: “What planet do we live on?”
2. Speaks answer into mic: “Earth”
3. System compares spoken input to accepted answers.
4. Shows result: ✔️ Correct / ❌ Try again
5. At the end: Finish button shows summary of results and all correct answers.

---

⚠️ Limitations & Suggestions

Limitation	Suggestion
Only works on Chrome	Ensure students use supported browser
Requires microphone access	Grant mic permissions when prompted
Whole-sentence scoring only	No partial credit for partially correct answers
One question type only	Use within Question Set or Interactive Book to mix types

✅ Great for ESL/EFL learners, vocabulary recall, foreign language practice, and pronunciation exercises.

---

🎓 Use Cases

Goal	How to Use
Vocabulary recall	Ask “What is X in language Y?”
Pronunciation practice	Use full-sentence prompts
Listening + speaking combo	Ask questions that must be answered orally
Multilingual teaching	Switch languages for specific questions

---

💡 Bonus Tip

To allow partial points or more detailed analysis, consider integrating this with an external speech evaluation tool — but as of now, H5P’s voice scoring is binary (correct/incorrect only).

📢 Want more interactive content tutorials?

👉 Subscribe to Ed-Hermit on YouTube for weekly deep dives into H5P, WordPress, and building engaging digital content: youtube.com/@edu-hermit

Got questions or creative ways you’re using H5P? Drop them in the comments—I’d love to hear what you’re building!

🎙️ Creating a “Speak the Words” Activity in H5P (WordPress)

This activity allows students to speak into a microphone, and speech recognition software will match their spoken input to accepted answers. Great for:

• Pronunciation practice
• Vocabulary recall
• Language comprehension

---

🛠️ Step-by-Step Setup

1. Install the “Speak the Words” Module

• Go to the H5P plugin in WordPress.
• Click Add New.
• Search for the content type “Speak the Words”.
• If not installed, click “Get” to add it.

---

2. Basic Task Creation

Field	Description
Title	Name of your activity (e.g. Speak the Words)
Task Description	The prompt or question the student will see (e.g. “Speak the following phrase: The boy walked to school by himself.”)
Accepted Answers	List all acceptable answers (e.g. the boy walked to school by himself)
Correct Feedback	e.g. Good job!
Incorrect Feedback	e.g. No, try again.
Speech Input Language	Must match the spoken language of the expected answer (e.g. English (US), Russian, etc.)

---

🎯 Three Use Cases

📘 1. Basic Q&A in English (Not ideal)

• Prompt: What is the name of our planet?
• Answers: Earth, the Earth, planet Earth
• Speech input and accepted answers both in English.

⚠️ This use case isn’t ideal—students might as well just type it. Speaking isn’t necessary unless you’re testing pronunciation.

---

🌍 2. Language Learning (e.g. Russian vocabulary)

• Prompt: What is the informal Russian word for hello?
• Answer: Привет
• Set Speech Input Language to Russian.
• Ensures pronunciation is checked correctly. If input language is wrong (e.g. English), it won’t recognize the answer correctly.

---

🗣️ 3. English Pronunciation Testing

• Prompt: Speak the following phrase: The boy walked to school by himself.
• Answer: the boy walked to school by himself
• Speech input language set to English (US).
• Great for checking fluency and pronunciation in English learners.

---

⚙️ Important Settings & Limitations

Feature	Details
One Prompt per Activity	Each “Speak the Words” activity supports only one question. To include multiple prompts, use a Question Set or Interactive Book.
No Partial Scoring	Students either get full points or none — even if they speak most of the phrase correctly.
Speech Recognition Works Best in Chrome	Requires permission to use the microphone. Firefox and others may not support it properly.
No Toolbar	You can hide extra options/toolbars if desired for a cleaner experience.

---

🔁 Example Walkthrough

1. Prompt: Speak the following phrase: The boy walked to school by himself.
2. Student says: “The boy walked to school by himself” → ✅ Good job!
3. Student says: “The girl walked to school by herself” → ❌ No, try again.
4. Click Show Solution → See accepted answers + what was actually heard.

---

✅ Ideal For:

• English pronunciation testing
• Foreign language vocabulary recall
• Speaking/listening comprehension tasks
• Beginner-intermediate ESL/EFL learners

---

⚠️ Final Notes

• Works only in Chrome.
• Requires microphone access.
• Great speech recognition accuracy, even better than many standalone tools.
• For multiple questions, use it within:
  • Question Set
  • Interactive Book

📢 Want more interactive content tutorials?

👉 Subscribe to Ed-Hermit on YouTube for weekly deep dives into H5P, WordPress, and building engaging digital content: youtube.com/@edu-hermit

Got questions or creative ways you’re using H5P? Drop them in the comments—I’d love to hear what you’re building!

🎧 How to Create a Dictation Activity Using H5P in WordPress

✅ What Is the Dictation Activity?

The H5P Dictation activity allows learners to:

• Listen to audio clips.
• Type what they hear.
• Get immediate feedback based on accuracy, spelling, and alternative answers.
• Practice listening and writing skills.

---

🛠️ Step-by-Step Setup

1. Install the Dictation Content Type

• Go to H5P plugin in WordPress.
• Click Add New.
• Search for Dictation (not “Dictation (Text Input)”).
• If it’s not installed, click Get to install it.

---

2. Set Up Basic Info

• Title: Add your activity title.
• Task Description: Give user instructions like:
  “Listen to the audio clips and write what you hear in the box. Click on the audio to play the clips.”

---

3. Add Sentences and Audio

For each sentence:

• Upload a normal-speed audio file.
• Upload an optional slow version (for additional support).
• Enter the correct answer text (this is what H5P will check against).

➕ Add Alternative Spellings:

Use the pipe symbol (|) to allow alternative spellings:

sqlCopyEditThere are many colors|colours in the natural world.

Repeat this process for each sentence/audio clip.

---

4. Scoring & Feedback

• Use score ranges to display messages like “Fail” or “Pass”.
• Leave feedback sections empty if not needed.

---

5. Behavioral Settings

Set these based on how strict you want the activity to be:

Setting	Example
Max Tries (Normal Audio)	2
Max Tries (Slow Audio)	1
Ignore punctuation	✔️ (recommended)
Zero Mistakes Mode	Optional (makes scoring more lenient)
Custom Typo Display	✔️ Shows where user made spelling errors
Leniency (%)	50% allows small spelling errors

---

6. Publishing the Activity

• Click Create or Save once done.
• To embed in a post/page:
  • Copy the shortcode on the right side.
  • Add a Shortcode block in your post/page.
  • Paste the code, publish, and you’re done!

---

🎯 Example Use Case

You built an activity with 3 clips:

1. “There are many colors in the natural world.”
2. “What flavor is your ice cream?”
3. “Strive for progress not perfection.”

Users can:

• Replay each clip a limited number of times.
• Get real-time feedback.
• See correct answers, including spelling variations.

---

💡 Final Tips

• The activity works well in Chrome; Firefox may have mixed results.
• No mic is required unless you add speaking tasks (not part of this dictation type).
• You can bundle this dictation into larger activities like:
  • Interactive Books.
  • Question Sets.

---

🧩 Great For:

• ESL listening practice.
• Spelling drills.
• Language comprehension.
• Learners with varying levels (customizable difficulty).

📢 Want more interactive content tutorials?

👉 Subscribe to Ed-Hermit on YouTube for weekly deep dives into H5P, WordPress, and building engaging digital content: youtube.com/@edu-hermit

Got questions or creative ways you’re using H5P? Drop them in the comments—I’d love to hear what you’re building!

📝 Let Students Reflect Deeply: H5P’s Essay Activity on WordPress

In this video, we dive into the Essay content type in H5P—a fantastic tool for encouraging deeper thinking and structured writing. It’s especially powerful for subjects where open-ended responses are key, like history, literature, or critical thinking tasks.

This activity allows learners to respond to a detailed prompt (in our case, outlining the causes of World War II) in an open text field, with support for hints, keyword tracking, and automatic scoring. It feels like a traditional essay assignment—but smarter and more flexible.

📚 How It Works

You set up a writing prompt and define keywords you want students to include in their responses. For example, if you’re asking about World War II, you might look for keywords like fascism, annexation, and the Great Depression. H5P will automatically check for these terms—along with their variations (thanks to wildcard support)—and assign points accordingly.

This makes the grading process lighter without completely removing the teacher’s touch. You can even offer feedback messages tied to whether or not certain keywords appear. That means students get meaningful nudges even in an auto-graded setup.

✏️ Why It’s Great

• Perfect for open-ended reflection and critical thinking
• Supports keyword-based automatic scoring
• Encourages thoughtful writing while easing the grading load
• Optional hints, images, and feedback customization
• Works well as a standalone activity or inside a larger lesson

💡 Use Cases

Whether you’re teaching history, ethics, environmental science, or literature, the Essay activity fits right in. Use it for:

• Mid-unit reflection tasks
• Homework assignments
• Entry or exit tickets
• Practice assessments before the real thing

It also makes a great screening tool—you can get a quick sense of student understanding before diving into deeper evaluation.

📢 Want more interactive content tutorials?

👉 Subscribe to Ed-Hermit on YouTube for weekly deep dives into H5P, WordPress, and building engaging digital content: youtube.com/@edu-hermit

Got questions or creative ways you’re using H5P? Drop them in the comments—I’d love to hear what you’re building!

📝 Turn Reading into Reflection: H5P’s Summary Activity on WordPress

In this video, we dive into the Summary content type in H5P—a minimalist yet clever activity designed to test a reader’s understanding of an article. It’s ideal for reinforcing comprehension and encouraging active reading, especially in educational or training environments.

The finished product looks like a digital reading exercise where learners scroll through a short article and answer multiple sets of summary questions. But there’s a twist: the answers are phrased as statements, and only one is correct per set.

---

📚 How the Activity Works

• Starts with a short reading passage or article
• Followed by a series of multiple-choice-style summary statements
• Only one correct summary statement per set
• Learners select the correct summary before moving to the next set
• Progress bar and scoring are visible
• No retries or answer reveals—only immediate feedback
• Each correct answer contributes to the final score

It’s simple, direct, and built for reflection over rote memorization.

---

✏️ What Makes It Unique?

• Text-based format: perfect for reading comprehension
• Supports hints for each question set
• Feedback is built-in (correct/incorrect responses)
• Lightweight and clean layout
• Great for both formative assessment and content review

Teachers can write their own questions, tailor hints, and scaffold the content based on paragraph structure or thematic sections.

---

💡 Best Use Cases

The Summary module is especially useful when:

• 🧑‍🏫 Reinforcing key points in an article or report
• 📖 Testing reading comprehension without complex quiz structures
• 🌍 Introducing new topics by checking understanding immediately after reading
• 🎓 Creating low-pressure assessments for self-study or review sessions

It’s also great for EFL learners or younger students who need a confidence-building reading activity.

---

📢 Want more interactive content tutorials?
👉 Subscribe to Edu-Hermit on YouTube for new videos every week on H5P, WordPress, and making your learning content come alive.
💬 Got ideas or feedback? Drop them in the comments—I’d love to hear what you’re building!

🧠 Matching Images and Learning Geography: H5P’s Memory Game in Action

In this video, we explore how to build a Memory Game using the H5P plugin on WordPress—one of the most fun and visual ways to engage learners. The result? A fully interactive grid of cards that test memory, geography knowledge, and listening skills all at once.

The example featured in the video is a blend of world landmarks and country flags, paired with custom audio clips. Learners flip two cards at a time, matching a landmark with its country’s flag. Get it right? You’ll hear a custom success message. Get it wrong? Flip again.

---

🎮 How the Game Works

• 12 cards (6 pairs), hidden face-down
• Each card has an image (landmark or flag)
• Clicking a card flips it and plays an audio prompt
• Players must match:
  • Landmark image + spoken landmark name
  • Country flag + country name audio
• Upon a correct match, a message like “Great job!” appears
• Stats like time spent and card turns are displayed at the end

And yes, it’s harder than it looks. Especially if you mix up Big Ben and the Statue of Liberty.

---

🎧 What Makes It Interactive?

The game goes beyond just flipping images:

• Custom voice recordings for each card (record directly inside H5P!)
• Option to include alternative text for accessibility
• Personalized feedback after each match
• Optional custom card backs and color themes

This makes the activity feel polished and personal—ideal for both classrooms and self-paced learning.

---

💡 Use Cases

The memory game isn’t just for geography buffs. Try it with:

• 🎓 Language learners: Match vocabulary with pronunciation
• 🎵 Music education: Match instruments to their sounds
• 🧠 History class: Pair famous quotes with their speakers
• 🌍 Cultural studies: Connect foods, landmarks, or traditions with countries

Whether you’re reinforcing knowledge or just trying to make learning fun, this tool delivers a low-stress, high-engagement experience.

---

📢 Like activities like this?
👉 Subscribe to Edu-Hermit on YouTube for more hands-on tutorials in H5P, WordPress, and beyond.
💬 Got ideas or questions? Drop them in the comments—I read them all!

🧃 Find Multiple Hotspots in H5P: A Visual Learning Activity on WordPress

In this video, we explore how to create a Find Multiple Hotspots activity using H5P on WordPress—a visual, interactive way to engage learners in a simple but effective selection task.

The demo example? Learners are shown six drink options and asked to “Select all the drinks that contain caffeine.” It’s part quiz, part teaching tool, and fully customizable.

---

🔍 What Is Find Multiple Hotspots?

The Find Multiple Hotspots module lets you create a single image with multiple clickable areas. Learners click around to identify the correct answers. Immediate feedback helps reinforce learning.

In the video example:

• 6 images of drinks (e.g. coffee, tea, soda, juice)
• 3 correct answers (contain caffeine)
• 3 incorrect answers
• Clicking a correct area gives feedback like “Great! You found one of three drinks.”
• Incorrect clicks return messages like “Please try again.”
• Clicking empty space gives a third message: “Please select one of the drinks.”

---

💡 Use Cases for This Activity

This type of activity isn’t just about caffeine — it’s about teaching through exploration. Use it for:

• 🔬 Science: Identify planets, classify animals, or highlight body parts
• 🌍 Geography: Find countries, capitals, landmarks
• 🍱 Nutrition: Pick healthy foods or allergens
• 🛠️ Workplace training: Spot hazards in a photo
• 🧠 Language learning: Identify vocabulary by image

Because it doesn’t rely on scoring or retries, this format is great for low-pressure learning and recall.

---

🛠️ Key Features of the Module

• ✅ Supports circle and square hotspots
• ✅ Immediate feedback per click
• ✅ Custom feedback for correct, incorrect, and empty clicks
• ✅ Feedback can include extra facts, great for teaching
• ✅ Can be added into H5P quizzes or interactive books
• ❌ No “Check answers” or scoring by default — designed more for active exploration

---

✏️ Behind the Scenes

All the setup is done inside one simple editor:

1. Add a background image
2. Draw hotspots over your image
3. Set which are correct or incorrect
4. Write custom messages for each

You then copy the shortcode and paste it into any WordPress post or page.

---

📢 Enjoy tutorials like this?
👉 Subscribe to Edu-Hermit on YouTube for more easy, hands-on H5P guides and WordPress tutorials!
💬 Have a question or an idea? Leave a comment under the video — I’d love to hear from you.

🔥 Create a “Find the Hotspot” Activity with H5P on WordPress

In this video, we explore how to build a fun and simple Find the Hotspot activity using H5P on WordPress. The example? A playful visual quiz asking users to click on the hotter object — the sun or the moon.

🖼️ What’s This Activity?

This type of interaction uses an image with clickable areas (hotspots). The learner clicks on the area they think is correct — and gets immediate feedback.

In the demo:

• An image of the sun and moon
• User is asked to click the hotter object
• Clicking the sun gives positive feedback: “Great, you got it!”
• Clicking the moon or anywhere else gives custom error messages
• Feedback pops up at the click spot for better clarity

---

🛠️ What You Can Do With It

This activity is lightweight but powerful. You can use it for:

• Quick quizzes or visual checks
• Early education (e.g. animals, colors, shapes)
• Science basics (e.g. planets, body parts)
• Language learning (match objects to words)
• Safety training (find the hazard in an image)

You can even:

• Use custom images
• Choose circle or square hotspots
• Customize feedback per click
• Add it into a WordPress post with a simple shortcode

---

⚠️ What to Keep in Mind

This activity is simple, but with some limitations:

• Users get only one click per attempt
• Feedback appears immediately after that click
• You can define multiple correct hotspots, but only the first click is counted
• Best used for single-question interactions

If you want to create something more advanced, with multiple correct clicks or more complex instructions, try the Find Multiple Hotspots module in H5P.

---

✅ Why It’s Great

• No coding needed
• Fast setup with H5P on WordPress
• Great for visual learners
• Adds variety to your content without slowing down your site

---

📢 Enjoyed this tutorial?
👉 Subscribe to @Edu-Hermit for more practical, hands-on H5P guides and WordPress tips!
💬 Got ideas or questions? Drop them in the comments!

🧩 Image Sequencing in H5P

Fun, visual, and a great way to teach order

Hey folks!

Today we’re diving into a cool little activity you can make with H5P on WordPress—Image Sequencing.

This type of task is great when you want learners to arrange images in a specific order—like steps in a process, sizes, ages, or in our case… price tags. 😄

So here’s what the activity looks like:

You’re given a bunch of images—could be objects, events, anything. In our example, it’s items like a toaster, a car, a house. The task? Drag and rearrange them from most expensive to least expensive. Easy enough, right?

But here’s the twist—each image has an optional audio hint. Click it, and it’ll tell you what the item is and how much it costs. Great for learners who benefit from audio cues, or for making your activity accessible to visually impaired users.

Once you’re done, you hit Check, and you get instant feedback. Got something wrong? You can retry, or even resume from where you left off.

Let’s walk through how to set it up.

🛠️ Setting It Up in WordPress

1. Go to your H5P plugin in WordPress and click Add New.
2. Choose the Image Sequencing content type. If it’s not there, click “Get” to install it.

Give your activity a title—like Order by Price—and type out your instructions. I used:

“Arrange the items from most expensive to least expensive. If you need a hint, play the audio in each image.”

You’ll also want to add a text alternative for screen readers. Something like:

“Listen to the audio and arrange the items from most expensive to least expensive.”

🖼️ Adding Images + Audio

Here’s the fun part. You’ll add a series of images, and optionally, short audio files that describe the items. Each entry has:

• An image (e.g. a car, toaster, cruise ship)
• A description
• An optional audio file (MP3 or a direct link)

For example:

• 🚗 Car — “This car costs 40,000 dollars.”
• 🏠 House — “This house costs 300,000 dollars.”
• 🛳️ Cruise Ship — “This cruise ship costs two million dollars.”

Do that for each item.

After that, set the correct sequence in order—from most expensive to least. That’s how H5P knows the right answers.

⚙️ A Few Settings

Scroll down and you’ll find a few toggle options:

• ✅ Show solution (let learners peek at the correct order after they submit)
• ✅ Retry (let them try again from the beginning)
• ✅ Resume from current state (keeps their last order if they want to fix mistakes)

You can also override text labels if you want (e.g. change “Total moves” to “Moves so far”). Totally optional, but a nice touch if you want to localize or personalize the experience.

👀 Previewing the Activity

Once you hit Create, you’ll see your activity live.

Learners can drag the images around or tap them to move them into place. If they click the audio icon, they’ll hear the clue you uploaded—super helpful for reinforcing vocabulary or supporting different learning styles.

And yes—it counts how long they spend and how many moves they make. Great if you want to turn it into a timed challenge. ⏱️

💡 Final Thoughts

This kind of activity works beautifully for:

• Sequencing steps in a process
• Arranging items by size, age, price, weight—you name it
• Language learning (use food, animals, daily routines, etc.)
• Teaching listening comprehension via audio clues

It’s clean, easy to make, and super engaging. Just remember: by default, it’s a standalone activity. If you want to include it in a bigger quiz or workbook, you’ll need to use an Interactive Book or a Question Set inside H5P.

That’s all for this one. Give it a try—and don’t forget to test the audio before showing it to your learners!

👉 Subscribe to my YouTube channel for detailed H5P tutorials and WordPress tips: @edu-hermit

Creating an Image Pairing Activity in H5P on WordPress

Match the Pics!

Hey everyone! 👋

Today we’re building something fun: an Image Pairing activity using H5P on WordPress.

It’s a drag-and-drop challenge—simple to create, clean to display, and really engaging for learners. Think of it like a visual matching game: you drag one image (say, a landmark) to its match (like a country’s flag), check your answers, and boom—instant feedback.

Let’s walk through it.

🖼️ What It Looks Like

Here’s how it works:

You’ll see a column of images on the left (e.g., landmarks), and another on the right (e.g., country flags). The task? Match them up.

You can drag images around, or just click the pair you think belongs together. Once done, click Check, and see how many you got right. You can even retry or peek at the correct answers with a Show Solutions button.

It’s clean, intuitive, and works great across devices.

🛠️ Creating the Activity

1. Head to your H5P plugin in WordPress, hit Add New, and choose Image Pairing.
2. If it’s not installed, no worries—just click “Get” to add it. Give your activity a title (something like Landmarks & Flags).
3. In the instructions box, write something simple for your learners like: “Drag each landmark to the correct country flag.”
4. Now for the fun part—adding your image pairs: Each pair consists of:
   • A source image (this is what the learner will drag)
   • A target image (the one they’ll drop it onto) For example:
   • 🏯 The Great Wall of China → 🇨🇳 Chinese Flag
   • 🗽 Statue of Liberty → 🇺🇸 US Flag
   • 🕍 Big Ben → 🇬🇧 UK Flag
   • And so on…

Just keep adding more image pairs—it’s super flexible. You could use animals, symbols, food, maps—whatever your topic calls for.

⚙️ Settings (You Don’t Need Many)

There’s really only one main option here:

☑️ Enable Retry – lets users try again after checking.

You also get text override options (like changing button text), but you can leave those alone unless you’re feeling fancy.

And yeah—it’s English-only by default, but the activity works visually in any language.

🔍 Preview It

Click Create, and take a peek.

Once it loads, you’ll see your image columns. Just drag from the left to the right, or click once to select, then click the matching image.

Got it wrong? Try again. Or click Show Solutions to reveal the correct answers.

It’s clean, smooth, and very satisfying to use.

You’re done! 🎉

💡 Final Thoughts

This activity’s perfect for:

• Geography lessons
• Language vocab drills
• Science visual reviews
• Museum/gallery quizzes
• Even product-matching or branding practice

Just one note: this is a standalone activity.

If you want to bundle it into a quiz or workbook, use a Question Set or Interactive Book in H5P.

Otherwise, it’s great as-is—simple, visual, effective.

That’s it for this one. Thanks for hanging out!

👉 Subscribe to my YouTube channel for detailed H5P tutorials and WordPress tips: @edu-hermit

Find the Words” in H5P: The Word Search That Works (and Almost Always Looks Good)

Hey there! 👋

So, today we’re diving into a fun little H5P activity called Find the Words—a classic word search puzzle you can build straight into WordPress.

It’s simple. It’s interactive. It’s surprisingly satisfying.

Also… it only takes a few minutes to set up.

Let’s check it out.👇

🧩 What It Looks Like

You give users a word bank—maybe “apple,” “grape,” “peanut,” and so on—and they have to find those words hiding in a scrambled grid of letters.

The grid is smart enough to:

• Hide words forwards, backwards, up, down, or diagonally
• Overlap letters if you want (adds challenge!)
• Keep score and give feedback
• Let users give up and click “Show Solutions” if they’ve had enough

It works well on both desktop and mobile, and it’s slick enough that your students (or visitors) might actually want to try it again.

✍️ How You Build It (Quick Version)

To create your puzzle:

• Go to your H5P plugin in WordPress and hit Add New.
• Pick Find the Words from the activity list.
• Give your activity a title and write a quick instruction like: “Find all the fruit names in the grid.”
• Paste your word list in the box.
• Separate each word with a comma, no spaces. Example: apple,grape,lemon,peanut,plum

⚠️ Don’t include spaces or special characters in your words (e.g. “passion fruit” will break things or make the puzzle too obvious).

• Leave the alphabet on A to Z unless you’re customizing it for another language.
• Decide if you want the words to overlap (more challenge = more fun).
• Enable options like:
• ✅ “Show vocabulary list” (puts the words beside or below the puzzle)
• ✅ “Retry” (let users try again)
• ✅ “Show solution” (so no one rage-quits)

Hit Create and boom—you’re done.

🧪 A Quick Test

So once it’s published, try it out:

• Some words go left to right, others are backwards, vertical, or even diagonal.
• The longer the words you add, the bigger your grid will get.
• If a word has a space, like “passion fruit,” it’ll mess with the layout and give away the location—best to keep words short and sweet.

If you enable overlap, you might spot two words sharing a letter—“grape” crossing “peanut,” for example.

💡 If your layout is too narrow, the word list might move under the puzzle instead of showing up on the side. Not broken—just responsive design doing its thing.

🧠 Pro Tip: Keep It Playful, Not Perfect

This activity is best for:

• Class warmups
• Review sessions
• Fun breaks
• Practice quizzes

It’s not ideal for scoring-heavy exams or formal assessments. But it’s perfect if you want something that looks good, works fast, and gives users a little spark of “YES! I found it!” energy.

✅ Final Thought

“Find the Words” is a great way to add lightweight, interactive content to your site.

Takes minutes to build. No coding. Zero headaches. Lots of clicking. All good vibes.

If you’re running a class blog, an educational site, or even just spicing up a language lesson—give it a go.

👉 Subscribe to my YouTube channel for detailed H5P tutorials and WordPress tips: @edu-hermit

Mark the Word in H5P (A Fun Way to Test Vocabulary—But It’s Got Quirks)

Hey folks,

Let’s talk about another fun (but slightly flawed) H5P activity: Mark the Word. It’s one of those sneaky powerful tools—you paste in a paragraph, tell students to highlight specific words (like verbs or adjectives), and they click the ones they think are correct.

On paper? Super slick.

In practice? A little clunky—but still totally worth using if you know its limits.

🧠 What It Actually Does

Here’s what this activity looks like:

You give students a paragraph. You ask them to mark, let’s say, “five verbs.” They click words. If they click the right ones, they get a point. Simple.

Example:

The Smurfs built a beautiful home. They used wood, brought water, told stories, and the rain swept it away.

In this case, words like built, used, brought, told, and sweep are marked as the correct answers (by wrapping them in asterisks). Students have to pick them out.

🛠️ How You Set It Up (Quick Version)

If you’re using WordPress + H5P, the flow is:

• Go to your H5P plugin > Add New.
• Search for Mark the Words (install it if you haven’t).
• Paste your paragraph in the question box.
• Wrap each correct word with an asterisk on each side: *used*, *built*, etc.
• Add your instructions at the top (“Mark the five verbs in the paragraph.”)
• Save. Done.

🚨 Important: You can only mark single words. No phrases, no multi-word expressions. “built a home” won’t work. Just “built.”

🤔 A Few Things That Might Annoy You

Now here’s where I step in with a few reality checks—because if you plan to use this for grading, there are things you should know:

❌ Students can mark as many words as they want

Even if your instructions say, “Mark 5 verbs,” nothing stops a student from clicking every word in the paragraph. H5P doesn’t limit the number of selections. No warning, no max limit.

So yeah, guessing is a viable strategy.

❌ Mistakes = Penalties

Mark 4 verbs correctly but accidentally click 1 noun? You don’t get 4/5.

You get 3/5 because one of your answers gets you a -1.

This can be a little harsh, especially when students are genuinely close. Unfortunately, you can’t turn off this penalty system in this activity (unlike some other H5P types where that’s optional).

❌ It Doesn’t Look Interactive

The activity just shows up as a normal paragraph. Unless students hover over it, there’s nothing to suggest it’s clickable.

A little hover effect helps, but a subtle visual cue—like dotted underlines or faint borders—would’ve made this much clearer.

💡 So When Should You Use It?

Despite the flaws, Mark the Word has its moments:

✅ Great for low-stakes classroom activities

✅ Useful in practice exercises or self-checks

✅ Can help reinforce vocabulary or grammar points quickly

❌ Not ideal for graded assessments

✅ Final Thoughts

This activity is like a good side dish. It’s not the main course—but it adds flavor. It’s quick to build, easy to understand, and gives you another way to make reading passages a bit more interactive.

Just… know what you’re getting into. It’s not perfect. But it can be fun.

👉 Subscribe to my YouTube channel for detailed H5P tutorials and WordPress tips: @edu-hermit

Making That Fancy Drag & Drop Image Quiz in H5P (Yeah, the One With Pictures)

Alright, welcome in.

Today we’re talking about something that looks super polished but is actually pretty easy to make once you know how: a drag and drop image activity using H5P on WordPress.

You’ve probably seen these before. You’ve got some pictures—famous landmarks, animals, whatever—and students drag words onto them. Maybe they drop “France” onto the Eiffel Tower, “Egypt” on the Pyramids, and so on. It’s fun. It’s interactive. And it’s way more engaging than a basic multiple-choice question.

Here’s what it looks like when it’s done:

A few pictures lined up Some draggable words You drag the word onto the right picture Check your answers Feel great (or fail gently)

I set mine up with three images: the Pyramids, the Eiffel Tower, and the Leaning Tower of Pisa. Underneath? “Egypt,” “France,” and “Italy.” Drag, drop, check. Easy.

Except—not that easy the first time you build it. The setup is a bit different from the regular drag-the-words stuff. So if you’ve done that and expected this to work the same, surprise! It doesn’t.

The Trick Is: Drop Zones

Unlike the word-based ones, where you just put asterisks around stuff, this one is all about building the structure. You upload images, add invisible boxes over them (called drop zones), and tell H5P, “Hey, this text label belongs on that picture.”

Sounds clunky, but once you do it once, it clicks.

• You add your images (nice and square, please).
• You drag out invisible boxes over them (these are where your answers go).
• You add text labels like “Italy” or “France.”
• And then you do the secret sauce: tell H5P which label goes where.

It’s like setting up a party and assigning name tags.

Oh, and one more thing—make the drop zones transparent, or they’ll awkwardly cover your pretty images with gray rectangles. (Been there.)

A Quick Rant About Scoring

The default scoring is wild. If you get one right and two wrong, it gives you zero—or even negative points. Come on. We’re not monsters.

So, go into the settings and turn off penalties. You miss one? Fine. Just don’t take points away.

Also, uncheck the “one point for the whole task” box. Your students deserve credit for what they got right, not all-or-nothing grading.

Wrapping It All Up

Once it’s all set up, you preview the activity, grab the shortcode, and paste it into a blog post. Done. Now it’s live on your site, and your students (or visitors, or whoever) can play with it.

The best part? You can get really creative with this. Landmarks are cool, but you could do:

• Animals and their habitats
• Foods and countries
• Tools and their uses
• Literally anything visual

And if you’re feeling fancy, you can even throw in a background image to tie it all together. Just don’t let it steal the show.

That’s it.

Not bad for a five-minute build once you know the steps.

More H5P stuff coming soon—text, images, quizzes, weird hacks.

See you next post.

👉 Subscribe to my YouTube channel for detailed H5P tutorials and WordPress tips: @edu-hermit

Creating a Drag the Words Activity with H5P on WordPress

If you’re looking for a fun, interactive way to reinforce key vocabulary or test student recall, Drag the Words in H5P is a fantastic choice. In this tutorial, I show you how to build this activity in WordPress, where learners drag the correct words into blank spaces in a sentence or paragraph.

The finished product is clean and easy to use:

👉 Sentences with missing words

👉 Draggable word choices on the side

👉 Instant feedback with retry and show-solution options

For example:

A week has ___ days

A minute has ___ seconds

Students drag the correct number into each sentence and check their answers. Even better, if multiple blanks share the same correct word (like “60”), H5P handles that perfectly with duplicate draggable options.

This kind of activity is ideal for:

• Reinforcing key facts and numbers
• Grammar practice, like verb forms or prepositions
• Cloze-style reading comprehension
• Matching terms with definitions or context

The sentences are created using a simple format: just wrap any word you want to be draggable with asterisks (e.g., *seven*), and H5P handles the rest. You can create lists or even build full paragraphs with blanks.

Once you’re done setting it up in the H5P editor, just grab the shortcode and paste it into any WordPress post or page — no extra coding needed.

👉 Subscribe to my YouTube channel for detailed H5P tutorials and WordPress tips: @edu-hermit

How to Create a Fill in the Blanks Activity with H5P on WordPress

In this video, I show you how to create a simple yet powerful Fill in the Blanks activity using H5P on WordPress. This type of task is great for language practice, vocabulary reinforcement, or any kind of sentence-based learning check.

The activity works exactly like you’d expect: learners are shown a sentence with one or more missing words, and they simply type in the correct answer. For example:

“The moon comes out at ___”

“The sun comes out in the ___”

It’s clean, straightforward, and gives instant feedback. If the answer is incorrect, users can try again or choose to see the correct solution. And of course, you can customize the feedback and settings to fit your needs.

What makes Fill in the Blanks especially useful is how versatile it is. You can use it for:

• Grammar and sentence structure practice
• Cloze tests for reading comprehension
• Science definitions, historical facts, or geography terms
• Any learning content where active recall is helpful

You can also tweak the design by adding images (optional), editing feedback messages, and removing toolbars for a cleaner look — perfect for embedding in blog posts or lessons.

Once your activity is done, you’ll get a shortcode to drop directly into a WordPress page or post. It looks seamless on the front end and works great across devices.

👉 Subscribe to my YouTube channel for more easy tutorials on H5P and WordPress: @edu-hermit

How to Create a True or False Activity with H5P on WordPress

In this tutorial, I walk you through building a simple True or False activity using H5P on WordPress — perfect for quick quizzes, fun facts, or comprehension checks on your website.

The finished result is a clean, interactive question that includes an image and a statement like: “The animal in the picture is a horse – true or false?” Learners can click their answer, check their response, and get immediate feedback. It’s a simple but powerful format that works great for visual learning.

Adding an image to the question helps make the activity more engaging and gives learners context. You can also customize the feedback messages, allow retries, and even enable zoom on the image — a nice touch when using detailed visuals.

These types of questions are great for:

• Vocabulary checks (e.g., “This is a tomato” with a food image)
• Science review (e.g., labeling parts of animals or plants)
• Quick facts in history, geography, or language learning
• Lightweight self-assessments in blog posts or courses

While this example focuses on a single true or false question, you can always create a Question Set if you want to include multiple questions or mix in other activity types like multiple choice or drag-and-drop.

The best part? Once your activity is ready, H5P gives you a simple shortcode to paste into any WordPress post or page — no coding needed.

👉 Want more tutorials like this? Subscribe to my YouTube channel for in-depth guides on H5P and WordPress: @edu-hermit

Creating a Multiple Choice Activity in H5P (Made Simple)

In this video, we dive into one of the most widely used H5P content types — the Multiple Choice activity. It’s a quick and effective way to test understanding, reinforce knowledge, or just make your content a little more interactive.

I show you how to build a simple activity using an image of cherries as the base for a visual multiple choice question. The result? A clean, responsive quiz that gives learners instant feedback and allows retries — making it perfect for both formative assessments and self-paced learning.

One great thing about H5P’s Multiple Choice tool is its flexibility. You can:

• Add images to enhance your questions
• Give hints or explanations for each option
• Customize feedback based on performance
• Set pass/fail thresholds
• Enable retry or show solutions after submission

This kind of activity works beautifully for language learning, science diagrams, history quizzes, or just about any subject where quick check-ins help students stay on track. Plus, it’s mobile-friendly and integrates seamlessly into WordPress with a shortcode — so your quizzes look great on any page or post.

And while this example only included one question, I’ll show you how to build full question sets in a future video, where you can stack as many questions as you like.

👉 Enjoyed this walkthrough? Subscribe to my YouTube channel for more H5P tutorials and WordPress tips: @edu-hermit

If you’re just getting started with H5P and WordPress, the first step is getting the plugin up and running — and good news, it’s super easy.

In this video, I walk you through installing H5P on a fresh WordPress installation. All you need to do is head to the Plugins section in your WordPress dashboard, click Add New, and search for “H5P.” You’ll see a few results, but the one you want is “Interactive Content – H5P” — this is the official plugin that comes from H5P.org.

Once you hit Install and Activate, you’ll find a new menu item in your dashboard called H5P Content. This is where the magic starts. From here, you can view your existing activities (if you have any), or head to Add New to start building interactive content.

Before you can start creating, you’ll need to install at least one content type — like multiple choice, interactive video, flashcards, etc. It’s basically like downloading a template so you can use it again and again. Just pick the one you need and click Get, and it’ll be ready to use right away.

You’ll also find a Libraries section where you can upload H5P files you already have. This is handy if you’re moving from another site or sharing content between platforms. And finally, the My Results section will show learner scores once your activities are live and completed.

That’s it for the basic setup! In upcoming tutorials, I’ll show you how to create your first activity and embed it right into your site.

👉 Don’t forget to subscribe to my YouTube channel for more WordPress + H5P tutorials: @edu-hermit