Turn Multiple-Answer Gaps Into Drop-downs And Other Advanced Adjustments

You know that the Intelligence module of WatuPRO allows you to create “fill the gaps” questions. Each of the “gaps” (blanks) can have multiple correct answers when you use the following format:

The apple can be {{{green|red|yellow}}}

In the above example if the user fills green, or red, or yellow in the generated text field, their answer will be correct.

From version 5.0.2 the same format can be used for different purpose by selecting the following checkbox on the Edit Question page:

gaps-dropdownsWhen this is selected, all the gaps that have more than one answer within the question will be turned into drop-down selector. The drop-down selector will have one option for each answer given. The first answer that you have given is the only correct answer. But of course, it will not be shown first – the selections will be randomized so the user will not know which is the correct answer.

So if we use the above example, the correct answer will be “green” and red / yellow will not be correct.

This setting is per-question so it will affect all the blanks within the selected question.

Other Fill The Gaps Adjustments

You can create a “placeholder” for each regular gap (not for drop-downs) to give a hint or remind for the supported format in the gap like this:

One dollar has {{{100|placeholder="numbers only"}}} cents in it.

For gaps that allow multiple correct answers you can do the same – just make sure the placeholder is the last value:

A good apple color can be {{{green|red|yellow|placeholder="type color name"}}}.

On the WatuPRO Settings page you can define the width and height of the gaps. Sometimes you may need to apply specific CSS style to an individual gap. You can do this by passing an inline style as last answer for the gap (in case there is a placeholder, style should be after it). Examples:

One dollar has {{{100|placeholder="numbers only"|style="font-weight:bold;"}}} cents in it.

A good apple color can be {{{green|red|yellow|style="width:150px;"}}}.