{"id":72,"date":"2025-10-12T18:27:56","date_gmt":"2025-10-12T17:27:56","guid":{"rendered":"https:\/\/www.rezeau.org\/wp-h5p\/\/?page_id=72"},"modified":"2025-10-25T22:45:42","modified_gmt":"2025-10-25T20:45:42","slug":"advanced-fill-the-blanks-papi-jo-documentation-2","status":"publish","type":"page","link":"https:\/\/www.rezeau.org\/wp-h5p\/advanced-fill-the-blanks-papi-jo-documentation-2\/","title":{"rendered":"FITB Documentation"},"content":{"rendered":"\n

Current version: 1.3.1 October 2025<\/h3>\n\n\n\n

Rationale<\/h2>\n\n\n\n

The Advanced Fill in the Blanks ‘papi Jo’ H5P activity is based on the semi-official<\/em> H5P Advanced Fill in the Blanks<\/a> activity by Sebastian Rettig. The bug fixes and improvements listed below have been submitted to Sebastian who approved them. My initial aim was to incite Sebastian to include my suggestions into his distribution. However, that was not possible and Sebastian encouraged me to create my own fork.<\/p>\n\n\n\n

Bug fixes<\/h2>\n\n\n\n
    \n
  1. Make Highlight Positions “stick” when editing a content. Simply added double quotes to values in Semantics e.g. “value”: “-1”<\/strong>, “label”: “- 1 (right before the blank)”.<\/li>\n\n\n\n
  2. Show confirmation dialog on “Check”.<\/li>\n<\/ol>\n\n\n\n

    Improvements<\/h2>\n\n\n\n
      \n
    1. In Semantics, added display overall feedback<\/em> and incorrect answers<\/em> “expanded”: false to avoid cluttered editing screen especially when there are lots of incorrect answers provided.<\/li>\n\n\n\n
    2. Added a Feedback for correct answer field<\/em>.This (optional) feedback can be used to confirm that the user found the correct answer in order to re-enforce his choice.<\/li>\n\n\n\n
    3. Added a regular expression option for wrong answers with 2 main features: detect wrong answers <\/em>or parts of answers and detect missing words<\/em>. That is the main improvement.<\/li>\n\n\n\n
    4. Added an option for Show Solutions<\/em> to display either only the first correct answer OR all of the alternatives (as in the original H5P Blanks activity).<\/li>\n\n\n\n
    5. Allow the use of the forward slash in correct answers, e.g. 10\/20, by escaping the slash like this 10\\\\\/20.<\/li>\n\n\n\n
    6. For correct and showing solution input fields, fit the field size <\/em>to the answer being contained (needs a monospace font<\/em> for correct display, see point 9 below).<\/li>\n\n\n\n
    7. Various adjustments <\/em>to the ticks and crosses and tip icons for a more aesthetic display (subjective).<\/li>\n\n\n\n
    8. Hide tip icon if blank was answered correctly OR blank showing solution<\/li>\n\n\n\n
    9. Placed a link to Google Font ‘Roboto Mono’ in the CSS file. This is needed to display a better fit for text inside input fields. The ‘Roboto Mono’ font looks much better than the default Courier or monospace fonts available.<\/li>\n\n\n\n
    10. Added an automatic grow text field<\/em> feature for the input field (on Sebastian’s TODO list). It’s working OK except when using Del or Backspace to delete already entered characters, so will need to be refined.<\/li>\n<\/ol>\n\n\n\n

      Tutorial<\/h3>\n\n\n\n

      Since the Advanced Fill in the Blanks ‘papi Jo’ H5P activity is based on the H5P Advanced Fill in the Blanks<\/a> activity, please refer to the original tutorial linked above. In this tutorial I will only add all the necessary information related to the differences<\/em> between the 2 versions.<\/p>\n\n\n\n

      Step 1: Topic<\/h3>\n\n\n\n

      Step 2: Creating Advanced Fill in the Blanks<\/h3>\n\n\n\n

      Step 3: Advanced Fill in the Blanks editor<\/h3>\n\n\n\n

      Step 4: Task Description<\/h3>\n\n\n\n

      Which compound adjective would you use to describe the following:<\/em><\/p>\n\n\n\n

      Step 4b: Behaviour settings<\/h4>\n\n\n\n

      Our tutorial is based on the use of the regular expressions (new) feature, so before proceeding you need to select the following options in the Behaviour settings:<\/p>\n\n\n\n

      Answer mode<\/strong>: The user types in the answers
      Use Regular Expressions<\/strong>: Check this box<\/em><\/p>\n\n\n\n

      Step 5: Text with Blanks<\/h4>\n\n\n\n

      Under Text with Blanks <\/strong>we will type the exercise like this:<\/p>\n\n\n\n

      a little girl who was born !!5 (five)!! !!years!! ago? a ____ girl<\/em><\/p>\n\n\n\n

      Now we should define all the possible correct alternatives as well as the potential incorrect ones. This is done in the “Blanks used in the text” section.<\/p>\n\n\n\n

      1.- For the first blank, we’ll add the below as a correct answer: <\/h5>\n\n\n\n

      Correct answer<\/strong>: five-year-old\/5-year-old<\/em>
      Hint<\/strong>: you may leave this empty or add a hint
      Feedback for correct answer: <\/strong>Correct, a little girl that is 5 years old is a 5-year-old girl.<\/em>
      This feedback should confirm that the user found the correct answer in order to re-enforce his choice. New feature in the ‘papi Jo’ version.<\/p>\n\n\n\n

      2.- And below add a set of incorrect answers and feedback if one of them is chosen:<\/h5>\n\n\n\n

      Note<\/strong>.- When using the Regular Expressions option in the detection of potential incorrect answers, you have a choice of detecting a) the presence of incorrect elements<\/em> or b) the absence of needed correct elements<\/em> in the student’s answer. In the incorrect answer text, absent needed elements are preceded by a double minus sign, e.g. –year.<\/p>\n\n\n\n

      Here are some examples. You can view the complete list of those potential incorrect answers together with the associated feedback messages if you download the H5P ADV FITB ‘papi Jo’ template to your computer.<\/p>\n\n\n\n

      Incorrect answer #0: detect the presence of an incorrect word in the student’s answer<\/strong><\/h5>\n\n\n\n

      Incorrect answer text: (little|small)<\/em>
      Feedback: Of course, that’s a little girl, but you must <\/em>write a compound <\/em>adjective in your answer.<\/p>\n\n\n\n

      Here we are using a very simple regular expression, Alternation with The Vertical Bar or Pipe Symbol<\/a>. The enclosing brackets are optional here.<\/p>\n\n\n\n

      Incorrect answer #1: detect the absence of the word ‘year’ in the student’s answer<\/strong><\/h5>\n\n\n\n

      Incorrect answer text: –year<\/em>
      Feedback: You need to use the noun “year” <\/em>to form this compound <\/em>adjective.<\/p>\n\n\n\n

      Please note that the use of the double minus sign here is not <\/em><\/strong>part of the set of conventional regular expressions. It’s used to simplify things. The double minus sign can be followed by any valid regular expression.<\/p>\n\n\n\n

      Incorrect answer #2: detect the absence of the words ‘5’ or ‘five’ in the student’s answer<\/strong><\/h5>\n\n\n\n

      Incorrect answer text: –(5|five)<\/em>
      Feedback: You must specify the age <\/em>of the little girl in your compound adjective (use 5<\/strong> or five<\/strong>).<\/p>\n\n\n\n

      Incorrect answer #3: detect the incorrect presence of extra spaces on either side of the hyphen sign in the compound adjective<\/strong><\/h5>\n\n\n\n

      Incorrect answer text: ( -|- )
      Feedback: Do not put a space <\/em>(or any other punctuation mark) before or after the hyphen character (-).<\/p>\n\n\n\n

      Incorrect answer #4: Detect the incorrect presence of extra words on either side of the compound adjective<\/strong><\/h5>\n\n\n\n

      Incorrect answer text: (-.*-.*)\\\\s(\\\\w+)|\\\\s(\\\\w+)(-.*-.*)
      Feedback: Have you not put one word too many at the beginning or at the end of your answer?<\/p>\n\n\n\n

      That’s a very <\/em>complex regular expression. You will probably never have to go to that extreme, unless you are or become an expert in regular expressions!<\/p>\n\n\n\n

      \n\n\n\n

      Extra options<\/strong><\/p>\n\n\n\n

      You can also define which part of the text will highlight when the feedback is shown. This is done by putting the word between (“!!”). For example:<\/p>\n\n\n\n

      a little girl who was born !!5 (five)!! !!years!! ago? a ____ girl<\/em><\/p>\n\n\n\n

      Putting the words “5 (five)” between !! means that this word will highlight when we display the feedback for the first set of incorrect answers.<\/p>\n\n\n\n

      You should now see something like this:<\/p>\n\n\n\n

      \"\"<\/figure>\n\n\n\n
      \"\"\/<\/figure>\n\n\n\n

      Step 6: Adding more sentences<\/h4>\n\n\n\n

      Proceed as with sentence #1<\/p>\n\n\n\n

      Step 7: Behaviour settings<\/h4>\n\n\n\n

      We can now return to the Behaviour settings to select some more options.<\/p>\n\n\n\n

      Answer mode<\/strong><\/em><\/p>\n\n\n\n

      If you are not <\/strong>using the Regular options option, then you can select The user selects from options as per the original ADV FITB activity.<\/p>\n\n\n\n

      Behaviour when user makes a spelling error<\/strong>
      Warn the user about the error
      Accept it as a correct answer
      Consider it a regular mistake<\/em><\/p>\n\n\n\n

      These 3 options work in conjunction with the Regular Expressions<\/em> option. I recommend selecting Warn the user about the error<\/em>.<\/p>\n\n\n\n

      Case sensitive<\/strong><\/p>\n\n\n\n

      This option also works in conjunction with the Regular Expressions<\/em> option.<\/p>\n\n\n\n

      Automatically check answers after input
      Enable “Show solutions” button
      Require all fields to be answered before the solution can be viewed
      Enable “Retry”<\/strong><\/p>\n\n\n\n

      These 4 options work as per the original ADV FITB activity.<\/p>\n\n\n\n

      Show all alternative solutions<\/strong>
      If your blanks have more than one correct solution, check this to display all the alternatives when showing solutions. This is a new ‘papi Jo’ option.<\/p>\n\n\n\n

      Please note that the size of the blanks are automatically adjusted to the text they contain, upon checking answers or showing solutions. This is possible because the text inside the blanks use a fixed-width font from Google, ‘Roboto Mono’.<\/p>\n\n\n\n

      Snippets<\/h4>\n\n\n\n

      If you create a number of similar sentences with blanks within one H5P ADV FITB activity, you may find the Snippets feature quite useful. Snippets are texts that can be reused in feedback texts by inserting @snippetname into the feedback texts.<\/p>\n\n\n\n

      Using regular expressions<\/h3>\n\n\n\n

      Regular expressions are a powerful tool for analysing students’ answers with a view to provide ever more relevant feedback messages to help their learning. But they can be quite hard to master. Of course you can always limit the regular expressions you enter for the potential incorrect answers to a few simple expressions.<\/p>\n\n\n\n

      You can find some help in the documentation I have written for my Moodle Regexp Question Type here<\/a>. although the regular expressions system is not identical. This part is the most relevant to using regular expressions in H5P ADV FITB ‘papi jo’: Detecting missing required words or character strings<\/a>.<\/p>\n\n\n\n

      For more general help about Regular Expressions, visit these sites:<\/p>\n\n\n\n