{"id":686,"date":"2026-02-08T05:45:43","date_gmt":"2026-02-08T05:45:43","guid":{"rendered":"https:\/\/withifi.muhubonurture.nl\/?page_id=686"},"modified":"2026-06-20T03:40:54","modified_gmt":"2026-06-20T03:40:54","slug":"oefenen-met-lettergrepen","status":"publish","type":"page","link":"https:\/\/withifi.muhubonurture.nl\/?page_id=686","title":{"rendered":"Oefenen met Lettergrepen"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"686\" class=\"elementor elementor-686\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-690ea77 e-con-full e-flex e-con e-parent\" data-id=\"690ea77\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-ed37818 elementor-widget elementor-widget-html\" data-id=\"ed37818\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- COPY-PASTE VOOR ELEMENTOR -->\r\n\r\n<style>\r\nbody{\r\n  margin:0;\r\n  font-family:'Inter',sans-serif;\r\n}\r\n\r\n.lettergreep-oefen-page{\r\n  min-height:100vh;\r\n  padding:7rem 7vw 4rem;\r\n  color:#3A2B24;\r\n\r\n  background:\r\n    radial-gradient(circle at 18% 20%, rgba(255,255,255,0.78) 0%, transparent 30%),\r\n    radial-gradient(circle at 82% 28%, rgba(255,225,234,0.38) 0%, transparent 32%),\r\n    radial-gradient(circle at 50% 82%, rgba(255,244,228,0.42) 0%, transparent 36%),\r\n    linear-gradient(135deg,#FFF7F8 0%,#EEF7F3 45%,#FFF8ED 100%);\r\n}\r\n\r\n.lettergreep-hero{\r\n  max-width:980px;\r\n  margin:0 auto 3.5rem;\r\n  padding:3.4rem;\r\n  border-radius:42px;\r\n  background:rgba(255,255,255,0.62);\r\n  border:1px solid rgba(255,255,255,0.96);\r\n  box-shadow:0 16px 42px rgba(90,70,55,0.08);\r\n  backdrop-filter:blur(16px);\r\n  -webkit-backdrop-filter:blur(16px);\r\n  text-align:center;\r\n}\r\n\r\n.lettergreep-label{\r\n  display:inline-block;\r\n  margin-bottom:22px;\r\n  padding:11px 20px;\r\n  border-radius:999px;\r\n  background:rgba(255,255,255,0.72);\r\n  border:1px solid rgba(255,255,255,0.95);\r\n  color:#8B6B55;\r\n  font-size:15px;\r\n  font-weight:900;\r\n}\r\n\r\n.lettergreep-hero h1{\r\n  font-size:clamp(44px,6vw,74px);\r\n  line-height:1;\r\n  margin:0 0 24px;\r\n  color:#3A2B24;\r\n  font-weight:900;\r\n}\r\n\r\n.lettergreep-hero p{\r\n  font-size:19px;\r\n  line-height:1.9;\r\n  color:#7A6455;\r\n  font-weight:650;\r\n  max-width:760px;\r\n  margin:0 auto;\r\n}\r\n\r\n.route-blok{\r\n  max-width:1120px;\r\n  margin:0 auto 4rem;\r\n}\r\n\r\n.route-kop{\r\n  margin-bottom:1.7rem;\r\n}\r\n\r\n.route-title{\r\n  font-size:clamp(32px,4vw,48px);\r\n  color:#3A2B24;\r\n  font-weight:900;\r\n  margin:0 0 .7rem;\r\n}\r\n\r\n.route-text{\r\n  font-size:18px;\r\n  line-height:1.8;\r\n  color:#7A6455;\r\n  font-weight:650;\r\n  max-width:820px;\r\n  margin:0;\r\n}\r\n\r\n.route-grid{\r\n  display:grid;\r\n  grid-template-columns:repeat(3,1fr);\r\n  gap:1.4rem;\r\n}\r\n\r\n.route-card{\r\n  display:block;\r\n  min-height:190px;\r\n  padding:1.8rem;\r\n  border-radius:34px;\r\n  background:rgba(255,255,255,0.58);\r\n  border:1px solid rgba(255,255,255,0.94);\r\n  box-shadow:0 10px 28px rgba(90,70,55,0.06);\r\n  transition:.25s ease;\r\n  text-decoration:none;\r\n  color:#3A2B24;\r\n  position:relative;\r\n  overflow:hidden;\r\n}\r\n\r\n.route-card::before{\r\n  content:\"\";\r\n  position:absolute;\r\n  right:-42px;\r\n  top:-42px;\r\n  width:128px;\r\n  height:128px;\r\n  border-radius:50%;\r\n  background:rgba(255,255,255,0.52);\r\n}\r\n\r\n.route-card:hover{\r\n  transform:translateY(-6px) scale(1.01);\r\n  background:rgba(255,255,255,0.78);\r\n  box-shadow:0 18px 38px rgba(90,70,55,0.11);\r\n}\r\n\r\n.route-card-top{\r\n  display:flex;\r\n  align-items:center;\r\n  gap:1rem;\r\n  margin-bottom:1.1rem;\r\n  position:relative;\r\n  z-index:2;\r\n}\r\n\r\n.route-circle{\r\n  width:58px;\r\n  height:58px;\r\n  border-radius:22px;\r\n  display:flex;\r\n  align-items:center;\r\n  justify-content:center;\r\n  background:#FFF0DE;\r\n  font-size:1.7rem;\r\n  flex-shrink:0;\r\n}\r\n\r\n.route-card h3{\r\n  margin:0;\r\n  font-size:1.22rem;\r\n  color:#3A2B24;\r\n  font-weight:900;\r\n  position:relative;\r\n  z-index:2;\r\n}\r\n\r\n.route-card p{\r\n  margin:0;\r\n  color:#7A6455;\r\n  line-height:1.8;\r\n  font-weight:650;\r\n  font-size:1rem;\r\n  position:relative;\r\n  z-index:2;\r\n}\r\n\r\n.route-card:nth-child(1){\r\n  background:rgba(255,246,230,0.74);\r\n}\r\n\r\n.route-card:nth-child(2){\r\n  background:rgba(238,247,243,0.72);\r\n}\r\n\r\n.route-card:nth-child(3){\r\n  background:rgba(255,232,238,0.66);\r\n}\r\n\r\n.route-circle.beige{background:#FFF0DE;}\r\n.route-circle.green{background:#EAF7F1;}\r\n.route-circle.pink{background:#FFEAF1;}\r\n\r\n.oefenblok{\r\n  max-width:980px;\r\n  margin:0 auto 4rem;\r\n  padding:2.8rem;\r\n  border-radius:42px;\r\n  background:rgba(255,255,255,0.62);\r\n  border:1px solid rgba(255,255,255,0.96);\r\n  box-shadow:0 16px 42px rgba(90,70,55,0.08);\r\n  backdrop-filter:blur(16px);\r\n  -webkit-backdrop-filter:blur(16px);\r\n  text-align:center;\r\n}\r\n\r\n.oefen-top{\r\n  display:flex;\r\n  justify-content:space-between;\r\n  gap:14px;\r\n  flex-wrap:wrap;\r\n  margin-bottom:22px;\r\n}\r\n\r\n.level-pill,\r\n.score-pill{\r\n  padding:10px 16px;\r\n  border-radius:999px;\r\n  background:rgba(255,255,255,0.72);\r\n  border:1px solid rgba(255,255,255,0.95);\r\n  color:#8B6B55;\r\n  font-size:14px;\r\n  font-weight:900;\r\n}\r\n\r\n.progress-wrap{\r\n  width:100%;\r\n  height:12px;\r\n  border-radius:999px;\r\n  background:rgba(255,255,255,0.72);\r\n  overflow:hidden;\r\n  margin:10px 0 28px;\r\n}\r\n\r\n.progress-bar{\r\n  height:100%;\r\n  width:0%;\r\n  border-radius:999px;\r\n  background:#F9CFE0;\r\n  transition:width .35s ease;\r\n}\r\n\r\n.vraag{\r\n  font-size:1.45rem;\r\n  font-weight:900;\r\n  margin-bottom:1rem;\r\n  color:#3A2B24;\r\n}\r\n\r\n.woord{\r\n  font-size:clamp(3.4rem,7vw,5.4rem);\r\n  font-weight:900;\r\n  margin:1rem 0;\r\n  color:#3A2B24;\r\n  line-height:1.05;\r\n}\r\n\r\n.helper{\r\n  color:#7A6455;\r\n  font-weight:750;\r\n  margin-bottom:1.4rem;\r\n  line-height:1.6;\r\n}\r\n\r\n.klappen{\r\n  display:flex;\r\n  justify-content:center;\r\n  gap:.7rem;\r\n  margin:1.4rem 0;\r\n  min-height:38px;\r\n}\r\n\r\n.klap{\r\n  width:34px;\r\n}\r\n\r\n.antwoorden{\r\n  display:flex;\r\n  gap:1.1rem;\r\n  justify-content:center;\r\n  flex-wrap:wrap;\r\n  margin-top:1.5rem;\r\n}\r\n\r\n.knop,\r\n.volgende button{\r\n  padding:1rem 2.2rem;\r\n  border-radius:999px;\r\n  border:1px solid rgba(255,255,255,0.98);\r\n  background:rgba(255,255,255,0.92);\r\n  color:#3A2B24 !important;\r\n  font-size:1.1rem;\r\n  font-weight:900;\r\n  cursor:pointer;\r\n  box-shadow:0 8px 22px rgba(90,70,55,0.08);\r\n  transition:.25s ease;\r\n}\r\n\r\n.knop:hover,\r\n.volgende button:hover{\r\n  transform:translateY(-3px);\r\n  background:#FFEAF1;\r\n}\r\n\r\n.knop.juist{\r\n  background:#DDF5E4 !important;\r\n  color:#2F6A46 !important;\r\n}\r\n\r\n.knop.fout{\r\n  background:#FFE3E3 !important;\r\n  color:#9A4B4B !important;\r\n  opacity:.72;\r\n}\r\n\r\n.feedback{\r\n  margin-top:1.8rem;\r\n  min-height:1.4em;\r\n  color:#7A6455;\r\n  font-weight:900;\r\n}\r\n\r\n.volgende{\r\n  display:none;\r\n  margin-top:2.2rem;\r\n}\r\n\r\n.lettergreep-note{\r\n  max-width:780px;\r\n  margin:4rem auto 0;\r\n  padding:2rem;\r\n  border-radius:30px;\r\n  background:\r\n    radial-gradient(circle at 12% 18%, rgba(255,255,255,.85) 0%, transparent 34%),\r\n    radial-gradient(circle at 88% 22%, rgba(255,234,242,.58) 0%, transparent 34%),\r\n    linear-gradient(135deg,#FFF8EF 0%,#F3FBF8 48%,#EEF7FE 100%);\r\n  border:1px solid rgba(255,255,255,0.94);\r\n  box-shadow:0 16px 38px rgba(90,70,55,.08);\r\n  color:#7A6455;\r\n  font-size:18px;\r\n  line-height:1.9;\r\n  font-weight:650;\r\n  text-align:center;\r\n}\r\n\r\n@media(max-width:900px){\r\n  .lettergreep-oefen-page{\r\n    padding:5rem 6vw 3rem;\r\n  }\r\n\r\n  .lettergreep-hero,\r\n  .oefenblok{\r\n    padding:2.4rem;\r\n  }\r\n\r\n  .route-grid{\r\n    grid-template-columns:1fr;\r\n  }\r\n\r\n  .route-kop{\r\n    text-align:center;\r\n  }\r\n\r\n  .route-text{\r\n    margin-left:auto;\r\n    margin-right:auto;\r\n  }\r\n\r\n  .route-card-top{\r\n    flex-direction:column;\r\n    text-align:center;\r\n  }\r\n\r\n  .route-card{\r\n    text-align:center;\r\n  }\r\n\r\n  .oefen-top{\r\n    justify-content:center;\r\n  }\r\n\r\n  .knop{\r\n    width:100%;\r\n  }\r\n}\r\n<\/style>\r\n\r\n<section class=\"lettergreep-oefen-page\">\r\n\r\n  <div class=\"lettergreep-hero\">\r\n    <div class=\"lettergreep-label\">\ud83d\udcd6 Woordenwereld<\/div>\r\n\r\n    <h1>Oefenen met lettergrepen.<\/h1>\r\n\r\n    <p>\r\n      Zeg het woord rustig hardop.\r\n      Klap mee. Kies. Bouw. Luister.\r\n      Stap voor stap \ud83c\udf3f\r\n    <\/p>\r\n  <\/div>\r\n\r\n  <div class=\"route-blok\">\r\n    <div class=\"route-kop\">\r\n      <h2 class=\"route-title\">\ud83d\udc4f Wat gaan we oefenen?<\/h2>\r\n      <p class=\"route-text\">\r\n        We luisteren naar woorden, voelen waar ze vanzelf even stoppen\r\n        en ontdekken hoe je woorden in rustige stukjes kunt verdelen.\r\n      <\/p>\r\n    <\/div>\r\n\r\n    <div class=\"route-grid\">\r\n      <div class=\"route-card\">\r\n        <div class=\"route-card-top\">\r\n          <div class=\"route-circle beige\">\ud83d\udde3\ufe0f<\/div>\r\n          <h3>Hardop zeggen<\/h3>\r\n        <\/div>\r\n        <p>Zeg het woord langzaam. Je hoort vaak vanzelf waar het woord even pauzeert.<\/p>\r\n      <\/div>\r\n\r\n      <div class=\"route-card\">\r\n        <div class=\"route-card-top\">\r\n          <div class=\"route-circle green\">\ud83d\udc4f<\/div>\r\n          <h3>Meeklappen<\/h3>\r\n        <\/div>\r\n        <p>Klap zachtjes mee met de stukjes. Elke klap helpt je horen waar een stukje zit.<\/p>\r\n      <\/div>\r\n\r\n      <div class=\"route-card\">\r\n        <div class=\"route-card-top\">\r\n          <div class=\"route-circle pink\">\ud83e\udde9<\/div>\r\n          <h3>Woorden bouwen<\/h3>\r\n        <\/div>\r\n        <p>Soms krijg je losse stukjes. Jij ontdekt welk woord ze samen maken.<\/p>\r\n      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <div class=\"oefenblok\">\r\n\r\n    <div class=\"oefen-top\">\r\n      <div class=\"level-pill\" id=\"levelNaam\"><\/div>\r\n      <div class=\"score-pill\" id=\"scoreTekst\"><\/div>\r\n    <\/div>\r\n\r\n    <div class=\"progress-wrap\">\r\n      <div class=\"progress-bar\" id=\"progressBar\"><\/div>\r\n    <\/div>\r\n\r\n    <div class=\"vraag\" id=\"vraag\"><\/div>\r\n    <div class=\"woord\" id=\"woord\"><\/div>\r\n    <div class=\"helper\" id=\"helper\"><\/div>\r\n    <div class=\"klappen\" id=\"klappen\"><\/div>\r\n    <div class=\"antwoorden\" id=\"antwoorden\"><\/div>\r\n    <div class=\"feedback\" id=\"feedback\"><\/div>\r\n\r\n    <div class=\"volgende\" id=\"volgende\">\r\n      <button id=\"volgendeBtn\">Volgende vraag \ud83c\udf3f<\/button>\r\n    <\/div>\r\n\r\n  <\/div>\r\n\r\n  <div class=\"lettergreep-note\">\r\n    Kleine reminder \ud83c\udf38<br>\r\n    Je hoeft het woord niet meteen goed te knippen.\r\n    Rustig zeggen, luisteren en opnieuw proberen helpt je brein groeien.\r\n  <\/div>\r\n\r\n<\/section>\r\n\r\n<script>\r\ndocument.addEventListener('DOMContentLoaded', () => {\r\n\r\n  const handImg = 'https:\/\/withifi.muhubonurture.nl\/wp-content\/uploads\/2026\/02\/Ontwerp-zonder-titel-7.png';\r\n\r\n  const levels = [\r\n    {\r\n      naam:'\ud83c\udf31 Level 1: Korte woorden klappen',\r\n      type:'aantal',\r\n      vragen:[\r\n        { woord:'tafel', antwoord:'2' },\r\n        { woord:'regen', antwoord:'2' },\r\n        { woord:'beker', antwoord:'2' },\r\n        { woord:'appel', antwoord:'2' },\r\n        { woord:'water', antwoord:'2' },\r\n        { woord:'mama', antwoord:'2' },\r\n        { woord:'papa', antwoord:'2' },\r\n        { woord:'sokken', antwoord:'2' },\r\n        { woord:'ramen', antwoord:'2' },\r\n        { woord:'stoel', antwoord:'1' }\r\n      ]\r\n    },\r\n    {\r\n      naam:'\ud83d\udc18 Level 2: Dieren en natuur',\r\n      type:'stukjes',\r\n      vragen:[\r\n        { woord:'olifant', antwoord:'o - li - fant', opties:['o - li - fant','oli - fant','ol - if - ant'] },\r\n        { woord:'krokodil', antwoord:'kro - ko - dil', opties:['kro - ko - dil','krok - o - dil','kroko - dil'] },\r\n        { woord:'flamingo', antwoord:'fla - min - go', opties:['fla - min - go','flam - in - go','flaming - o'] },\r\n        { woord:'konijnen', antwoord:'ko - nij - nen', opties:['ko - nij - nen','kon - ij - nen','konij - nen'] },\r\n        { woord:'vlinder', antwoord:'vlin - der', opties:['vlin - der','v - linder','vlin - d - er'] },\r\n        { woord:'bloemen', antwoord:'bloe - men', opties:['bloe - men','bloem - en','b - loe - men'] },\r\n        { woord:'aardbei', antwoord:'aard - bei', opties:['aard - bei','aar - dbei','aardb - ei'] },\r\n        { woord:'tomaten', antwoord:'to - ma - ten', opties:['to - ma - ten','tom - a - ten','to - mat - en'] }\r\n      ]\r\n    },\r\n    {\r\n      naam:'\ud83c\udf92 Level 3: Schoolwoorden bouwen',\r\n      type:'bouwen',\r\n      vragen:[\r\n        { woord:'com + pu + ter', antwoord:'computer', opties:['computer','compater','komputer'] },\r\n        { woord:'schrif + ten', antwoord:'schriften', opties:['schriften','schriftjes','schrijften'] },\r\n        { woord:'gum + me + tje', antwoord:'gummetje', opties:['gummetje','gommetje','gumtje'] },\r\n        { woord:'pot + lo + den', antwoord:'potloden', opties:['potloden','potlooden','potlode'] },\r\n        { woord:'klas + lo + kaal', antwoord:'klaslokaal', opties:['klaslokaal','klasloka','klaslokalen'] },\r\n        { woord:'bi + bli + o + theek', antwoord:'bibliotheek', opties:['bibliotheek','biblotheek','bibliotiek'] },\r\n        { woord:'gym + zaal', antwoord:'gymzaal', opties:['gymzaal','gymzaaltje','gymzalen'] },\r\n        { woord:'rug + tas', antwoord:'rugtas', opties:['rugtas','rugzak','rugtassen'] }\r\n      ]\r\n    },\r\n    {\r\n      naam:'\ud83d\udc4f Level 4: Hoeveel klappen?',\r\n      type:'handjes',\r\n      vragen:[\r\n        { klappen:2, antwoord:'vakantie', opties:['vakantie','fiets','stoel'] },\r\n        { klappen:3, antwoord:'ziekenhuis', opties:['ziekenhuis','tafel','water'] },\r\n        { klappen:4, antwoord:'politieauto', opties:['politieauto','appel','regen'] },\r\n        { klappen:3, antwoord:'regenboog', opties:['regenboog','stoel','mama'] },\r\n        { klappen:3, antwoord:'tandpasta', opties:['tandpasta','beker','fiets'] },\r\n        { klappen:4, antwoord:'televisie', opties:['televisie','ramen','stoel'] },\r\n        { klappen:4, antwoord:'sinaasappel', opties:['sinaasappel','water','tafel'] },\r\n        { klappen:3, antwoord:'supermarkt', opties:['supermarkt','fiets','papa'] }\r\n      ]\r\n    },\r\n    {\r\n      naam:'\u2b50 Level 5: Waar knip je het woord?',\r\n      type:'knippen',\r\n      vragen:[\r\n        { woord:'verjaardag', antwoord:'ver - jaar - dag', opties:['ver - jaar - dag','verjaar - dag','ver - jaard - ag'] },\r\n        { woord:'chocolademelk', antwoord:'cho - co - la - de - melk', opties:['cho - co - la - de - melk','choco - lade - melk','chocolade - melk'] },\r\n        { woord:'kinderen', antwoord:'kin - de - ren', opties:['kin - de - ren','kind - er - en','kinderen'] },\r\n        { woord:'speelgoed', antwoord:'speel - goed', opties:['speel - goed','spee - lgoed','speelg - oed'] },\r\n        { woord:'pyjama', antwoord:'py - ja - ma', opties:['py - ja - ma','pyja - ma','p - yjama'] },\r\n        { woord:'familie', antwoord:'fa - mi - lie', opties:['fa - mi - lie','fam - ilie','fami - lie'] },\r\n        { woord:'vriendinnen', antwoord:'vrien - din - nen', opties:['vrien - din - nen','vriend - in - nen','vriendin - nen'] },\r\n        { woord:'boodschappen', antwoord:'bood - schap - pen', opties:['bood - schap - pen','boodschap - pen','bood - schappen'] }\r\n      ]\r\n    },\r\n    {\r\n      naam:'\u2728 Level 6: Alles door elkaar',\r\n      type:'mix',\r\n      vragen:[\r\n        { woord:'paddenstoel', antwoord:'3' },\r\n        { woord:'bibliotheek', antwoord:'bi - bli - o - theek', opties:['bi - bli - o - theek','bibli - otheek','biblio - theek'] },\r\n        { woord:'ka + me + ra', antwoord:'kamera', opties:['kamera','camera','kamra'] },\r\n        { klappen:2, antwoord:'vlinder', opties:['vlinder','olifant','sinaasappel'] },\r\n        { woord:'supermarkt', antwoord:'su - per - markt', opties:['su - per - markt','super - markt','sup - er - markt'] },\r\n        { woord:'limonade', antwoord:'li - mo - na - de', opties:['li - mo - na - de','limo - nade','limon - ade'] },\r\n        { woord:'pa + ra + plu', antwoord:'paraplu', opties:['paraplu','paraploe','parapluu'] },\r\n        { klappen:4, antwoord:'televisie', opties:['televisie','beker','stoel'] },\r\n        { woord:'aardappelen', antwoord:'aard - ap - pe - len', opties:['aard - ap - pe - len','aardappel - en','aard - appelen'] },\r\n        { woord:'dinosaurussen', antwoord:'di - no - sau - rus - sen', opties:['di - no - sau - rus - sen','dino - saurussen','dinosaur - ussen'] }\r\n      ]\r\n    }\r\n  ];\r\n\r\n  let levelIndex = 0;\r\n  let vraagIndex = 0;\r\n  let goedAantal = 0;\r\n  let locked = false;\r\n  let huidigAntwoord = '';\r\n\r\n  const levelNaam = document.getElementById('levelNaam');\r\n  const scoreTekst = document.getElementById('scoreTekst');\r\n  const progressBar = document.getElementById('progressBar');\r\n  const vraagEl = document.getElementById('vraag');\r\n  const woordEl = document.getElementById('woord');\r\n  const helperEl = document.getElementById('helper');\r\n  const klappenEl = document.getElementById('klappen');\r\n  const antwoordenEl = document.getElementById('antwoorden');\r\n  const feedbackEl = document.getElementById('feedback');\r\n  const volgende = document.getElementById('volgende');\r\n  const volgendeBtn = document.getElementById('volgendeBtn');\r\n\r\n  function shuffle(arr){\r\n    return [...arr].sort(() => Math.random() - 0.5);\r\n  }\r\n\r\n  function toonHandjes(aantal){\r\n    klappenEl.innerHTML = '';\r\n    for(let i = 0; i < aantal; i++){\r\n      klappenEl.innerHTML += `<img decoding=\"async\" class=\"klap\" src=\"${handImg}\" alt=\"\">`;\r\n    }\r\n  }\r\n\r\n  function resetScherm(){\r\n    locked = false;\r\n    feedbackEl.textContent = '';\r\n    antwoordenEl.innerHTML = '';\r\n    klappenEl.innerHTML = '';\r\n    woordEl.textContent = '';\r\n    helperEl.textContent = '';\r\n    volgende.style.display = 'none';\r\n  }\r\n\r\n  function laadVraag(){\r\n    resetScherm();\r\n\r\n    const level = levels[levelIndex];\r\n    const item = level.vragen[vraagIndex];\r\n\r\n    levelNaam.textContent = level.naam;\r\n    scoreTekst.textContent = `Vraag ${vraagIndex + 1} van ${level.vragen.length}`;\r\n    progressBar.style.width = `${(vraagIndex \/ level.vragen.length) * 100}%`;\r\n\r\n    let type = level.type;\r\n\r\n    if(type === 'mix'){\r\n      if(item.antwoord && ['1','2','3','4','5'].includes(item.antwoord)){\r\n        type = 'aantal';\r\n      } else if(item.klappen){\r\n        type = 'handjes';\r\n      } else if(item.woord && item.woord.includes('+')){\r\n        type = 'bouwen';\r\n      } else if(item.woord && item.opties && item.opties[0].includes(' - ')){\r\n        type = 'knippen';\r\n      } else {\r\n        type = 'stukjes';\r\n      }\r\n    }\r\n\r\n    if(type === 'aantal'){\r\n      vraagEl.textContent = 'Hoeveel lettergrepen hoor je?';\r\n      woordEl.textContent = item.woord;\r\n      helperEl.textContent = 'Zeg het woord langzaam. Klap gerust mee.';\r\n      huidigAntwoord = item.antwoord;\r\n      maakKnoppen(['1','2','3','4','5']);\r\n    }\r\n\r\n    if(type === 'stukjes'){\r\n      vraagEl.textContent = 'Welke stukjes horen bij dit woord?';\r\n      woordEl.textContent = item.woord;\r\n      helperEl.textContent = 'Kijk waar het woord vanzelf even stopt.';\r\n      huidigAntwoord = item.antwoord;\r\n      maakKnoppen(item.opties);\r\n    }\r\n\r\n    if(type === 'bouwen'){\r\n      vraagEl.textContent = 'Welk woord bouw je met deze stukjes?';\r\n      woordEl.textContent = item.woord;\r\n      helperEl.textContent = 'Lees de stukjes rustig achter elkaar.';\r\n      huidigAntwoord = item.antwoord;\r\n      maakKnoppen(item.opties);\r\n    }\r\n\r\n    if(type === 'handjes'){\r\n      vraagEl.textContent = 'Welk woord past bij deze klappen?';\r\n      helperEl.textContent = 'Tel de klappen en kies het woord.';\r\n      toonHandjes(item.klappen);\r\n      huidigAntwoord = item.antwoord;\r\n      maakKnoppen(item.opties);\r\n    }\r\n\r\n    if(type === 'knippen'){\r\n      vraagEl.textContent = 'Waar knip je het woord?';\r\n      woordEl.textContent = item.woord;\r\n      helperEl.textContent = 'Kies de rustige stukjes.';\r\n      huidigAntwoord = item.antwoord;\r\n      maakKnoppen(item.opties);\r\n    }\r\n  }\r\n\r\n  function maakKnoppen(opties){\r\n    shuffle(opties).forEach(optie => {\r\n      const btn = document.createElement('button');\r\n      btn.className = 'knop';\r\n      btn.textContent = optie;\r\n      btn.onclick = () => controleer(btn, optie);\r\n      antwoordenEl.appendChild(btn);\r\n    });\r\n  }\r\n\r\n  function controleer(btn, keuze){\r\n    if(locked) return;\r\n\r\n    if(keuze === huidigAntwoord){\r\n      locked = true;\r\n      goedAantal++;\r\n      btn.classList.add('juist');\r\n\r\n      feedbackEl.textContent = [\r\n        'Goed gekeken \ud83c\udf38',\r\n        'Ja, dat klopt \ud83c\udf3f',\r\n        'Mooi rustig gedaan.',\r\n        'Knap geoefend.'\r\n      ][Math.floor(Math.random() * 4)];\r\n\r\n      volgende.style.display = 'block';\r\n\r\n      volgendeBtn.onclick = () => {\r\n        vraagIndex++;\r\n\r\n        if(vraagIndex >= levels[levelIndex].vragen.length){\r\n          toonLevelKlaar();\r\n        } else {\r\n          laadVraag();\r\n        }\r\n      };\r\n\r\n    } else {\r\n      btn.classList.add('fout');\r\n      feedbackEl.textContent = 'Probeer het nog eens rustig.';\r\n    }\r\n  }\r\n\r\n  function toonLevelKlaar(){\r\n    progressBar.style.width = '100%';\r\n    vraagEl.textContent = 'Goed geoefend \ud83c\udf38';\r\n    woordEl.textContent = '';\r\n    helperEl.textContent = '';\r\n    klappenEl.innerHTML = '';\r\n    antwoordenEl.innerHTML = '';\r\n    feedbackEl.textContent = `Je hebt ${goedAantal} antwoorden goed gedaan.`;\r\n\r\n    volgende.style.display = 'block';\r\n\r\n    if(levelIndex < levels.length - 1){\r\n      volgendeBtn.textContent = 'Naar het volgende level \ud83c\udf3f';\r\n      volgendeBtn.onclick = () => {\r\n        levelIndex++;\r\n        vraagIndex = 0;\r\n        goedAantal = 0;\r\n        volgendeBtn.textContent = 'Volgende vraag \ud83c\udf3f';\r\n        laadVraag();\r\n      };\r\n    } else {\r\n      volgendeBtn.textContent = 'Nog een keer oefenen \ud83c\udf38';\r\n      volgendeBtn.onclick = () => {\r\n        levelIndex = 0;\r\n        vraagIndex = 0;\r\n        goedAantal = 0;\r\n        volgendeBtn.textContent = 'Volgende vraag \ud83c\udf3f';\r\n        laadVraag();\r\n      };\r\n    }\r\n  }\r\n\r\n  laadVraag();\r\n});\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-4d0ef89 e-flex e-con-boxed e-con e-parent\" data-id=\"4d0ef89\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>\ud83d\udcd6 Woordenwereld Oefenen met lettergrepen. Zeg het woord rustig hardop. Klap mee. Kies. Bouw. Luister. Stap voor stap \ud83c\udf3f \ud83d\udc4f Wat gaan we oefenen? We luisteren naar woorden, voelen waar ze vanzelf even stoppen en ontdekken hoe je woorden in rustige stukjes kunt verdelen. \ud83d\udde3\ufe0f Hardop zeggen Zeg het woord langzaam. Je hoort vaak vanzelf [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"footnotes":""},"class_list":["post-686","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/withifi.muhubonurture.nl\/index.php?rest_route=\/wp\/v2\/pages\/686","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/withifi.muhubonurture.nl\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/withifi.muhubonurture.nl\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/withifi.muhubonurture.nl\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/withifi.muhubonurture.nl\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=686"}],"version-history":[{"count":46,"href":"https:\/\/withifi.muhubonurture.nl\/index.php?rest_route=\/wp\/v2\/pages\/686\/revisions"}],"predecessor-version":[{"id":3796,"href":"https:\/\/withifi.muhubonurture.nl\/index.php?rest_route=\/wp\/v2\/pages\/686\/revisions\/3796"}],"wp:attachment":[{"href":"https:\/\/withifi.muhubonurture.nl\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=686"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}