{"id":31691,"date":"2026-10-29T10:17:13","date_gmt":"2026-10-29T10:17:13","guid":{"rendered":"https:\/\/wrap.net.za\/?page_id=31691"},"modified":"2026-11-02T06:51:38","modified_gmt":"2026-11-02T06:51:38","slug":"choose-a-skill","status":"publish","type":"page","link":"https:\/\/wrap.net.za\/af\/choose-a-skill\/","title":{"rendered":"Choose a Skill"},"content":{"rendered":"<div data-elementor-type=\"wp-page\" data-elementor-id=\"31691\" class=\"elementor elementor-31691\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-1aede8bc e-flex e-con-boxed e-con e-parent\" data-id=\"1aede8bc\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-4b394405 elementor-widget elementor-widget-heading\" data-id=\"4b394405\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Watter vaardighede wil jy ontwikkel?<br>(Stap 2 van 4)<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-75f4f067 elementor-widget elementor-widget-heading\" data-id=\"75f4f067\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h4 class=\"elementor-heading-title elementor-size-default\">Kies een of meer vaardighede (of los oop)<\/h4>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-432fb571 e-flex e-con-boxed e-con e-parent\" data-id=\"432fb571\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-412d36e8 elementor-widget elementor-widget-html\" data-id=\"412d36e8\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div id=\"wrap-skill-selector\">\n\n  <div class=\"wrap-shelf\">\n    <button class=\"wrap-shelf-toggle\" type=\"button\" aria-expanded=\"false\">\n      <img decoding=\"async\" src=\"https:\/\/wrap.net.za\/wp-content\/uploads\/2026\/10\/Untitled-design-1.png\" alt=\"\">\n      <span>Kommunikasie &amp; Geletterdheid<\/span>\n    <\/button>\n\n    <div class=\"wrap-skill-panel\" hidden>\n      <div class=\"wrap-skill-grid\">\n\n        <label class=\"wrap-skill\">\n          <input type=\"checkbox\" value=\"auditory-perception\">\n          <img decoding=\"async\" src=\"https:\/\/wrap.net.za\/wp-content\/uploads\/2025\/01\/Auditory-Perception.png\" alt=\"\">\n          <span>Ouditiewe Persepsie<\/span>\n        <\/label>\n\n        <label class=\"wrap-skill\">\n          <input type=\"checkbox\" value=\"language\">\n          <img decoding=\"async\" src=\"https:\/\/wrap.net.za\/wp-content\/uploads\/2025\/03\/scrabble.png\" alt=\"\">\n          <span>Taal<\/span>\n        <\/label>\n\n        <label class=\"wrap-skill\">\n          <input type=\"checkbox\" value=\"listen\">\n          <img decoding=\"async\" src=\"https:\/\/wrap.net.za\/wp-content\/uploads\/2025\/01\/Listen.png\" alt=\"\">\n          <span>Luister<\/span>\n        <\/label>\n\n        <label class=\"wrap-skill\">\n          <input type=\"checkbox\" value=\"reading\">\n          <img decoding=\"async\" src=\"https:\/\/wrap.net.za\/wp-content\/uploads\/2025\/01\/Reading.png\" alt=\"\">\n          <span>Lees<\/span>\n        <\/label>\n\n        <label class=\"wrap-skill\">\n          <input type=\"checkbox\" value=\"spelling\">\n          <img decoding=\"async\" src=\"https:\/\/wrap.net.za\/wp-content\/uploads\/2025\/01\/Spelling.png\" alt=\"\">\n          <span>Spelling<\/span>\n        <\/label>\n\n        <label class=\"wrap-skill\">\n          <input type=\"checkbox\" value=\"vocabulary\">\n          <img decoding=\"async\" src=\"https:\/\/wrap.net.za\/wp-content\/uploads\/2025\/01\/Vocabulary.png\" alt=\"\">\n          <span>Woordeskat<\/span>\n        <\/label>\n\n      <\/div>\n    <\/div>\n  <\/div>\n\n  <div class=\"wrap-shelf\">\n    <button class=\"wrap-shelf-toggle\" type=\"button\" aria-expanded=\"false\">\n      <img decoding=\"async\" src=\"https:\/\/wrap.net.za\/wp-content\/uploads\/2026\/10\/Untitled-design-2.png\" alt=\"\">\n      <span>Motories &amp; Sensories<\/span>\n    <\/button>\n\n    <div class=\"wrap-skill-panel\" hidden>\n      <div class=\"wrap-skill-grid\">\n\n        <label class=\"wrap-skill\">\n          <input type=\"checkbox\" value=\"eye-hand-coordination\">\n          <img decoding=\"async\" src=\"https:\/\/wrap.net.za\/wp-content\/uploads\/2025\/01\/Hand-eye-Coordination.png\" alt=\"\">\n          <span>Oog Hand Ko\u00f6rdinasie<\/span>\n        <\/label>\n\n        <label class=\"wrap-skill\">\n          <input type=\"checkbox\" value=\"fine-motor\">\n          <img decoding=\"async\" src=\"https:\/\/wrap.net.za\/wp-content\/uploads\/2025\/01\/Fine-Motor.png\" alt=\"\">\n          <span>Fyn Motories<\/span>\n        <\/label>\n\n        <label class=\"wrap-skill\">\n          <input type=\"checkbox\" value=\"gross-motor\">\n          <img decoding=\"async\" src=\"https:\/\/wrap.net.za\/wp-content\/uploads\/2025\/03\/body.png\" alt=\"\">\n          <span>Groot Motories<\/span>\n        <\/label>\n\n        <label class=\"wrap-skill\">\n          <input type=\"checkbox\" value=\"laterality\">\n          <img decoding=\"async\" src=\"https:\/\/wrap.net.za\/wp-content\/uploads\/2025\/03\/mechanical.png\" alt=\"\">\n          <span>Lateraliteit<\/span>\n        <\/label>\n\n        <label class=\"wrap-skill\">\n          <input type=\"checkbox\" value=\"pen-control\">\n          <img decoding=\"async\" src=\"https:\/\/wrap.net.za\/wp-content\/uploads\/2025\/01\/Pen-grip.png\" alt=\"\">\n          <span>Pen beheer<\/span>\n        <\/label>\n\n        <label class=\"wrap-skill\">\n          <input type=\"checkbox\" value=\"sensory\">\n          <img decoding=\"async\" src=\"https:\/\/wrap.net.za\/wp-content\/uploads\/2025\/01\/Sensories-1.png\" alt=\"\">\n          <span>Sensories<\/span>\n        <\/label>\n\n        <label class=\"wrap-skill\">\n          <input type=\"checkbox\" value=\"visual-perception\">\n          <img decoding=\"async\" src=\"https:\/\/wrap.net.za\/wp-content\/uploads\/2025\/03\/perception.png\" alt=\"\">\n          <span>Visuele persepsie<\/span>\n        <\/label>\n\n      <\/div>\n    <\/div>\n  <\/div>\n\n  <div class=\"wrap-shelf\">\n    <button class=\"wrap-shelf-toggle\" type=\"button\" aria-expanded=\"false\">\n      <img decoding=\"async\" src=\"https:\/\/wrap.net.za\/wp-content\/uploads\/2026\/10\/Untitled-design-3.png\" alt=\"\">\n      <span>Dink &amp; Leer<\/span>\n    <\/button>\n\n    <div class=\"wrap-skill-panel\" hidden>\n      <div class=\"wrap-skill-grid\">\n\n        <label class=\"wrap-skill\">\n          <input type=\"checkbox\" value=\"information\">\n          <img decoding=\"async\" src=\"https:\/\/wrap.net.za\/wp-content\/uploads\/2025\/01\/Info.png\" alt=\"\">\n          <span>Inligting<\/span>\n        <\/label>\n\n        <label class=\"wrap-skill\">\n          <input type=\"checkbox\" value=\"maths\">\n          <img decoding=\"async\" src=\"https:\/\/wrap.net.za\/wp-content\/uploads\/2025\/01\/Maths.png\" alt=\"\">\n          <span>Wiskunde<\/span>\n        <\/label>\n\n        <label class=\"wrap-skill\">\n          <input type=\"checkbox\" value=\"reasoning\">\n          <img decoding=\"async\" src=\"https:\/\/wrap.net.za\/wp-content\/uploads\/2025\/01\/Reasoning.png\" alt=\"\">\n          <span>Redenasie<\/span>\n        <\/label>\n\n      <\/div>\n    <\/div>\n  <\/div>\n\n  <div class=\"wrap-shelf\">\n    <button class=\"wrap-shelf-toggle\" type=\"button\" aria-expanded=\"false\">\n      <img decoding=\"async\" src=\"https:\/\/wrap.net.za\/wp-content\/uploads\/2026\/10\/Untitled-design-4.png\" alt=\"\">\n      <span>Kreatiwiteit &amp; Emosionele Ontwikkeling<\/span>\n    <\/button>\n\n    <div class=\"wrap-skill-panel\" hidden>\n      <div class=\"wrap-skill-grid\">\n\n        <label class=\"wrap-skill\">\n          <input type=\"checkbox\" value=\"creativity\">\n          <img decoding=\"async\" src=\"https:\/\/wrap.net.za\/wp-content\/uploads\/2025\/01\/Creativity.png\" alt=\"\">\n          <span>Kreatiwiteit<\/span>\n        <\/label>\n\n        <label class=\"wrap-skill\">\n          <input type=\"checkbox\" value=\"emotions\">\n          <img decoding=\"async\" src=\"https:\/\/wrap.net.za\/wp-content\/uploads\/2025\/01\/Emotions.png\" alt=\"\">\n          <span>Emosies<\/span>\n        <\/label>\n\n        <label class=\"wrap-skill\">\n          <input type=\"checkbox\" value=\"humour\">\n          <img decoding=\"async\" src=\"https:\/\/wrap.net.za\/wp-content\/uploads\/2025\/01\/Humor.png\" alt=\"\">\n          <span>Humor<\/span>\n        <\/label>\n\n        <label class=\"wrap-skill\">\n          <input type=\"checkbox\" value=\"imagination\">\n          <img decoding=\"async\" src=\"https:\/\/wrap.net.za\/wp-content\/uploads\/2025\/03\/imagination.png\" alt=\"\">\n          <span>Verbeelding<\/span>\n        <\/label>\n\n        <label class=\"wrap-skill\">\n          <input type=\"checkbox\" value=\"moral-content\">\n          <img decoding=\"async\" src=\"https:\/\/wrap.net.za\/wp-content\/uploads\/2025\/01\/Moral-Lessons.png\" alt=\"\">\n          <span>Morele Lesse<\/span>\n        <\/label>\n\n      <\/div>\n    <\/div>\n  <\/div>\n\n  <div class=\"wrap-selection-footer\">\n    <p id=\"wrap-skill-count\" aria-live=\"polite\">No specific skills selected<\/p>\n\n    <div class=\"wrap-selection-actions\">\n      <button id=\"wrap-any-skill\" type=\"button\">Enige Vaardighede<\/button>\n      <button id=\"wrap-skill-continue\" type=\"button\">Gaan voort na Ouderdom<\/button>\n    <\/div>\n  <\/div>\n\n<\/div>\n\n<style>\n#wrap-skill-selector {\n  width: 100%;\n  max-width: 1200px;\n  margin: 0 auto;\n  font-family: inherit;\n}\n\n#wrap-skill-selector .wrap-shelf {\n  margin-bottom: 18px;\n}\n\n#wrap-skill-selector .wrap-shelf-toggle {\n  display: block;\n  position: relative;\n  width: 100%;\n  padding: 0;\n  overflow: hidden;\n  border: 0;\n  border-radius: 12px;\n  background: #222;\n  cursor: pointer;\n}\n\n#wrap-skill-selector .wrap-shelf-toggle img {\n  display: block;\n  width: 100%;\n  height: auto;\n  transition: transform 0.25s ease;\n}\n\n#wrap-skill-selector .wrap-shelf-toggle:hover img {\n  transform: scale(1.015);\n}\n\n#wrap-skill-selector .wrap-shelf-toggle span {\n  position: absolute;\n  inset: auto 0 0 0;\n  padding: 18px 20px;\n  color: #fff;\n  background: rgba(0, 0, 0, 0.68);\n  font-size: clamp(18px, 2.3vw, 30px);\n  font-weight: 600;\n  text-align: center;\n}\n\n#wrap-skill-selector .wrap-skill-panel {\n  padding: 22px;\n  border: 1px solid #ddd;\n  border-top: 0;\n  border-radius: 0 0 12px 12px;\n  background: #fff;\n}\n\n#wrap-skill-selector .wrap-skill-grid {\n  display: grid;\n  grid-template-columns: repeat(4, minmax(0, 1fr));\n  gap: 16px;\n}\n\n#wrap-skill-selector .wrap-skill {\n  display: flex;\n  min-height: 150px;\n  padding: 16px 10px;\n  align-items: center;\n  justify-content: center;\n  flex-direction: column;\n  gap: 10px;\n  border: 2px solid #e1e1e1;\n  border-radius: 10px;\n  background: #fff;\n  cursor: pointer;\n  text-align: center;\n  transition: border-color 0.2s ease, background 0.2s ease;\n}\n\n#wrap-skill-selector .wrap-skill:hover {\n  border-color: #777;\n}\n\n#wrap-skill-selector .wrap-skill.is-selected {\n  border-color: #333;\n  background: #f1f1f1;\n}\n\n#wrap-skill-selector .wrap-skill input {\n  position: absolute;\n  opacity: 0;\n  pointer-events: none;\n}\n\n#wrap-skill-selector .wrap-skill img {\n  width: 72px;\n  height: 72px;\n  object-fit: contain;\n}\n\n#wrap-skill-selector .wrap-skill span {\n  color: #222;\n  font-size: 15px;\n  font-weight: 600;\n}\n\n#wrap-skill-selector .wrap-selection-footer {\n  margin-top: 28px;\n  text-align: center;\n}\n\n#wrap-skill-selector #wrap-skill-count {\n  margin-bottom: 14px;\n  font-weight: 600;\n}\n\n#wrap-skill-selector .wrap-selection-actions {\n  display: flex;\n  justify-content: center;\n  gap: 12px;\n  flex-wrap: wrap;\n}\n\n#wrap-skill-selector .wrap-selection-actions button {\n  min-width: 170px;\n  min-height: 48px;\n  padding: 12px 22px;\n  border: 2px solid #333;\n  border-radius: 6px;\n  cursor: pointer;\n  font: inherit;\n  font-weight: 600;\n}\n\n#wrap-skill-selector #wrap-any-skill {\n  color: #333;\n  background: #fff;\n}\n\n#wrap-skill-selector #wrap-skill-continue {\n  color: #fff;\n  background: #333;\n}\n\n@media (max-width: 767px) {\n  #wrap-skill-selector .wrap-skill-grid {\n    grid-template-columns: repeat(2, minmax(0, 1fr));\n  }\n\n  #wrap-skill-selector .wrap-skill-panel {\n    padding: 14px;\n  }\n\n  #wrap-skill-selector .wrap-skill {\n    min-height: 130px;\n  }\n\n  #wrap-skill-selector .wrap-selection-actions button {\n    width: 100%;\n  }\n}\n#wrap-skill-selector .wrap-skill {\n  position: relative;\n}\n\n#wrap-skill-selector .wrap-skill.is-selected {\n  border-color: #00BFB8;\n  background: rgba(0, 191, 184, 0.14);\n  box-shadow: 0 0 0 4px rgba(0, 191, 184, 0.22);\n  transform: translateY(-3px);\n}\n\n#wrap-skill-selector .wrap-skill.is-selected::after {\n  content: \"\u2713\";\n  position: absolute;\n  top: 8px;\n  right: 8px;\n  display: grid;\n  width: 30px;\n  height: 30px;\n  place-items: center;\n  border-radius: 50%;\n  color: #fff;\n  background: #002C77;\n  font-size: 19px;\n  font-weight: 700;\n}\n#wrap-skill-selector .wrap-shelf-toggle span {\n  background: rgba(0, 44, 119, 0.58);\n}\n\n#wrap-skill-selector #wrap-any-skill {\n  color: #002C77;\n  border-color: #002C77;\n  background: #fff;\n}\n\n#wrap-skill-selector #wrap-skill-continue {\n  color: #fff;\n  border-color: #002C77;\n  background: #002C77;\n}\n\n#wrap-skill-selector #wrap-skill-continue:hover {\n  border-color: #00BFB8;\n  background: #00BFB8;\n}\n<\/style>\n\n<script>\n(function () {\n  const selector = document.getElementById('wrap-skill-selector');\n  if (!selector) return;\n\n  const shelfButtons = selector.querySelectorAll('.wrap-shelf-toggle');\n  const checkboxes = selector.querySelectorAll('.wrap-skill input');\n  const count = selector.querySelector('#wrap-skill-count');\n  const clearButton = selector.querySelector('#wrap-any-skill');\n  const continueButton = selector.querySelector('#wrap-skill-continue');\n\n  function updateSelection() {\n    const selected = selector.querySelectorAll('.wrap-skill input:checked');\n\n    checkboxes.forEach(function (checkbox) {\n      checkbox.closest('.wrap-skill')\n        .classList.toggle('is-selected', checkbox.checked);\n    });\n\n    count.textContent = selected.length\n      ? selected.length + (selected.length === 1\n          ? ' skill selected'\n          : ' skills selected')\n      : 'No specific skills selected';\n  }\n\n  shelfButtons.forEach(function (button) {\n    button.addEventListener('click', function () {\n      const shelf = button.closest('.wrap-shelf');\n      const panel = shelf.querySelector('.wrap-skill-panel');\n      const isOpen = button.getAttribute('aria-expanded') === 'true';\n\n      selector.querySelectorAll('.wrap-shelf-toggle').forEach(function (otherButton) {\n        if (otherButton !== button) {\n          otherButton.setAttribute('aria-expanded', 'false');\n          otherButton.closest('.wrap-shelf')\n            .querySelector('.wrap-skill-panel').hidden = true;\n        }\n      });\n\n      button.setAttribute('aria-expanded', String(!isOpen));\n      panel.hidden = isOpen;\n    });\n  });\n\n  checkboxes.forEach(function (checkbox) {\n    checkbox.addEventListener('change', updateSelection);\n  });\n\n  clearButton.addEventListener('click', function () {\n    checkboxes.forEach(function (checkbox) {\n      checkbox.checked = false;\n    });\n    updateSelection();\n  });\n\n  continueButton.addEventListener('click', function () {\n    const selected = Array.from(\n      selector.querySelectorAll('.wrap-skill input:checked')\n    ).map(function (checkbox) {\n      return checkbox.value;\n    });\n\n    const parameters = new URLSearchParams(window.location.search);\n\n    if (selected.length) {\n      parameters.set('filter_skills', selected.join(','));\n    } else {\n      parameters.delete('filter_skills');\n    }\n\n    const destination = new URL('..\/choose-an-age\/', window.location.href);\n    destination.search = parameters.toString();\n    window.location.href = destination.toString();\n  });\n\n  const existing = new URLSearchParams(window.location.search)\n    .get('filter_skills');\n\n  if (existing) {\n    const existingSkills = existing.split(',');\n\n    checkboxes.forEach(function (checkbox) {\n      checkbox.checked = existingSkills.includes(checkbox.value);\n    });\n  }\n\n  updateSelection();\n})();\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>","protected":false},"excerpt":{"rendered":"<p>What would you like to develop?(Step 2 of 4) Choose one or more skills (or leave blank) Communication &amp; Literacy Auditory Perception Language Listening Reading&#8230;<\/p>","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"footnotes":""},"class_list":["post-31691","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/wrap.net.za\/af\/wp-json\/wp\/v2\/pages\/31691","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wrap.net.za\/af\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/wrap.net.za\/af\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/wrap.net.za\/af\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/wrap.net.za\/af\/wp-json\/wp\/v2\/comments?post=31691"}],"version-history":[{"count":8,"href":"https:\/\/wrap.net.za\/af\/wp-json\/wp\/v2\/pages\/31691\/revisions"}],"predecessor-version":[{"id":31719,"href":"https:\/\/wrap.net.za\/af\/wp-json\/wp\/v2\/pages\/31691\/revisions\/31719"}],"wp:attachment":[{"href":"https:\/\/wrap.net.za\/af\/wp-json\/wp\/v2\/media?parent=31691"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}