A sort of sorts

As you may know, I am an IT freelancer who (among other things) creates new H5P content types and features. Sometimes, there are companies who hire me and don’t mind if what I create for them becomes open source software. We have another case!

Sonny English who runs justasksonny.com required an H5P content type that allows to sort paragraphs into the correct order. Here it is: Sort the Paragraphs!

You may notice a couple of things. Here, the content doesn’t consider the correct and wrong positions of the paragraphs, but the correct and wrong transitions between them. Otherwise, you could receive a score of even 0 if you just misplaced the paragraph that was supposed to be the last one to the top – although the order of the rest was fine.

But that’s up to you to decide. Maybe you want to use the content type for a pseudo-coding exercise and rather want everything to be in the right spot (or the code wouldn’t work)?

Have you noticed, by the way, that you can drag and drop the paragraphs or use the buttons or use the keyboard in order to move them around? The buttons are rather intended for mobile use, because H5P content lives inside an iframe and that could cause trouble for dragging the paragraphs if they don’t fit on the screen. The keyboard is part of the content type’s accessibility features – like having buttons that seem to be quite large, but they just have kind of the minimum suggested size for touch use by people with disabilities. You can override the CSS on your platform if you want them smaller deliberately, of course.

I’ll leave it to you to find out the other small features that the content type has. The easiest way to install it is by downloading one of these demo contents and to upload that to your platform. Remember that you need the rights to install H5P libraries in order to do that. If you want to have a look at the source code instead, feel free to visit the content type’s github repository.

Some more details:

Aktivieren Sie JavaScript um das Video zu sehen.

Update Nov 14, 2020:
Peter Baumgartner hinted that the swapping of draggables wasn’t intuitive and that a draggable should rather displace other draggables when being dragged – what a drag 😉 I changed that. Also, I just added an option to treat duplicate paragraphs as identical (based on their plain text content). You can now, e.g. let students sort the notes of a tune which generally will have duplicate notes.

Update Jun 29, 2021: The content type has passed the review of the H5P core team, lost some bugs during that process and learned two new tricks. Should be available on the H5P Hub soon.

4 Replies to “A sort of sorts”

  1. Hi Oliver

    First of all, thanks for your big contribution. I was wondering, if it would be possible to adjust the sort the paragraphs, to a sort the words? So that it can be used for sorting sentences. I know that on mobile, it will be a bit small, but maybe it would be ok for shorter sentences. Or maybe, it could be in two lines?

    1. I am not sure that I understand what you are requesting. Sort the paragraphs can be used for sorting sentences since day 1. All the examples on this page show that sentences can be used, even with line breaks if want to have some.

  2. Sorry for not being clear. I mean, sort the words of a sentence but horizontally instead of the current vertical layout. So each container would have 1 ord maybe 2 words. And it would be super cool if the container could auto adjust according to the length of the words. Hope it makes sense. 🙂

    1. Thanks, now I get what you mean. Could probably be done, but it might end up changing quite a bit of code. Nothing I’d do in my free time, probably.

Leave a Reply

Your email address will not be published. Required fields are marked *