🧩 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
- Go to your H5P plugin in WordPress and click Add New.
- 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
Leave a Reply