Kanban-Board mit F\u00e4lligkeiten & Unteraufgaben-Drag&Drop<\/title>\n <style>\n body {\n font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, sans-serif;\n background: #f5f5f7;\n margin: 0;\n padding: 20px;\n }\n h1 {\n text-align: center;\n color: #1c1c1e;\n }\n .board {\n display: flex;\n justify-content: space-around;\n gap: 20px;\n margin-top: 20px;\n }\n .column {\n flex: 1;\n background: white;\n padding: 15px;\n border-radius: 16px;\n box-shadow: 0 4px 12px rgba(0,0,0,0.1);\n min-height: 400px;\n }\n .column h2 {\n text-align: center;\n margin-top: 0;\n }\n .column[data-status=\"geplant\"] h2 { color: red; }\n .column[data-status=\"inBearbeitung\"] h2 { color: yellow; }\n .column[data-status=\"erledigt\"] h2 { color: green; }\n\n .task {\n background: #f0f0f3;\n margin-bottom: 10px;\n padding: 10px;\n border-radius: 10px;\n cursor: grab;\n }\n .task:active { cursor: grabbing; }\n\n .task-header {\n display: flex;\n align-items: center;\n gap: 8px;\n }\n .task-header input[type=\"checkbox\"] {\n transform: scale(1.2);\n cursor: pointer;\n }\n .task-title {\n flex: 1;\n font-weight: 600;\n outline: none;\n cursor: text;\n }\n .task-header .delete-btn {\n background: none;\n border: none;\n color: #ff3b30;\n font-size: 18px;\n cursor: pointer;\n padding: 0 4px;\n }\n\n .task-dates {\n margin-top: 8px;\n font-size: 14px;\n display: flex;\n flex-direction: column;\n gap: 4px;\n }\n .task-dates label {\n display: flex;\n align-items: center;\n gap: 6px;\n }\n\n .subtasks {\n margin-top: 8px;\n padding-left: 28px;\n }\n .subtasks.highlight {\n background: #d0ebff;\n }\n .subtask {\n display: flex;\n align-items: center;\n gap: 6px;\n font-size: 14px;\n background: #fff;\n padding: 4px 6px;\n margin: 4px 0;\n border-radius: 6px;\n cursor: grab;\n }\n .subtask:active { cursor: grabbing; }\n .subtask input[type=\"checkbox\"] {\n transform: scale(1.1);\n cursor: pointer;\n }\n .subtask-title {\n flex: 1;\n outline: none;\n cursor: text;\n }\n .subtask .delete-btn {\n background: none;\n border: none;\n color: #ff3b30;\n font-size: 16px;\n cursor: pointer;\n padding: 0 4px;\n }\n\n .add-subtask {\n color: #007aff;\n font-size: 14px;\n margin-top: 4px;\n cursor: pointer;\n padding-left: 28px;\n }\n .add-task {\n display: block;\n text-align: center;\n margin-top: 10px;\n padding: 8px;\n background: #007aff;\n color: white;\n border-radius: 8px;\n cursor: pointer;\n }\n .highlight {\n background: #d0ebff;\n transition: background 0.3s;\n }\n <\/style>\n<\/head>\n<body>\n <h1>Mein Kanban-Board<\/h1>\n <div class=\"board\">\n <div class=\"column\" data-status=\"geplant\">\n <h2>Geplant<\/h2>\n <div class=\"task-container\"><\/div>\n <div class=\"add-task\" onclick=\"addTask(this)\">+ Aufgabe hinzuf\u00fcgen<\/div>\n <\/div>\n <div class=\"column\" data-status=\"inBearbeitung\">\n <h2>In Bearbeitung<\/h2>\n <div class=\"task-container\"><\/div>\n <div class=\"add-task\" onclick=\"addTask(this)\">+ Aufgabe hinzuf\u00fcgen<\/div>\n <\/div>\n <div class=\"column\" data-status=\"erledigt\">\n <h2>Erledigt<\/h2>\n <div class=\"task-container\"><\/div>\n <div class=\"add-task\" onclick=\"addTask(this)\">+ Aufgabe hinzuf\u00fcgen<\/div>\n <\/div>\n <\/div>\n\n <script>\n let draggedTask = null;\n let draggedSub = null;\n\n \/\/ --- SPEICHERN & LADEN ---\n function saveBoard() {\n const boardData = Array.from(document.querySelectorAll(\".column\")).map(col => {\n return {\n status: col.dataset.status,\n tasks: Array.from(col.querySelectorAll(\".task\")).map(task => ({\n title: task.querySelector(\".task-title\").innerText,\n done: task.querySelector('input[type=\"checkbox\"]').checked,\n dueDate: task.querySelector('input[type=\"date\"]').value,\n reminder: task.querySelector('input[type=\"datetime-local\"]').value,\n subtasks: Array.from(task.querySelectorAll(\".subtask\")).map(sub => ({\n title: sub.querySelector(\".subtask-title\").innerText,\n done: sub.querySelector('input[type=\"checkbox\"]').checked\n }))\n }))\n };\n });\n localStorage.setItem(\"kanbanBoard\", JSON.stringify(boardData));\n }\n\n function loadBoard() {\n const data = localStorage.getItem(\"kanbanBoard\");\n if (!data) return false;\n const boardData = JSON.parse(data);\n boardData.forEach(colData => {\n const container = document.querySelector(`.column[data-status=\"${colData.status}\"] .task-container`);\n container.innerHTML = \"\";\n colData.tasks.forEach(t => {\n const task = createTask(t.title, t.done, t.dueDate, t.reminder);\n const sc = task.querySelector(\".subtasks\");\n t.subtasks.forEach(st => sc.appendChild(createSubtask(st.title, st.done)));\n container.appendChild(task);\n });\n });\n return true;\n }\n\n \/\/ --- AUFGABEN & UNTERAUFGABEN ERZEUGEN ---\n function createSubtask(title = \"Neue Unteraufgabe\", done = false) {\n const sub = document.createElement(\"div\");\n sub.className = \"subtask\";\n sub.draggable = true;\n\n \/\/ Drag-Events\n sub.addEventListener(\"dragstart\", () => {\n draggedSub = sub;\n setTimeout(() => sub.style.display = \"none\", 0);\n });\n sub.addEventListener(\"dragend\", () => {\n sub.style.display = \"flex\";\n draggedSub = null;\n saveBoard();\n });\n\n const cb = document.createElement(\"input\");\n cb.type = \"checkbox\";\n cb.checked = done;\n cb.addEventListener(\"change\", saveBoard);\n\n const span = document.createElement(\"div\");\n span.className = \"subtask-title\";\n span.contentEditable = true;\n span.innerText = title;\n span.addEventListener(\"input\", saveBoard);\n\n const del = document.createElement(\"button\");\n del.className = \"delete-btn\";\n del.innerText = \"\u00d7\";\n del.addEventListener(\"click\", () => {\n sub.remove();\n saveBoard();\n });\n\n sub.append(cb, span, del);\n return sub;\n }\n\n function createTask(title = \"Neue Aufgabe\", done = false, due = \"\", rem = \"\") {\n const task = document.createElement(\"div\");\n task.className = \"task\";\n task.draggable = true;\n\n \/\/ Drag-Events\n task.addEventListener(\"dragstart\", () => {\n draggedTask = task;\n setTimeout(() => task.style.display = \"none\", 0);\n });\n task.addEventListener(\"dragend\", () => {\n task.style.display = \"block\";\n draggedTask = null;\n saveBoard();\n });\n\n \/\/ Header: Checkbox, Titel, Delete\n const header = document.createElement(\"div\");\n header.className = \"task-header\";\n\n const cb = document.createElement(\"input\");\n cb.type = \"checkbox\";\n cb.checked = done;\n cb.addEventListener(\"change\", saveBoard);\n\n const titleDiv = document.createElement(\"div\");\n titleDiv.className = \"task-title\";\n titleDiv.contentEditable = true;\n titleDiv.innerText = title;\n titleDiv.addEventListener(\"input\", saveBoard);\n\n const del = document.createElement(\"button\");\n del.className = \"delete-btn\";\n del.innerText = \"\u00d7\";\n del.addEventListener(\"click\", () => {\n task.remove();\n saveBoard();\n });\n\n header.append(cb, titleDiv, del);\n task.appendChild(header);\n\n \/\/ F\u00e4lligkeits- & Erinnerungsdaten\n const dates = document.createElement(\"div\");\n dates.className = \"task-dates\";\n const lblDue = document.createElement(\"label\");\n lblDue.innerText = \"F\u00e4llig:\";\n const inDue = document.createElement(\"input\");\n inDue.type = \"date\";\n inDue.value = due;\n inDue.addEventListener(\"change\", saveBoard);\n lblDue.appendChild(inDue);\n\n const lblRem = document.createElement(\"label\");\n lblRem.innerText = \"Erinnerung:\";\n const inRem = document.createElement(\"input\");\n inRem.type = \"datetime-local\";\n inRem.value = rem;\n inRem.addEventListener(\"change\", saveBoard);\n lblRem.appendChild(inRem);\n\n dates.append(lblDue, lblRem);\n task.appendChild(dates);\n\n \/\/ Unteraufgaben-Container & Button\n const subtasksContainer = document.createElement(\"div\");\n subtasksContainer.className = \"subtasks\";\n\n \/\/ Drag&Drop f\u00fcr Unteraufgaben\n subtasksContainer.addEventListener(\"dragover\", e => {\n e.preventDefault();\n subtasksContainer.classList.add(\"highlight\");\n });\n subtasksContainer.addEventListener(\"dragleave\", () => {\n subtasksContainer.classList.remove(\"highlight\");\n });\n subtasksContainer.addEventListener(\"drop\", () => {\n subtasksContainer.classList.remove(\"highlight\");\n if (draggedSub) subtasksContainer.appendChild(draggedSub);\n });\n\n const addSub = document.createElement(\"div\");\n addSub.className = \"add-subtask\";\n addSub.innerText = \"+ Unteraufgabe hinzuf\u00fcgen\";\n addSub.addEventListener(\"click\", () => {\n const s = createSubtask();\n subtasksContainer.appendChild(s);\n saveBoard();\n });\n\n task.append(subtasksContainer, addSub);\n return task;\n }\n\n function addTask(btn) {\n const cont = btn.previousElementSibling;\n cont.appendChild(createTask());\n saveBoard();\n }\n\n \/\/ --- DRAG&DROP F\u00dcR AUFGABEN ---\n document.querySelectorAll(\".column\").forEach(col => {\n col.addEventListener(\"dragover\", e => {\n e.preventDefault();\n col.classList.add(\"highlight\");\n });\n col.addEventListener(\"dragleave\", () => col.classList.remove(\"highlight\"));\n col.addEventListener(\"drop\", () => {\n col.classList.remove(\"highlight\");\n if (draggedTask) {\n col.querySelector(\".task-container\").appendChild(draggedTask);\n }\n });\n });\n\n \/\/ --- INITIALISIERUNG ---\n if (!loadBoard()) {\n document.querySelector('[data-status=\"geplant\"] .task-container')\n .appendChild(createTask(\"Website planen\"));\n document.querySelector('[data-status=\"inBearbeitung\"] .task-container')\n .appendChild(createTask(\"Design erstellen\"));\n document.querySelector('[data-status=\"erledigt\"] .task-container')\n .appendChild(createTask(\"Ideen sammeln\"));\n saveBoard();\n }\n <\/script>\n<\/body>\n<\/html>\n\n\n\n\n<p><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Kanban-Board mit F\u00e4lligkeiten & Unteraufgaben-Drag&Drop Mein Kanban-Board Geplant + Aufgabe hinzuf\u00fcgen In Bearbeitung + Aufgabe hinzuf\u00fcgen Erledigt + Aufgabe hinzuf\u00fcgen<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-32","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/rettungstormarn.wenk-hh.de\/index.php\/wp-json\/wp\/v2\/pages\/32","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/rettungstormarn.wenk-hh.de\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/rettungstormarn.wenk-hh.de\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/rettungstormarn.wenk-hh.de\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/rettungstormarn.wenk-hh.de\/index.php\/wp-json\/wp\/v2\/comments?post=32"}],"version-history":[{"count":2,"href":"https:\/\/rettungstormarn.wenk-hh.de\/index.php\/wp-json\/wp\/v2\/pages\/32\/revisions"}],"predecessor-version":[{"id":37,"href":"https:\/\/rettungstormarn.wenk-hh.de\/index.php\/wp-json\/wp\/v2\/pages\/32\/revisions\/37"}],"wp:attachment":[{"href":"https:\/\/rettungstormarn.wenk-hh.de\/index.php\/wp-json\/wp\/v2\/media?parent=32"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":32,"date":"2025-07-27T19:43:37","date_gmt":"2025-07-27T19:43:37","guid":{"rendered":"https:\/\/rettungstormarn.wenk-hh.de\/?page_id=32"},"modified":"2025-07-27T19:46:49","modified_gmt":"2025-07-27T19:46:49","slug":"kanban-board","status":"publish","type":"page","link":"https:\/\/rettungstormarn.wenk-hh.de\/index.php\/kanban-board\/","title":{"rendered":""},"content":{"rendered":"\n\n\n\n \n Kanban-Board mit F\u00e4lligkeiten & Unteraufgaben-Drag&Drop<\/title>\n <style>\n body {\n font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, sans-serif;\n background: #f5f5f7;\n margin: 0;\n padding: 20px;\n }\n h1 {\n text-align: center;\n color: #1c1c1e;\n }\n .board {\n display: flex;\n justify-content: space-around;\n gap: 20px;\n margin-top: 20px;\n }\n .column {\n flex: 1;\n background: white;\n padding: 15px;\n border-radius: 16px;\n box-shadow: 0 4px 12px rgba(0,0,0,0.1);\n min-height: 400px;\n }\n .column h2 {\n text-align: center;\n margin-top: 0;\n }\n .column[data-status=\"geplant\"] h2 { color: red; }\n .column[data-status=\"inBearbeitung\"] h2 { color: yellow; }\n .column[data-status=\"erledigt\"] h2 { color: green; }\n\n .task {\n background: #f0f0f3;\n margin-bottom: 10px;\n padding: 10px;\n border-radius: 10px;\n cursor: grab;\n }\n .task:active { cursor: grabbing; }\n\n .task-header {\n display: flex;\n align-items: center;\n gap: 8px;\n }\n .task-header input[type=\"checkbox\"] {\n transform: scale(1.2);\n cursor: pointer;\n }\n .task-title {\n flex: 1;\n font-weight: 600;\n outline: none;\n cursor: text;\n }\n .task-header .delete-btn {\n background: none;\n border: none;\n color: #ff3b30;\n font-size: 18px;\n cursor: pointer;\n padding: 0 4px;\n }\n\n .task-dates {\n margin-top: 8px;\n font-size: 14px;\n display: flex;\n flex-direction: column;\n gap: 4px;\n }\n .task-dates label {\n display: flex;\n align-items: center;\n gap: 6px;\n }\n\n .subtasks {\n margin-top: 8px;\n padding-left: 28px;\n }\n .subtasks.highlight {\n background: #d0ebff;\n }\n .subtask {\n display: flex;\n align-items: center;\n gap: 6px;\n font-size: 14px;\n background: #fff;\n padding: 4px 6px;\n margin: 4px 0;\n border-radius: 6px;\n cursor: grab;\n }\n .subtask:active { cursor: grabbing; }\n .subtask input[type=\"checkbox\"] {\n transform: scale(1.1);\n cursor: pointer;\n }\n .subtask-title {\n flex: 1;\n outline: none;\n cursor: text;\n }\n .subtask .delete-btn {\n background: none;\n border: none;\n color: #ff3b30;\n font-size: 16px;\n cursor: pointer;\n padding: 0 4px;\n }\n\n .add-subtask {\n color: #007aff;\n font-size: 14px;\n margin-top: 4px;\n cursor: pointer;\n padding-left: 28px;\n }\n .add-task {\n display: block;\n text-align: center;\n margin-top: 10px;\n padding: 8px;\n background: #007aff;\n color: white;\n border-radius: 8px;\n cursor: pointer;\n }\n .highlight {\n background: #d0ebff;\n transition: background 0.3s;\n }\n <\/style>\n<\/head>\n<body>\n <h1>Mein Kanban-Board<\/h1>\n <div class=\"board\">\n <div class=\"column\" data-status=\"geplant\">\n <h2>Geplant<\/h2>\n <div class=\"task-container\"><\/div>\n <div class=\"add-task\" onclick=\"addTask(this)\">+ Aufgabe hinzuf\u00fcgen<\/div>\n <\/div>\n <div class=\"column\" data-status=\"inBearbeitung\">\n <h2>In Bearbeitung<\/h2>\n <div class=\"task-container\"><\/div>\n <div class=\"add-task\" onclick=\"addTask(this)\">+ Aufgabe hinzuf\u00fcgen<\/div>\n <\/div>\n <div class=\"column\" data-status=\"erledigt\">\n <h2>Erledigt<\/h2>\n <div class=\"task-container\"><\/div>\n <div class=\"add-task\" onclick=\"addTask(this)\">+ Aufgabe hinzuf\u00fcgen<\/div>\n <\/div>\n <\/div>\n\n <script>\n let draggedTask = null;\n let draggedSub = null;\n\n \/\/ --- SPEICHERN & LADEN ---\n function saveBoard() {\n const boardData = Array.from(document.querySelectorAll(\".column\")).map(col => {\n return {\n status: col.dataset.status,\n tasks: Array.from(col.querySelectorAll(\".task\")).map(task => ({\n title: task.querySelector(\".task-title\").innerText,\n done: task.querySelector('input[type=\"checkbox\"]').checked,\n dueDate: task.querySelector('input[type=\"date\"]').value,\n reminder: task.querySelector('input[type=\"datetime-local\"]').value,\n subtasks: Array.from(task.querySelectorAll(\".subtask\")).map(sub => ({\n title: sub.querySelector(\".subtask-title\").innerText,\n done: sub.querySelector('input[type=\"checkbox\"]').checked\n }))\n }))\n };\n });\n localStorage.setItem(\"kanbanBoard\", JSON.stringify(boardData));\n }\n\n function loadBoard() {\n const data = localStorage.getItem(\"kanbanBoard\");\n if (!data) return false;\n const boardData = JSON.parse(data);\n boardData.forEach(colData => {\n const container = document.querySelector(`.column[data-status=\"${colData.status}\"] .task-container`);\n container.innerHTML = \"\";\n colData.tasks.forEach(t => {\n const task = createTask(t.title, t.done, t.dueDate, t.reminder);\n const sc = task.querySelector(\".subtasks\");\n t.subtasks.forEach(st => sc.appendChild(createSubtask(st.title, st.done)));\n container.appendChild(task);\n });\n });\n return true;\n }\n\n \/\/ --- AUFGABEN & UNTERAUFGABEN ERZEUGEN ---\n function createSubtask(title = \"Neue Unteraufgabe\", done = false) {\n const sub = document.createElement(\"div\");\n sub.className = \"subtask\";\n sub.draggable = true;\n\n \/\/ Drag-Events\n sub.addEventListener(\"dragstart\", () => {\n draggedSub = sub;\n setTimeout(() => sub.style.display = \"none\", 0);\n });\n sub.addEventListener(\"dragend\", () => {\n sub.style.display = \"flex\";\n draggedSub = null;\n saveBoard();\n });\n\n const cb = document.createElement(\"input\");\n cb.type = \"checkbox\";\n cb.checked = done;\n cb.addEventListener(\"change\", saveBoard);\n\n const span = document.createElement(\"div\");\n span.className = \"subtask-title\";\n span.contentEditable = true;\n span.innerText = title;\n span.addEventListener(\"input\", saveBoard);\n\n const del = document.createElement(\"button\");\n del.className = \"delete-btn\";\n del.innerText = \"\u00d7\";\n del.addEventListener(\"click\", () => {\n sub.remove();\n saveBoard();\n });\n\n sub.append(cb, span, del);\n return sub;\n }\n\n function createTask(title = \"Neue Aufgabe\", done = false, due = \"\", rem = \"\") {\n const task = document.createElement(\"div\");\n task.className = \"task\";\n task.draggable = true;\n\n \/\/ Drag-Events\n task.addEventListener(\"dragstart\", () => {\n draggedTask = task;\n setTimeout(() => task.style.display = \"none\", 0);\n });\n task.addEventListener(\"dragend\", () => {\n task.style.display = \"block\";\n draggedTask = null;\n saveBoard();\n });\n\n \/\/ Header: Checkbox, Titel, Delete\n const header = document.createElement(\"div\");\n header.className = \"task-header\";\n\n const cb = document.createElement(\"input\");\n cb.type = \"checkbox\";\n cb.checked = done;\n cb.addEventListener(\"change\", saveBoard);\n\n const titleDiv = document.createElement(\"div\");\n titleDiv.className = \"task-title\";\n titleDiv.contentEditable = true;\n titleDiv.innerText = title;\n titleDiv.addEventListener(\"input\", saveBoard);\n\n const del = document.createElement(\"button\");\n del.className = \"delete-btn\";\n del.innerText = \"\u00d7\";\n del.addEventListener(\"click\", () => {\n task.remove();\n saveBoard();\n });\n\n header.append(cb, titleDiv, del);\n task.appendChild(header);\n\n \/\/ F\u00e4lligkeits- & Erinnerungsdaten\n const dates = document.createElement(\"div\");\n dates.className = \"task-dates\";\n const lblDue = document.createElement(\"label\");\n lblDue.innerText = \"F\u00e4llig:\";\n const inDue = document.createElement(\"input\");\n inDue.type = \"date\";\n inDue.value = due;\n inDue.addEventListener(\"change\", saveBoard);\n lblDue.appendChild(inDue);\n\n const lblRem = document.createElement(\"label\");\n lblRem.innerText = \"Erinnerung:\";\n const inRem = document.createElement(\"input\");\n inRem.type = \"datetime-local\";\n inRem.value = rem;\n inRem.addEventListener(\"change\", saveBoard);\n lblRem.appendChild(inRem);\n\n dates.append(lblDue, lblRem);\n task.appendChild(dates);\n\n \/\/ Unteraufgaben-Container & Button\n const subtasksContainer = document.createElement(\"div\");\n subtasksContainer.className = \"subtasks\";\n\n \/\/ Drag&Drop f\u00fcr Unteraufgaben\n subtasksContainer.addEventListener(\"dragover\", e => {\n e.preventDefault();\n subtasksContainer.classList.add(\"highlight\");\n });\n subtasksContainer.addEventListener(\"dragleave\", () => {\n subtasksContainer.classList.remove(\"highlight\");\n });\n subtasksContainer.addEventListener(\"drop\", () => {\n subtasksContainer.classList.remove(\"highlight\");\n if (draggedSub) subtasksContainer.appendChild(draggedSub);\n });\n\n const addSub = document.createElement(\"div\");\n addSub.className = \"add-subtask\";\n addSub.innerText = \"+ Unteraufgabe hinzuf\u00fcgen\";\n addSub.addEventListener(\"click\", () => {\n const s = createSubtask();\n subtasksContainer.appendChild(s);\n saveBoard();\n });\n\n task.append(subtasksContainer, addSub);\n return task;\n }\n\n function addTask(btn) {\n const cont = btn.previousElementSibling;\n cont.appendChild(createTask());\n saveBoard();\n }\n\n \/\/ --- DRAG&DROP F\u00dcR AUFGABEN ---\n document.querySelectorAll(\".column\").forEach(col => {\n col.addEventListener(\"dragover\", e => {\n e.preventDefault();\n col.classList.add(\"highlight\");\n });\n col.addEventListener(\"dragleave\", () => col.classList.remove(\"highlight\"));\n col.addEventListener(\"drop\", () => {\n col.classList.remove(\"highlight\");\n if (draggedTask) {\n col.querySelector(\".task-container\").appendChild(draggedTask);\n }\n });\n });\n\n \/\/ --- INITIALISIERUNG ---\n if (!loadBoard()) {\n document.querySelector('[data-status=\"geplant\"] .task-container')\n .appendChild(createTask(\"Website planen\"));\n document.querySelector('[data-status=\"inBearbeitung\"] .task-container')\n .appendChild(createTask(\"Design erstellen\"));\n document.querySelector('[data-status=\"erledigt\"] .task-container')\n .appendChild(createTask(\"Ideen sammeln\"));\n saveBoard();\n }\n <\/script>\n<\/body>\n<\/html>\n\n\n\n\n<p><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Kanban-Board mit F\u00e4lligkeiten & Unteraufgaben-Drag&Drop Mein Kanban-Board Geplant + Aufgabe hinzuf\u00fcgen In Bearbeitung + Aufgabe hinzuf\u00fcgen Erledigt + Aufgabe hinzuf\u00fcgen<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-32","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/rettungstormarn.wenk-hh.de\/index.php\/wp-json\/wp\/v2\/pages\/32","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/rettungstormarn.wenk-hh.de\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/rettungstormarn.wenk-hh.de\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/rettungstormarn.wenk-hh.de\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/rettungstormarn.wenk-hh.de\/index.php\/wp-json\/wp\/v2\/comments?post=32"}],"version-history":[{"count":2,"href":"https:\/\/rettungstormarn.wenk-hh.de\/index.php\/wp-json\/wp\/v2\/pages\/32\/revisions"}],"predecessor-version":[{"id":37,"href":"https:\/\/rettungstormarn.wenk-hh.de\/index.php\/wp-json\/wp\/v2\/pages\/32\/revisions\/37"}],"wp:attachment":[{"href":"https:\/\/rettungstormarn.wenk-hh.de\/index.php\/wp-json\/wp\/v2\/media?parent=32"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}