Submit a request
Submit a request

Cloze Math with Image

Note: With v2023.3.LTS, we released a new Label image with math Question type that uses our revamped scoring engine. If using v2023.3.LTS and onward, we recommend all new content be created with Label image with math, instead of Cloze math with image, to take advantage of the new scoring capabilities. To learn more, see related article


The Cloze Math with Image question allows students to easily enter complex math formula as a response on top of an image, with advanced validation capabilities using math specific scoring methods.


Figure 1: Cloze math with image question example.

Create a question

Enter the question stem into the Compose question area. You may want to use our Math Editor in order to insert a mathematical expression in the stimulus. For this click inside the Compose Question text area and select Math Editor from the Rich Text Editor panel (see Figure 2).


Figure 2: Math editor button in the rich text toolbar.

Upload an Image

Upload the image to be used for the question using the Edit button in the Image preview field. A pop up box will appear, where you can upload an image to Learnosity. A URL for an image that exists elsewhere online can be pasted into the Source URL field in the More options section of the pop up box.

It is optional to configure Text on hover, i.e. text that appears on an image when the cursor hovers over it, as well as Image alternative text, i.e. text that appears in place of the image if it fails to load on the page.

When the prevent image scale option is enabled, the image size will not be scaled when the screen size has changed.


Figure 3: Cloze math with image basic parameters.

Adding Response Containers

In the Response positions section, click on the +ADD button to add a new response container on top of the image. Drag and position the response containers on the image as desired.


Figure 4: Positioning response containers on the image.

Modifying Response Containers

Any modifications made in the Response container (global) section will affect every response container in the question. This makes it possible to universally change the width and height of the response containers using the width and height fields in this section.

It is possible to only modify specific response containers using the Response containers (individual) section. You will notice in the Response positions section that each response box on the image is numbered; this means that the 'Container 1' area in the Response containers (individual) section will modify the response container labelled with number 1.

If you wish to add some extra formatting to the response containers, you can do so in the Template fields in both the Response containers (global) and Response containers (individual) sections. Note that the same rules apply as setting the width and height; modifying the template in the global section will affect all response containers on the question, if you want to add extra formatting to specific containers, do so using the individual section. 

The Vertical top setting in both sections ensures that the position of the response boxes stays at the position set by the author, regardless of changes to the font size or container's size, i.e. it ensures that the position of the responses stays at top: 0, left: 0 of the container.

Note that the settings in the Response containers (individual) section will override settings in the Response containers (global) section.


Insert a value in the Point(s) box to define a mark for the question. The default value is set to 1.

Below that, there is a sub-menu available for each response container in the question. The number of the response container will correspond with the number on the sub-menu, e.g. validation for the response container numbered with 1 will be handled in the Response 1 sub-menu.

Within each sub-menu, select a scoring method, and enter the correct response in the Value field.

Note that if you entered any extra mark-up inside the Response containers (global) or (individual) Template fields, that mark-up will also need to be entered in the Value field in validation.


Figure 5: Validation settings for cloze math with image question with one response container.

Each scoring method has additional options that allows authors to set more precise validation conditions. When you select a scoring method, all extra options will be displayed below the menu.

Some more complex math questions will need a second scoring method applied. You can combine several scoring methods to set more strict validation rules. In this case, you would need to add another method called isFactorised. Click on the +Add button to create a new scoring method.

More options: Scoring

  • Unscored/Practice usage - Removes all scoring from the question.
  • Penalty point(s) - The value entered here will be deducted from the student for an incorrect answer.
  • Minimum score if attempted - Marks that will be awarded to the student for attempting the question, regardless of whether their answer is right or wrong.
  • Check answer button - Show or hide the heck answer button from the student. The check answer button will tell a student if their response is correct/incorrect, it does not tell the student what the correct answer is or supply any other feedback.
  • Check answer attempts - The value entered here refers to how many times the student can use the check answer button, before it is disabled.


Transparent background - If this is enabled, the background of the response area will match the colour of the rest of the background area.

Response minimum width (px) - Enter, in pixels, the minimum width of the response area.

Template font scale - Scales the font relative to the question's font size. The default value is Boosted (150%). This value can be changed to Normal (100%) if you would like the font size in the template area to match the rest of the question text.


Type - Select from a Floating keypad, a Block keypad, a Block on focus keypad, or no keypad.

Show keypad hints - Enable or disable hints on the keypad, such as keyboard shortcuts and symbol group titles that are shown on the top left corner of the keypad when hovering over a symbol group key.

Enable horizontal keypad - this changes the keypad layout to a rectangular, 2 row, keypad. You can then customize this keypad by clicking on a button and either replacing it with another symbol or leaving it empty.

Number pad - Customise the number pad in this section; remove buttons, change the order of buttons.

Symbols - Select what symbol groups will be shown to the student, or create custom symbol groups.

Text blocks

Use this option when you want to define a list of custom units (such as g, kg, cm, oz, etc.) that will not be rendered as LaTeX when entered by the student. This is useful if you do not want to penalise the student because they didn't enter a unit of measurement next to a value. See the dedicated Text Blocks article.

Was this article helpful?

Did you arrive here by accident? If so, learn more about Learnosity by clicking here.