Duolingo-style extension of Drag the Words

theotherdy's picture

I'm a web developer who is thinking of adapting the H5P Drag the Words question type to create a Duolingo-style drag-some-of-these-words-into-the-right-order question type - ie:

  1. Extra words as well as those which are correct
  2. Allow any number of the words to be dragged into a sentence-like target (probably multiple targets which expand when filled with a word and with a new target created between any two filled targets)
  3. Marking will not depend on which word is in which target but rather on having the right words in the right order in any target

If anyone is aware of anything which will help me get started with this - I've aleady read the developer docs - I'd be very grateful to any pointers to: anyone who's already working on something similar, which libraries I ought to be lookin at, etc.

Many thanks

Content types: 
tomaj's picture


Awesome that you are starting a new content type.

My personal opinion is that you would probably be better off starting from scratch then adapting the "Drag the Words", as it is full of technical debt.

Here are a few points that you probably didn't read about in the documentation:

  1. A possible starting point for a new content type is this boilerplate code.
  2. We've tried out using Vue.js in a few new content types (Audio recorder, Feedback), and I've found it work very well. (I think transition groups can fit the lists of words very well).
  3. Alternativly React has been tried out in the speak the words content type. But be aware that the licence isn't completly opent, so you probably won't see more content types using it. And not everyone can use content types with this licence.
  4. Most Content Types javascript classes, extends H5P.Question or H5P.EventDispatcher.
  5. There are a bunch of utility functions in Question or Joubel UI.

- Tom

theotherdy's picture

Thanks @tomaj - still not had a chnace to look at this but hoping to get to it in the next few weeks.


otacke's picture

Looking forward to watching your code grow!

serettig's picture

Hi theotherdy,

did you find the time to work on this content type? I'd be very interested in it.


theotherdy's picture

Sorry @serettig, only just spotted this. Nothing as yet I'm afraid but hoping to get to in the the next few weeks.


Fast forward three years later, here I am! Did you manage to make progress on this project, Damion? I hired a developer to do exactly that but the current result is not very convincing...


And here I am! I've hired a developer to do exactly what you described by editing the H5P drag and drop but the current result isn't very convincing. Have you found a way to do it, Damion?