#39 H5P – iFrame Embedder Activity Tutorial

🌐 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!