{"id":377,"date":"2025-10-12T12:05:56","date_gmt":"2025-10-12T12:05:56","guid":{"rendered":"https:\/\/h5project.cloud\/?p=377"},"modified":"2025-10-12T16:12:37","modified_gmt":"2025-10-12T16:12:37","slug":"tutorial-2-create-drag-and-drop","status":"publish","type":"post","link":"https:\/\/h5project.cloud\/staging\/tutorial-2-create-drag-and-drop\/","title":{"rendered":"Tutorial 2: Create Drag and Drop"},"content":{"rendered":"<p dir=\"rtl\">\u05db\u05de\u05d5\u05e8\u05d4 \u05dc\u05e9\u05e4\u05d4 &#8211; \u05d7\u05e9\u05d5\u05d1\u05d9\u05dd \u05dc\u05d9 \u05de\u05d0\u05d5\u05d3 \u05ea\u05e8\u05d2\u05d9\u05dc\u05d9\u05dd \u05d7\u05db\u05de\u05d9\u05dd \u05d1\u05d4\u05dd \u05d4\u05dc\u05d5\u05de\u05d3\u05d9\u05dd \u05e2\u05d5\u05d1\u05d3\u05d9\u05dd \u05e2\u05dd \u05d4\u05e9\u05e4\u05d4 \u05d2\u05dd \u05d1\u05dc\u05d9 \u05dc\u05db\u05ea\u05d5\u05d1 \u05de\u05d9\u05dc\u05d9\u05dd (\u05db\u05d9 \u05d0\u05d5\u05dc\u05d9 \u05e6\u05e8\u05d9\u05da \u05dc\u05e2\u05d1\u05d5\u05d3 \u05e2\u05dc \u05d4\u05e7\u05e8\u05d9\u05d0\u05d4 \u05e9\u05dc\u05d4\u05df \u05dc\u05e4\u05e0\u05d9). \u05d1\u05e4\u05d5\u05e1\u05d8 \u05d4\u05d6\u05d4 \u05d0\u05e0\u05d9 \u05d1\u05d5\u05e0\u05d4 \u05ea\u05e8\u05d2\u05d9\u05dc \u05dc\u05e8\u05de\u05ea \u05de\u05ea\u05d7\u05d9\u05dc\u05d9\u05dd \u05d1\u05d5 \u05d4\u05dd \u05e6\u05e8\u05d9\u05db\u05d9\u05dd \u05dc\u05de\u05d9\u05d9\u05df \u05de\u05d9\u05dc\u05d9\u05dd \u05e9\u05dc\u05de\u05d3\u05e0\u05d5 \u05de\u05d4\u05e9\u05d9\u05e2\u05d5\u05e8 \u05dc\u05e4\u05d9 \u05d4\u05de\u05e9\u05de\u05e2\u05d5\u05ea \u05e9\u05dc\u05d4\u05df, \u05d1\u05e2\u05d9\u05e7\u05e8 \u05db\u05d3\u05d9 \u05dc\u05d5\u05d5\u05d3\u05d0 \u05d4\u05e4\u05e0\u05de\u05d4 \u05e9\u05dc \u05de\u05e9\u05de\u05e2\u05d5\u05ea \u05d4\u05de\u05d9\u05dc\u05d9\u05dd (\u05d0\u05d5 \u05d1\u05e8\u05de\u05ea \u05de\u05ea\u05d7\u05d9\u05dc\u05d9\u05dd: \u05d4\u05d9\u05db\u05d5\u05dc\u05ea \u05dc\u05d6\u05d4\u05d5\u05ea \u05d0\u05ea \u05d4\u05de\u05d9\u05dc\u05d9\u05dd \u05d1\u05e7\u05e8\u05d9\u05d0\u05d4).<br \/><div class=\"h5p-iframe-wrapper\"><iframe id=\"h5p-iframe-25\" class=\"h5p-iframe\" data-content-id=\"25\" style=\"height:1px\" src=\"about:blank\" frameBorder=\"0\" scrolling=\"no\" title=\"\u05d0\u05d5\u05db\u05dc\u05d9\u05dd \u05d0\u05d5 \u05e9\u05d5\u05ea\u05d9\u05dd? \u05e7\u05e8 \u05d0\u05d5 \u05d7\u05dd?  \u05d9\"><\/iframe><\/div><\/p><p dir=\"rtl\">\u05d1\u05e1\u05e8\u05d8\u05d5\u05df \u05d4\u05d1\u05d0 \u05ea\u05d5\u05db\u05dc\u05d5 \u05dc\u05e8\u05d0\u05d5\u05ea \u05d0\u05d9\u05da \u05d9\u05e6\u05e8\u05ea\u05d9 \u05d0\u05ea \u05d4\u05e4\u05e2\u05d9\u05dc\u05d5\u05ea \u05e9\u05dc\u05d1 \u05d0\u05d7\u05e8\u05d9 \u05e9\u05dc\u05d1. \u05d4\u05e1\u05e8\u05d8\u05d5\u05df \u05d9\u05e6\u05d0 \u05d0\u05e8\u05d5\u05da \u05de\u05de\u05d4 \u05e9\u05e8\u05e6\u05d9\u05ea\u05d9, \u05d0\u05d1\u05dc \u05d0\u05e4\u05e9\u05e8 \u05dc\u05e8\u05d0\u05d5\u05ea \u05d1\u05d5 \u05d0\u05d9\u05da \u05d0\u05e0\u05d9 \u05e2\u05d5\u05e9\u05d4 \u05d0\u05ea \u05db\u05dc \u05d4\u05ea\u05d4\u05dc\u05d9\u05da (\u05db\u05d5\u05dc\u05dc \u05d1\u05e0\u05d9\u05d9\u05ea \u05e8\u05e7\u05e2, \u05d8\u05d9\u05e4\u05d9\u05dd \u05d5\u05e8\u05e2\u05d9\u05d5\u05e0\u05d5\u05ea \u05de\u05d5\u05e2\u05d9\u05dc\u05d9\u05dd) \u05d1\u05e4\u05d7\u05d5\u05ea \u05de-20 \u05d3\u05e7\u05d5\u05ea. \u05de\u05ea\u05d7\u05ea \u05dc\u05e1\u05e8\u05d8\u05d5\u05df \u05ea\u05d5\u05db\u05dc\u05d5 \u05dc\u05e8\u05d0\u05d5\u05ea \u05ea\u05e7\u05e6\u05d9\u05e8 \u05e2\u05dd \u05de\u05e8\u05d0\u05d9 <s>\u05de\u05e7\u05d5\u05dd<\/s>\u00a0\u05d6\u05de\u05df \u05dc\u05e8\u05d2\u05e2 \u05d4\u05de\u05d3\u05d5\u05d9\u05d9\u05e7 \u05d1\u05e1\u05e8\u05d8\u05d5\u05df.<\/p>\n<ol>\n<li style=\"list-style-type: none\">\n<ol><\/ol>\n<\/li>\n<\/ol>https:\/\/youtu.be\/Dc-_wLRrEok<p>\u00a00:00 <b>Login + create<\/b> Drag and Drop content<\/p>\n<p>1:15 after you name it &#8211; <b>start with creating the background<\/b> (without the terms)<\/p>\n<p>6:38 <b>define the drop zones<\/b> = where should items CAN be sorted to.<\/p>\n<p>8:50 <b>create the words (or images)<\/b> you want to be dragged into the drop zones. the V check-boxes represent the OPTIONAL DROP ZONES for this SPECIFIC TERM.<\/p>\n<p>14:30 <b>click on each drop zone<\/b>, and mark CORRECT TERMS FOR THIS DROPZONE.<\/p>\n<p>17:18 <b>publish<\/b> to view, make required corrections via UPDATE<\/p>\n<p dir=\"rtl\"><!-- \/wp:post-content --><!-- wp:paragraph {\"align\":\"right\"} \/--><!-- wp:list {\"ordered\":true} \/--><!-- wp:embed {\"url\":\"https:\/\/youtu.be\/Dc-_wLRrEok\",\"type\":\"video\",\"providerNameSlug\":\"youtube\",\"responsive\":true,\"className\":\"wp-embed-aspect-4-3 wp-has-aspect-ratio\"} \/--><!-- wp:paragraph --><\/p>","protected":false},"excerpt":{"rendered":"<p>\u05db\u05de\u05d5\u05e8\u05d4 \u05dc\u05e9\u05e4\u05d4 &#8211; \u05d7\u05e9\u05d5\u05d1\u05d9\u05dd \u05dc\u05d9 \u05de\u05d0\u05d5\u05d3 \u05ea\u05e8\u05d2\u05d9\u05dc\u05d9\u05dd \u05d7\u05db\u05de\u05d9\u05dd \u05d1\u05d4\u05dd \u05d4\u05dc\u05d5\u05de\u05d3\u05d9\u05dd \u05e2\u05d5\u05d1\u05d3\u05d9\u05dd \u05e2\u05dd \u05d4\u05e9\u05e4\u05d4 \u05d2\u05dd \u05d1\u05dc\u05d9 \u05dc\u05db\u05ea\u05d5\u05d1 \u05de\u05d9\u05dc\u05d9\u05dd (\u05db\u05d9 \u05d0\u05d5\u05dc\u05d9 \u05e6\u05e8\u05d9\u05da \u05dc\u05e2\u05d1\u05d5\u05d3 \u05e2\u05dc \u05d4\u05e7\u05e8\u05d9\u05d0\u05d4 \u05e9\u05dc\u05d4\u05df \u05dc\u05e4\u05e0\u05d9). \u05d1\u05e4\u05d5\u05e1\u05d8 \u05d4\u05d6\u05d4 \u05d0\u05e0\u05d9 \u05d1\u05d5\u05e0\u05d4 \u05ea\u05e8\u05d2\u05d9\u05dc \u05dc\u05e8\u05de\u05ea \u05de\u05ea\u05d7\u05d9\u05dc\u05d9\u05dd \u05d1\u05d5 \u05d4\u05dd \u05e6\u05e8\u05d9\u05db\u05d9\u05dd \u05dc\u05de\u05d9\u05d9\u05df \u05de\u05d9\u05dc\u05d9\u05dd \u05e9\u05dc\u05de\u05d3\u05e0\u05d5 \u05de\u05d4\u05e9\u05d9\u05e2\u05d5\u05e8 \u05dc\u05e4\u05d9 \u05d4\u05de\u05e9\u05de\u05e2\u05d5\u05ea \u05e9\u05dc\u05d4\u05df, \u05d1\u05e2\u05d9\u05e7\u05e8 \u05db\u05d3\u05d9 \u05dc\u05d5\u05d5\u05d3\u05d0 \u05d4\u05e4\u05e0\u05de\u05d4 \u05e9\u05dc \u05de\u05e9\u05de\u05e2\u05d5\u05ea \u05d4\u05de\u05d9\u05dc\u05d9\u05dd (\u05d0\u05d5 \u05d1\u05e8\u05de\u05ea \u05de\u05ea\u05d7\u05d9\u05dc\u05d9\u05dd: \u05d4\u05d9\u05db\u05d5\u05dc\u05ea \u05dc\u05d6\u05d4\u05d5\u05ea \u05d0\u05ea [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_bbp_topic_count":0,"_bbp_reply_count":0,"_bbp_total_topic_count":0,"_bbp_total_reply_count":0,"_bbp_voice_count":0,"_bbp_anonymous_reply_count":0,"_bbp_topic_count_hidden":0,"_bbp_reply_count_hidden":0,"_bbp_forum_subforum_count":0,"_uag_custom_page_level_css":"","site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"narrow-width-container","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":"","_members_access_role":[],"_members_access_error":""},"categories":[11,10],"tags":[12],"class_list":["post-377","post","type-post","status-publish","format-standard","hentry","category-inspiration-","category-tutorials-","tag-drag-and-drop"],"uagb_featured_image_src":{"full":false,"thumbnail":false,"medium":false,"medium_large":false,"large":false,"1536x1536":false,"2048x2048":false},"uagb_author_info":{"display_name":"Alex the Greater","author_link":"https:\/\/h5project.cloud\/staging\/author\/noam-authour\/"},"uagb_comment_info":0,"uagb_excerpt":"\u05db\u05de\u05d5\u05e8\u05d4 \u05dc\u05e9\u05e4\u05d4 &#8211; \u05d7\u05e9\u05d5\u05d1\u05d9\u05dd \u05dc\u05d9 \u05de\u05d0\u05d5\u05d3 \u05ea\u05e8\u05d2\u05d9\u05dc\u05d9\u05dd \u05d7\u05db\u05de\u05d9\u05dd \u05d1\u05d4\u05dd \u05d4\u05dc\u05d5\u05de\u05d3\u05d9\u05dd \u05e2\u05d5\u05d1\u05d3\u05d9\u05dd \u05e2\u05dd \u05d4\u05e9\u05e4\u05d4 \u05d2\u05dd \u05d1\u05dc\u05d9 \u05dc\u05db\u05ea\u05d5\u05d1 \u05de\u05d9\u05dc\u05d9\u05dd (\u05db\u05d9 \u05d0\u05d5\u05dc\u05d9 \u05e6\u05e8\u05d9\u05da \u05dc\u05e2\u05d1\u05d5\u05d3 \u05e2\u05dc \u05d4\u05e7\u05e8\u05d9\u05d0\u05d4 \u05e9\u05dc\u05d4\u05df \u05dc\u05e4\u05e0\u05d9). \u05d1\u05e4\u05d5\u05e1\u05d8 \u05d4\u05d6\u05d4 \u05d0\u05e0\u05d9 \u05d1\u05d5\u05e0\u05d4 \u05ea\u05e8\u05d2\u05d9\u05dc \u05dc\u05e8\u05de\u05ea \u05de\u05ea\u05d7\u05d9\u05dc\u05d9\u05dd \u05d1\u05d5 \u05d4\u05dd \u05e6\u05e8\u05d9\u05db\u05d9\u05dd \u05dc\u05de\u05d9\u05d9\u05df \u05de\u05d9\u05dc\u05d9\u05dd \u05e9\u05dc\u05de\u05d3\u05e0\u05d5 \u05de\u05d4\u05e9\u05d9\u05e2\u05d5\u05e8 \u05dc\u05e4\u05d9 \u05d4\u05de\u05e9\u05de\u05e2\u05d5\u05ea \u05e9\u05dc\u05d4\u05df, \u05d1\u05e2\u05d9\u05e7\u05e8 \u05db\u05d3\u05d9 \u05dc\u05d5\u05d5\u05d3\u05d0 \u05d4\u05e4\u05e0\u05de\u05d4 \u05e9\u05dc \u05de\u05e9\u05de\u05e2\u05d5\u05ea \u05d4\u05de\u05d9\u05dc\u05d9\u05dd (\u05d0\u05d5 \u05d1\u05e8\u05de\u05ea \u05de\u05ea\u05d7\u05d9\u05dc\u05d9\u05dd: \u05d4\u05d9\u05db\u05d5\u05dc\u05ea \u05dc\u05d6\u05d4\u05d5\u05ea \u05d0\u05ea&hellip;","_links":{"self":[{"href":"https:\/\/h5project.cloud\/staging\/wp-json\/wp\/v2\/posts\/377","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/h5project.cloud\/staging\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/h5project.cloud\/staging\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/h5project.cloud\/staging\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/h5project.cloud\/staging\/wp-json\/wp\/v2\/comments?post=377"}],"version-history":[{"count":30,"href":"https:\/\/h5project.cloud\/staging\/wp-json\/wp\/v2\/posts\/377\/revisions"}],"predecessor-version":[{"id":411,"href":"https:\/\/h5project.cloud\/staging\/wp-json\/wp\/v2\/posts\/377\/revisions\/411"}],"wp:attachment":[{"href":"https:\/\/h5project.cloud\/staging\/wp-json\/wp\/v2\/media?parent=377"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/h5project.cloud\/staging\/wp-json\/wp\/v2\/categories?post=377"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/h5project.cloud\/staging\/wp-json\/wp\/v2\/tags?post=377"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}