{"id":270,"date":"2025-10-20T19:20:58","date_gmt":"2025-10-20T17:20:58","guid":{"rendered":"https:\/\/www.rezeau.org\/wp-h5p\/\/?page_id=270"},"modified":"2026-04-07T14:55:31","modified_gmt":"2026-04-07T12:55:31","slug":"documentation-dd","status":"publish","type":"page","link":"https:\/\/www.rezeau.org\/wp-h5p\/documentation-dd\/","title":{"rendered":"DD Documentation"},"content":{"rendered":"\n<h4 class=\"wp-block-heading\">Library Drag and Drop Papi Jo<\/h4>\n\n\n\n<p><strong>CURRENT VERSION 1.13.30 &#8211; 2025<\/strong><\/p>\n\n\n\n<p><strong>Version 1.13.30 <\/strong>fixed language\/fr.json and edited icon.svg\u00a0<\/p>\n\n\n\n<p><strong>Version 1.13.26&nbsp;<\/strong>fixes a small bug introduced in previous version 1.13.25. It also allows for shuffling of the so-called &#8216;multiple&#8217; draggables, only once at the start of activity.<\/p>\n\n\n\n<p><strong>Version 1.13.25 <\/strong>updates the look of correctly placed draggable elements when Showing Solution. This new look is more in keeping with the look of other default H5P activities when showing Solution.<\/p>\n\n\n\n<p><strong>Version 1.13.24 <\/strong>fixes minor visual bugs (hovering).<\/p>\n\n\n\n<p><strong>Version 1.13.22 <\/strong>enables the Audio option for drag zones. See \u00a74.4 below.<\/p>\n\n\n\n<p><strong>Version 1.13.12 <\/strong>allows for a more logical display of individual feedback for drop zones when using the <em>Quantity in drop Zones AND draggables value<\/em> option. See the <em>Of apples and worms<\/em>example. And paragraph 4.3 below. Thanks to Giovanni Fonseca for requiring that improvement.<br>A new <em>Description field<\/em> has been added, which is curiously missing from the default H5P Drag &amp; Drop content.<br>A new <em>Disable completed Drop Zones<\/em> option has been added. See \u00a7 3.13 below.<\/p>\n\n\n\n<p><strong>Version 1.13.9<\/strong> fixes a number of small bugs, and makes the Save Content State feature more reliable (if enabled in the H5P settings site-wide). It also adds more settings to the Drop Zones label text editor (see below \u00a74.2).<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h5 class=\"wp-block-heading\">Introduction<\/h5>\n\n\n\n<p>Here you will find the detail&nbsp;of the various differences between the H5P official distribution (currently version 1.14.23) of the Drag &amp; Drop content type and the &#8220;experimental&#8221; version I have developed on this site.<\/p>\n\n\n\n<h5 class=\"wp-block-heading\">1.- Bug fixes<\/h5>\n\n\n\n<p>1.1.-&nbsp;H5P Image: hover text not working&nbsp;<a href=\"https:\/\/h5ptechnology.atlassian.net\/browse\/HFP-1680\" target=\"_blank\" rel=\"noreferrer noopener\">HFP-1680<\/a>&nbsp;&amp;&nbsp;<a href=\"https:\/\/h5ptechnology.atlassian.net\/browse\/HFP-1865\" target=\"_blank\" rel=\"noreferrer noopener\">HFP-1865<\/a>. Fixed.<\/p>\n\n\n\n<p>1.2.-&nbsp;Drag N Drop &#8211; Draggable Left Justified is defaulted to Centred <a href=\"https:\/\/h5ptechnology.atlassian.net\/browse\/HFP-1884\" target=\"_blank\" rel=\"noreferrer noopener\">HFP-1884<\/a> Fixed.<\/p>\n\n\n\n<p>1.3.- In the editor the&nbsp;&#8220;Background opacity for draggables&#8221; setting field is wrongly of the text type; should be number. Fixed.<\/p>\n\n\n\n<h5 class=\"wp-block-heading\">2.- New features in General Settings<\/h5>\n\n\n\n<p>2.1.- <strong>Task Background colour.<\/strong> A colour picker is provided to choose a background colour for the task (If there is no background image).<\/p>\n\n\n\n<p>2.2.- A new <em>Description field<\/em> has been added, which is curiously missing from the default H5P Drag &amp; Drop content.<\/p>\n\n\n\n<h5 class=\"wp-block-heading\">3.- New features in Behavioural Settings<\/h5>\n\n\n\n<h6 class=\"wp-block-heading\">3.1.- Enable &#8220;Show solution&#8221; button<\/h6>\n\n\n\n<p>I found it rather difficult to implement, especially when including the &#8220;multiple draggables&#8221;. Currently it does work on this test site but probably needs refining. I have included a &#8220;Require user input before the solution can be viewed&#8221; option similar to the one in the H5P Drag the Words activity.<\/p>\n\n\n\n<h6 class=\"wp-block-heading\">3.2.- Jumble\/Shuffle\/Randomize draggables<\/h6>\n\n\n\n<p>See\u00a0<a href=\"https:\/\/h5p.org\/node\/42474\" target=\"_blank\" rel=\"noreferrer noopener\">https:\/\/h5p.org\/node\/42474<\/a>. I think that a randomize feature has its use here as in other H5P activities. I have enabled it in most of my examples on this test site.<\/p>\n\n\n\n<p>3.4.-&nbsp;Remove all &#8216;correct&#8217; and &#8216;wrong&#8217; styles on the draggables when all is correct.<\/p>\n\n\n\n<p>Removing all &#8216;correct&#8217; and &#8216;wrong&#8217; styles may be useful e.g. when displaying a completed jigsaw puzzle activity so that the final result is not cluttered with ticks, crosses or score points.<\/p>\n\n\n\n<h6 class=\"wp-block-heading\">3.5.- Keep correct answers<\/h6>\n\n\n\n<p><em>Check this option if you want to keep the draggable elements dropped in the correct drop zones after pressing &#8216;Retry&#8217;.<\/em> <\/p>\n\n\n\n<h6 class=\"wp-block-heading\">3.6.- Retry even if all is correct<\/h6>\n\n\n\n<p>I strongly believe that the option to retry should always be available to the student, even after a successful attempt. Currently I have not made this an option in the Settings. This has to be discussed.<\/p>\n\n\n\n<h6 class=\"wp-block-heading\">3.7.-&nbsp;Reset the position of a dropped draggable element.<\/h6>\n\n\n\n<p><em>Check this option if you want to reset the position of a dropped draggable element when dropping a new one onto the drop zone (only works in drop zones which can only contain a single element).<\/em><\/p>\n\n\n\n<p>In an activity where all drop zones are set to accept a single draggable, the end-user expects that dropping a draggable element onto an &#8220;occupied&#8221; drop zone will automatically revert the &#8220;occupant draggable&#8221; to its original position.&nbsp;Please note that if the &#8220;Keep correct answers&#8221; option is enabled, upon retrying, it&#8217;s not possible to drop a new draggable onto a zone which contains a correct answer (of course). Currently I have not been able to make this option work for the multi draggables. More exactly it is possible to drag a multiple draggable onto an occupied drop zone and push the occupant away to its original position, but <em>not the reverse<\/em>.<\/p>\n\n\n\n<h6 class=\"wp-block-heading\">3.8.-&nbsp;Background opacity for drop zones<\/h6>\n\n\n\n<p><em>If this field is set, it will override opacity set on all drop zones. This should be a number between 0 and 100, where 0 means full transparency and 100 means no transparency<\/em>. This is similar to the existing &#8220;Background opacity for draggables&#8221; option.<\/p>\n\n\n\n<h6 class=\"wp-block-heading\">3.9.-&nbsp;Drop Zones Background colour<\/h6>\n\n\n\n<h6 class=\"wp-block-heading\">3.10.-&nbsp;Border colour for drop zones<\/h6>\n\n\n\n<h6 class=\"wp-block-heading\">3.11.- Display correct\/wrong and scorepoints horizontally<\/h6>\n\n\n\n<p><em>Check this option to display the correct\/wrong ticks and the score points horizontally (inline) instead of the default vertical display<\/em>. This feature is useful in those activities where the vertical height of the drop zones is limited by lack of space, as in legends, etc. It&#8217;s used by the &#8220;Skeleton muscles of the human body&#8221; example.<\/p>\n\n\n\n<h6 class=\"wp-block-heading\">3.12.- Draggables &#8216;quantity&#8217; and &#8216;value&#8217;<\/h6>\n\n\n\n<p>It is now possible to set each drop zone to expect a determined number of draggable elements. When the &#8220;Enable draggables dropped Quantity in drop Zones AND draggables value&#8221; parameter is enabled in the Behavioural Settings, 3 new fields become available in the Task settings. Disable completed Drop Zones. Check this option if you want to make it impossible to drag draggables into or out of&nbsp;<em>correctly completed<\/em> Drop Zones. Use this option with caution, as in some (rare) cases it may cause the task to be impossible to complete!<\/p>\n\n\n\n<h5 class=\"wp-block-heading\">4.- New features in Task settings<\/h5>\n\n\n\n<p>4.1.- Added a tooltip title to drop zones to make editing easier for drop zones where label is not displayed.<\/p>\n\n\n\n<p>4.2.- When editing drop zones, if the Drop Zones Background colour and the Drop Zones Border colour has not been set in the global settings, it&#8217;s possible to set those parameters individually.<\/p>\n\n\n\n<p>The text editor for the Drop Zones has been extended to allow Font size, Text Colour, Background Colour, sub and superscript.<\/p>\n\n\n\n<p>In the Draggable settings, the &#8220;Select drop zones&#8221; list displays the drop zones labels <em>unformatted<\/em>.<\/p>\n\n\n\n<p>4.3.- If the &#8221; Enable draggables dropped Quantity in drop Zones AND draggables value&#8221; parameter has been enabled in the Behavioural Settings:-<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>in the Edit tab for the draggable elements a Value field is displayed<\/li>\n\n\n\n<li>in the Edit tab for the drop zones, 2 fields are available: Number of expected draggables and their Total Value<\/li>\n<\/ul>\n\n\n\n<p>How many elements MUST this drop zone contain?<br>Exact number of draggables expected in this drop zone<\/p>\n\n\n\n<p>Total draggables value<br>Enter the expected total value of the draggables dropped in this zone<\/p>\n\n\n\n<p>It is possible to set a negative value.<\/p>\n\n\n\n<p>When the &#8221;&nbsp;<strong>Enable draggables dropped Quantity&#8230;&#8221; <\/strong>option is enabled, the individual feedback for drop zones is now more customizable, with 2 new fields:<\/p>\n\n\n\n<p><strong>Message displayed on incorrect number<\/strong><br>Message will appear below the task on &#8220;check&#8221; if drop zone contains an incorrect number of items. You can use the variables @requirednumber and @selectednumber in your message, for example &#8220;Sorry, you selected @selectednumber items, that&#8217;s not correct. You should have selected @requirednumber&#8221;<\/p>\n\n\n\n<p><strong>Message displayed on incorrect total value<\/strong><br>Message will appear below the task on &#8220;check&#8221; if drop zone contains an incorrect total value. You can use the variables @requiredvalue and @totalvalue in your message, for example &#8220;Sorry, the items you selected make up a total value of @totalvalue; they should add up to @requiredvalue&#8221;. You can also use the variables @oppositerequiredvalue and @oppositetotalvalue is needed.<\/p>\n\n\n\n<p>You&#8217;ll have to experiment to find out which of the now 4 available feedback fields need to be used, depending on the content of your drop zones &amp; draggables and most importantly on the value of the Exact <em>number of draggables expected<\/em> and of <em>the expected total value<\/em> of the draggables dropped in each zone.<\/p>\n\n\n\n<p>4.4.- An <strong>Audio <\/strong>option is available for the Drop Zones. Unfortunately, this option does not work correctly on some tablets &amp; phones. Please experiment&#8230;<\/p>\n\n\n\n<p><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Library Drag and Drop Papi Jo CURRENT VERSION 1.13.30 &#8211; 2025 Version 1.13.30 fixed language\/fr.json and edited icon.svg\u00a0 Version 1.13.26&nbsp;fixes a small bug introduced in previous version 1.13.25. It also allows for shuffling of the so-called &#8216;multiple&#8217; draggables, only once at the start of activity. Version 1.13.25 updates the look of correctly placed draggable elements&hellip;<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"categories":[75,58],"tags":[],"class_list":["post-270","page","type-page","status-publish","hentry","category-drag-and-drop","category-papi-jo-libraries"],"_links":{"self":[{"href":"https:\/\/www.rezeau.org\/wp-h5p\/wp-json\/wp\/v2\/pages\/270","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.rezeau.org\/wp-h5p\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.rezeau.org\/wp-h5p\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.rezeau.org\/wp-h5p\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.rezeau.org\/wp-h5p\/wp-json\/wp\/v2\/comments?post=270"}],"version-history":[{"count":10,"href":"https:\/\/www.rezeau.org\/wp-h5p\/wp-json\/wp\/v2\/pages\/270\/revisions"}],"predecessor-version":[{"id":781,"href":"https:\/\/www.rezeau.org\/wp-h5p\/wp-json\/wp\/v2\/pages\/270\/revisions\/781"}],"wp:attachment":[{"href":"https:\/\/www.rezeau.org\/wp-h5p\/wp-json\/wp\/v2\/media?parent=270"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.rezeau.org\/wp-h5p\/wp-json\/wp\/v2\/categories?post=270"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.rezeau.org\/wp-h5p\/wp-json\/wp\/v2\/tags?post=270"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}