Tutor Profile Form<\/title>\r\n <link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n <link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\r\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Poppins:wght@600;700&family=Nunito+Sans:wght@400;600;700&display=swap\" rel=\"stylesheet\">\r\n <style>\r\n :root {\r\n --blue: #2caae2;\r\n --deep: #305261;\r\n --ink: #213f4d;\r\n --line: #cdd9e0;\r\n --soft: #f5f8fa;\r\n --warn: #fff8d8;\r\n --bad: #8f2a34;\r\n }\r\n * { box-sizing: border-box; }\r\n body { margin: 0; background: var(--soft); color: var(--ink); font-family: \"Nunito Sans\", Arial, sans-serif; }\r\n main { width: min(94vw, 920px); margin: 24px auto; }\r\n form { background: #fff; border: 1px solid var(--line); border-radius: 8px; padding: 24px; }\r\n h1, h2, label, button { font-family: \"Poppins\", Arial, sans-serif; letter-spacing: 0; }\r\n h1 { margin: 0 0 8px; color: var(--deep); font-size: 1.7rem; }\r\n h2 { margin: 0 0 12px; color: var(--deep); font-size: 1.05rem; }\r\n p { margin: 8px 0; line-height: 1.55; }\r\n .helper { color: #526d78; margin-bottom: 18px; }\r\n .section { border-top: 1px solid var(--line); margin-top: 20px; padding-top: 18px; }\r\n .grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }\r\n .field { display: grid; gap: 6px; margin: 12px 0; }\r\n #email-field { grid-column: 1 \/ -1; }\r\n label { font-size: 0.92rem; font-weight: 700; color: var(--deep); }\r\n input, textarea {\r\n width: 100%; border: 1px solid var(--line); border-radius: 8px; padding: 11px 12px;\r\n font: 600 1rem \"Nunito Sans\", Arial, sans-serif; color: var(--ink); background: #fff;\r\n }\r\n textarea { min-height: 132px; resize: vertical; }\r\n input:focus, textarea:focus { outline: 3px solid rgba(44, 170, 226, 0.22); border-color: var(--blue); }\r\n .keyword-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }\r\n .keyword { display: flex; align-items: flex-start; gap: 8px; border: 1px solid var(--line); border-radius: 8px; padding: 9px 10px; font-weight: 700; cursor: pointer; min-height: 44px; }\r\n .keyword input { width: 16px; height: 16px; margin-top: 3px; padding: 0; }\r\n .note { background: var(--warn); border: 1px solid #eadc9a; border-radius: 8px; padding: 12px; }\r\n .requirements { margin: 10px 0 0; padding-left: 20px; }\r\n .requirements li { margin: 6px 0; }\r\n .actions { display: flex; align-items: center; gap: 12px; margin-top: 20px; flex-wrap: wrap; }\r\n button { min-height: 44px; border: 1px solid var(--blue); border-radius: 8px; background: var(--blue); color: #fff; padding: 10px 16px; cursor: pointer; font-weight: 700; }\r\n button:disabled { opacity: 0.6; cursor: not-allowed; }\r\n .status { min-height: 1.4em; margin: 0; font-weight: 700; }\r\n .status.error { color: var(--bad); }\r\n .status.success { color: #176b50; }\r\n .error-message { min-height: 1.2em; color: var(--bad); font-weight: 700; font-size: 0.92rem; }\r\n .field-error input,\r\n .field-error textarea,\r\n .field-error.keyword-section,\r\n .field-error.photo-section { border-color: var(--bad); }\r\n .field-error-flash { animation: nlg-error-flash 1s ease; }\r\n @keyframes nlg-error-flash {\r\n 0%, 100% { box-shadow: none; }\r\n 20%, 70% { box-shadow: 0 0 0 4px rgba(143, 42, 52, 0.18); }\r\n }\r\n @media (max-width: 760px) {\r\n form { padding: 18px; }\r\n .grid, .keyword-grid { grid-template-columns: 1fr; }\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n <main>\r\n <form id=\"profile-form\" novalidate>\r\n <h1>Tutor Profile<\/h1>\r\n\r\n <div class=\"section\">\r\n <h2>Your Details<\/h2>\r\n <div class=\"grid\">\r\n <div class=\"field\" id=\"email-field\">\r\n <label for=\"nlg-email\">NLG email address<\/label>\r\n <input id=\"nlg-email\" name=\"nlgEmail\" type=\"email\" autocomplete=\"email\" placeholder=\"name@thenationallearninggroup.co.uk\">\r\n <div class=\"error-message\" id=\"email-error\" aria-live=\"polite\"><\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"section keyword-section\" id=\"style-field\">\r\n <h2>Tutoring Style<\/h2>\r\n <p>Pick exactly 3 key words or phrases you would use to describe your tutoring style.<\/p>\r\n <div class=\"keyword-grid\" id=\"keyword-grid\">\r\n <label class=\"keyword\"><input type=\"checkbox\" name=\"style\" value=\"Confidence-building\"><span>Confidence-building<\/span><\/label>\r\n <label class=\"keyword\"><input type=\"checkbox\" name=\"style\" value=\"Patient\"><span>Patient<\/span><\/label>\r\n <label class=\"keyword\"><input type=\"checkbox\" name=\"style\" value=\"Structured\"><span>Structured<\/span><\/label>\r\n <label class=\"keyword\"><input type=\"checkbox\" name=\"style\" value=\"Exam-focused\"><span>Exam-focused<\/span><\/label>\r\n <label class=\"keyword\"><input type=\"checkbox\" name=\"style\" value=\"Encouraging\"><span>Encouraging<\/span><\/label>\r\n <label class=\"keyword\"><input type=\"checkbox\" name=\"style\" value=\"Clear and methodical\"><span>Clear and methodical<\/span><\/label>\r\n <label class=\"keyword\"><input type=\"checkbox\" name=\"style\" value=\"Engaging\"><span>Engaging<\/span><\/label>\r\n <label class=\"keyword\"><input type=\"checkbox\" name=\"style\" value=\"Fun\"><span>Fun<\/span><\/label>\r\n <label class=\"keyword\"><input type=\"checkbox\" name=\"style\" value=\"Discussion-led\"><span>Discussion-led<\/span><\/label>\r\n <label class=\"keyword\"><input type=\"checkbox\" name=\"style\" value=\"Creative\"><span>Creative<\/span><\/label>\r\n <label class=\"keyword\"><input type=\"checkbox\" name=\"style\" value=\"Interactive\"><span>Interactive<\/span><\/label>\r\n <label class=\"keyword\"><input type=\"checkbox\" name=\"style\" value=\"High expectations\"><span>High expectations<\/span><\/label>\r\n <label class=\"keyword\"><input type=\"checkbox\" name=\"style\" value=\"Real-world connections\"><span>Real-world connections<\/span><\/label>\r\n <label class=\"keyword\"><input type=\"checkbox\" name=\"style\" value=\"Approachable\"><span>Approachable<\/span><\/label>\r\n <label class=\"keyword\"><input type=\"checkbox\" name=\"style\" value=\"Practical\"><span>Practical<\/span><\/label>\r\n <\/div>\r\n <div class=\"error-message\" id=\"style-error\" aria-live=\"polite\"><\/div>\r\n <\/div>\r\n\r\n <div class=\"section\">\r\n <h2>Profile Information<\/h2>\r\n <div class=\"field\" id=\"text-field\">\r\n <label for=\"short-extra\">Write a short paragraph you would like parents and students to know<\/label>\r\n <textarea id=\"short-extra\" name=\"shortExtra\" maxlength=\"1200\" placeholder=\"For example, your approach to helping students build confidence, how you adapt lessons, or the kind of progress you enjoy supporting.\"><\/textarea>\r\n <div class=\"error-message\" id=\"text-error\" aria-live=\"polite\"><\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"section photo-section\" id=\"photo-field\">\r\n <h2>Photo Upload<\/h2>\r\n <div class=\"note\">\r\n <p><strong>Photos will be rejected if they do not meet these requirements.<\/strong><\/p>\r\n <ul class=\"requirements\">\r\n <li>Use a current, professional headshot. No selfies or casual social media-style photos.<\/li>\r\n <li>Your face should be clearly visible, with good lighting and a neutral or professional background.<\/li>\r\n <li>Do not use filters, heavy editing, sunglasses, distracting backgrounds, or group photos.<\/li>\r\n <li>Upload a high-resolution JPEG or PNG, at least 500 x 625 pixels and under 6MB.<\/li>\r\n <li>The photo must be a 4:5 aspect ratio portrait image and suitable for parents and students to see before their first lesson.<\/li>\r\n <\/ul>\r\n <\/div>\r\n <div class=\"field\">\r\n <label for=\"photo\">Upload your tutor photo<\/label>\r\n <input id=\"photo\" name=\"photo\" type=\"file\">\r\n <div class=\"error-message\" id=\"photo-error\" aria-live=\"polite\"><\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"actions\">\r\n <button id=\"submit-button\" type=\"submit\">Submit profile<\/button>\r\n <p class=\"status\" id=\"status\" aria-live=\"polite\"><\/p>\r\n <\/div>\r\n <\/form>\r\n <\/main>\r\n\r\n <script>\r\n (function () {\r\n const form = document.getElementById(\"profile-form\");\r\n const status = document.getElementById(\"status\");\r\n const submitButton = document.getElementById(\"submit-button\");\r\n const styleInputs = Array.from(form.querySelectorAll('input[name=\"style\"]'));\r\n const nlgEmailDomain = \"@thenationallearninggroup.co.uk\";\r\n const fields = {\r\n email: { wrap: document.getElementById(\"email-field\"), error: document.getElementById(\"email-error\"), focus: document.getElementById(\"nlg-email\") },\r\n style: { wrap: document.getElementById(\"style-field\"), error: document.getElementById(\"style-error\"), focus: document.getElementById(\"keyword-grid\") },\r\n text: { wrap: document.getElementById(\"text-field\"), error: document.getElementById(\"text-error\"), focus: document.getElementById(\"short-extra\") },\r\n photo: { wrap: document.getElementById(\"photo-field\"), error: document.getElementById(\"photo-error\"), focus: document.getElementById(\"photo\") }\r\n };\r\n\r\n function setStatus(message, kind) {\r\n status.textContent = message;\r\n status.className = \"status\" + (kind ? \" \" + kind : \"\");\r\n }\r\n\r\n function selectedStyles() {\r\n return styleInputs.filter((input) => input.checked).map((input) => input.value);\r\n }\r\n\r\n function clearFieldErrors() {\r\n Object.values(fields).forEach((field) => {\r\n field.wrap.classList.remove(\"field-error\", \"field-error-flash\");\r\n field.error.textContent = \"\";\r\n });\r\n }\r\n\r\n function showFieldError(field, message) {\r\n clearFieldErrors();\r\n field.error.textContent = message;\r\n field.wrap.classList.add(\"field-error\", \"field-error-flash\");\r\n field.wrap.scrollIntoView({ behavior: \"smooth\", block: \"center\" });\r\n if (field.focus && typeof field.focus.focus === \"function\") {\r\n setTimeout(() => field.focus.focus({ preventScroll: true }), 250);\r\n }\r\n setTimeout(() => field.wrap.classList.remove(\"field-error-flash\"), 1000);\r\n setStatus(message, \"error\");\r\n }\r\n\r\n function enforceStyleLimit() {\r\n const count = selectedStyles().length;\r\n styleInputs.forEach((input) => {\r\n input.disabled = !input.checked && count >= 3;\r\n });\r\n if (count === 3) fields.style.error.textContent = \"\";\r\n }\r\n\r\n async function validatePhoto(file) {\r\n if (!file) return { field: fields.photo, message: \"Please upload your tutor photo.\" };\r\n return null;\r\n }\r\n\r\n async function firstValidationError() {\r\n const email = document.getElementById(\"nlg-email\").value.trim().toLowerCase();\r\n if (!email || !email.endsWith(nlgEmailDomain) || email.length <= nlgEmailDomain.length) {\r\n return { field: fields.email, message: \"Enter your NLG email address with the correct ending: \" + nlgEmailDomain };\r\n }\r\n if (selectedStyles().length !== 3) {\r\n return { field: fields.style, message: \"Please choose exactly 3 tutoring style keywords.\" };\r\n }\r\n if (document.getElementById(\"short-extra\").value.trim().length < 50) {\r\n return { field: fields.text, message: \"Please write at least 50 characters for parents and students.\" };\r\n }\r\n return validatePhoto(document.getElementById(\"photo\").files[0]);\r\n }\r\n\r\n async function submitProfile(event) {\r\n event.preventDefault();\r\n const validationError = await firstValidationError();\r\n if (validationError) {\r\n showFieldError(validationError.field, validationError.message);\r\n return;\r\n }\r\n clearFieldErrors();\r\n\r\n const config = window.nlgTutorProfilePublic || {};\r\n const endpoint = config.saveEndpoint || \"\/lms\/wp-json\/nlg-tutor-profile-public\/v1\/profiles\";\r\n const payload = new FormData();\r\n payload.append(\"source\", \"standalone-wordpress\");\r\n payload.append(\"fullName\", \"\");\r\n payload.append(\"nlgEmail\", document.getElementById(\"nlg-email\").value.trim());\r\n payload.append(\"shortExtra\", document.getElementById(\"short-extra\").value.trim());\r\n selectedStyles().forEach((style) => payload.append(\"style[]\", style));\r\n payload.append(\"photo\", document.getElementById(\"photo\").files[0]);\r\n\r\n submitButton.disabled = true;\r\n setStatus(\"Submitting profile...\");\r\n try {\r\n const response = await fetch(endpoint, {\r\n method: \"POST\",\r\n credentials: \"same-origin\",\r\n body: payload\r\n });\r\n const result = await response.json().catch(() => ({}));\r\n if (!response.ok || !result.ok) throw new Error(result.message || \"Profile could not be saved.\");\r\n form.reset();\r\n styleInputs.forEach((input) => input.disabled = false);\r\n setStatus(\"Profile submitted. Thank you.\", \"success\");\r\n } catch (err) {\r\n setStatus(err.message || \"Profile could not be saved.\", \"error\");\r\n } finally {\r\n submitButton.disabled = false;\r\n }\r\n }\r\n\r\n styleInputs.forEach((input) => input.addEventListener(\"change\", enforceStyleLimit));\r\n form.addEventListener(\"input\", () => {\r\n clearFieldErrors();\r\n setStatus(\"\");\r\n });\r\n form.addEventListener(\"change\", () => {\r\n clearFieldErrors();\r\n setStatus(\"\");\r\n });\r\n form.addEventListener(\"submit\", submitProfile);\r\n })();\r\n <\/script>\r\n<\/body>\r\n<\/html>\r\n","protected":false},"excerpt":{"rendered":"<p>Tutor Profile Form Tutor Profile Your Details NLG email address Tutoring Style Pick exactly 3 key words or phrases you would use to describe your tutoring style. Confidence-building Patient Structured Exam-focused Encouraging Clear and methodical Engaging Fun Discussion-led Creative Interactive High expectations Real-world connections Approachable Practical Profile Information Write a short paragraph you would like…<\/p>\n","protected":false},"author":779,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_kad_post_transparent":"enable","_kad_post_title":"hide","_kad_post_layout":"fullwidth","_kad_post_sidebar_id":"","_kad_post_content_style":"unboxed","_kad_post_vertical_padding":"hide","_kad_post_feature":"hide","_kad_post_feature_position":"","_kad_post_header":true,"_kad_post_footer":true,"_kad_post_classname":"","footnotes":""},"class_list":["post-8475","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/nationallearninggroup.co.uk\/lms\/wp-json\/wp\/v2\/pages\/8475","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/nationallearninggroup.co.uk\/lms\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/nationallearninggroup.co.uk\/lms\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/nationallearninggroup.co.uk\/lms\/wp-json\/wp\/v2\/users\/779"}],"replies":[{"embeddable":true,"href":"https:\/\/nationallearninggroup.co.uk\/lms\/wp-json\/wp\/v2\/comments?post=8475"}],"version-history":[{"count":5,"href":"https:\/\/nationallearninggroup.co.uk\/lms\/wp-json\/wp\/v2\/pages\/8475\/revisions"}],"predecessor-version":[{"id":8482,"href":"https:\/\/nationallearninggroup.co.uk\/lms\/wp-json\/wp\/v2\/pages\/8475\/revisions\/8482"}],"wp:attachment":[{"href":"https:\/\/nationallearninggroup.co.uk\/lms\/wp-json\/wp\/v2\/media?parent=8475"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":8475,"date":"2026-07-26T20:44:00","date_gmt":"2026-07-26T20:44:00","guid":{"rendered":"https:\/\/nationallearninggroup.co.uk\/lms\/?page_id=8475"},"modified":"2026-07-26T20:52:15","modified_gmt":"2026-07-26T20:52:15","slug":"make-your-tutor-profile","status":"publish","type":"page","link":"https:\/\/nationallearninggroup.co.uk\/lms\/make-your-tutor-profile\/","title":{"rendered":"Make Your Tutor Profile"},"content":{"rendered":"\r\n\r\n\r\n\r\n \r\n \r\n Tutor Profile Form<\/title>\r\n <link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n <link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\r\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Poppins:wght@600;700&family=Nunito+Sans:wght@400;600;700&display=swap\" rel=\"stylesheet\">\r\n <style>\r\n :root {\r\n --blue: #2caae2;\r\n --deep: #305261;\r\n --ink: #213f4d;\r\n --line: #cdd9e0;\r\n --soft: #f5f8fa;\r\n --warn: #fff8d8;\r\n --bad: #8f2a34;\r\n }\r\n * { box-sizing: border-box; }\r\n body { margin: 0; background: var(--soft); color: var(--ink); font-family: \"Nunito Sans\", Arial, sans-serif; }\r\n main { width: min(94vw, 920px); margin: 24px auto; }\r\n form { background: #fff; border: 1px solid var(--line); border-radius: 8px; padding: 24px; }\r\n h1, h2, label, button { font-family: \"Poppins\", Arial, sans-serif; letter-spacing: 0; }\r\n h1 { margin: 0 0 8px; color: var(--deep); font-size: 1.7rem; }\r\n h2 { margin: 0 0 12px; color: var(--deep); font-size: 1.05rem; }\r\n p { margin: 8px 0; line-height: 1.55; }\r\n .helper { color: #526d78; margin-bottom: 18px; }\r\n .section { border-top: 1px solid var(--line); margin-top: 20px; padding-top: 18px; }\r\n .grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }\r\n .field { display: grid; gap: 6px; margin: 12px 0; }\r\n #email-field { grid-column: 1 \/ -1; }\r\n label { font-size: 0.92rem; font-weight: 700; color: var(--deep); }\r\n input, textarea {\r\n width: 100%; border: 1px solid var(--line); border-radius: 8px; padding: 11px 12px;\r\n font: 600 1rem \"Nunito Sans\", Arial, sans-serif; color: var(--ink); background: #fff;\r\n }\r\n textarea { min-height: 132px; resize: vertical; }\r\n input:focus, textarea:focus { outline: 3px solid rgba(44, 170, 226, 0.22); border-color: var(--blue); }\r\n .keyword-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }\r\n .keyword { display: flex; align-items: flex-start; gap: 8px; border: 1px solid var(--line); border-radius: 8px; padding: 9px 10px; font-weight: 700; cursor: pointer; min-height: 44px; }\r\n .keyword input { width: 16px; height: 16px; margin-top: 3px; padding: 0; }\r\n .note { background: var(--warn); border: 1px solid #eadc9a; border-radius: 8px; padding: 12px; }\r\n .requirements { margin: 10px 0 0; padding-left: 20px; }\r\n .requirements li { margin: 6px 0; }\r\n .actions { display: flex; align-items: center; gap: 12px; margin-top: 20px; flex-wrap: wrap; }\r\n button { min-height: 44px; border: 1px solid var(--blue); border-radius: 8px; background: var(--blue); color: #fff; padding: 10px 16px; cursor: pointer; font-weight: 700; }\r\n button:disabled { opacity: 0.6; cursor: not-allowed; }\r\n .status { min-height: 1.4em; margin: 0; font-weight: 700; }\r\n .status.error { color: var(--bad); }\r\n .status.success { color: #176b50; }\r\n .error-message { min-height: 1.2em; color: var(--bad); font-weight: 700; font-size: 0.92rem; }\r\n .field-error input,\r\n .field-error textarea,\r\n .field-error.keyword-section,\r\n .field-error.photo-section { border-color: var(--bad); }\r\n .field-error-flash { animation: nlg-error-flash 1s ease; }\r\n @keyframes nlg-error-flash {\r\n 0%, 100% { box-shadow: none; }\r\n 20%, 70% { box-shadow: 0 0 0 4px rgba(143, 42, 52, 0.18); }\r\n }\r\n @media (max-width: 760px) {\r\n form { padding: 18px; }\r\n .grid, .keyword-grid { grid-template-columns: 1fr; }\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n <main>\r\n <form id=\"profile-form\" novalidate>\r\n <h1>Tutor Profile<\/h1>\r\n\r\n <div class=\"section\">\r\n <h2>Your Details<\/h2>\r\n <div class=\"grid\">\r\n <div class=\"field\" id=\"email-field\">\r\n <label for=\"nlg-email\">NLG email address<\/label>\r\n <input id=\"nlg-email\" name=\"nlgEmail\" type=\"email\" autocomplete=\"email\" placeholder=\"name@thenationallearninggroup.co.uk\">\r\n <div class=\"error-message\" id=\"email-error\" aria-live=\"polite\"><\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"section keyword-section\" id=\"style-field\">\r\n <h2>Tutoring Style<\/h2>\r\n <p>Pick exactly 3 key words or phrases you would use to describe your tutoring style.<\/p>\r\n <div class=\"keyword-grid\" id=\"keyword-grid\">\r\n <label class=\"keyword\"><input type=\"checkbox\" name=\"style\" value=\"Confidence-building\"><span>Confidence-building<\/span><\/label>\r\n <label class=\"keyword\"><input type=\"checkbox\" name=\"style\" value=\"Patient\"><span>Patient<\/span><\/label>\r\n <label class=\"keyword\"><input type=\"checkbox\" name=\"style\" value=\"Structured\"><span>Structured<\/span><\/label>\r\n <label class=\"keyword\"><input type=\"checkbox\" name=\"style\" value=\"Exam-focused\"><span>Exam-focused<\/span><\/label>\r\n <label class=\"keyword\"><input type=\"checkbox\" name=\"style\" value=\"Encouraging\"><span>Encouraging<\/span><\/label>\r\n <label class=\"keyword\"><input type=\"checkbox\" name=\"style\" value=\"Clear and methodical\"><span>Clear and methodical<\/span><\/label>\r\n <label class=\"keyword\"><input type=\"checkbox\" name=\"style\" value=\"Engaging\"><span>Engaging<\/span><\/label>\r\n <label class=\"keyword\"><input type=\"checkbox\" name=\"style\" value=\"Fun\"><span>Fun<\/span><\/label>\r\n <label class=\"keyword\"><input type=\"checkbox\" name=\"style\" value=\"Discussion-led\"><span>Discussion-led<\/span><\/label>\r\n <label class=\"keyword\"><input type=\"checkbox\" name=\"style\" value=\"Creative\"><span>Creative<\/span><\/label>\r\n <label class=\"keyword\"><input type=\"checkbox\" name=\"style\" value=\"Interactive\"><span>Interactive<\/span><\/label>\r\n <label class=\"keyword\"><input type=\"checkbox\" name=\"style\" value=\"High expectations\"><span>High expectations<\/span><\/label>\r\n <label class=\"keyword\"><input type=\"checkbox\" name=\"style\" value=\"Real-world connections\"><span>Real-world connections<\/span><\/label>\r\n <label class=\"keyword\"><input type=\"checkbox\" name=\"style\" value=\"Approachable\"><span>Approachable<\/span><\/label>\r\n <label class=\"keyword\"><input type=\"checkbox\" name=\"style\" value=\"Practical\"><span>Practical<\/span><\/label>\r\n <\/div>\r\n <div class=\"error-message\" id=\"style-error\" aria-live=\"polite\"><\/div>\r\n <\/div>\r\n\r\n <div class=\"section\">\r\n <h2>Profile Information<\/h2>\r\n <div class=\"field\" id=\"text-field\">\r\n <label for=\"short-extra\">Write a short paragraph you would like parents and students to know<\/label>\r\n <textarea id=\"short-extra\" name=\"shortExtra\" maxlength=\"1200\" placeholder=\"For example, your approach to helping students build confidence, how you adapt lessons, or the kind of progress you enjoy supporting.\"><\/textarea>\r\n <div class=\"error-message\" id=\"text-error\" aria-live=\"polite\"><\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"section photo-section\" id=\"photo-field\">\r\n <h2>Photo Upload<\/h2>\r\n <div class=\"note\">\r\n <p><strong>Photos will be rejected if they do not meet these requirements.<\/strong><\/p>\r\n <ul class=\"requirements\">\r\n <li>Use a current, professional headshot. No selfies or casual social media-style photos.<\/li>\r\n <li>Your face should be clearly visible, with good lighting and a neutral or professional background.<\/li>\r\n <li>Do not use filters, heavy editing, sunglasses, distracting backgrounds, or group photos.<\/li>\r\n <li>Upload a high-resolution JPEG or PNG, at least 500 x 625 pixels and under 6MB.<\/li>\r\n <li>The photo must be a 4:5 aspect ratio portrait image and suitable for parents and students to see before their first lesson.<\/li>\r\n <\/ul>\r\n <\/div>\r\n <div class=\"field\">\r\n <label for=\"photo\">Upload your tutor photo<\/label>\r\n <input id=\"photo\" name=\"photo\" type=\"file\">\r\n <div class=\"error-message\" id=\"photo-error\" aria-live=\"polite\"><\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"actions\">\r\n <button id=\"submit-button\" type=\"submit\">Submit profile<\/button>\r\n <p class=\"status\" id=\"status\" aria-live=\"polite\"><\/p>\r\n <\/div>\r\n <\/form>\r\n <\/main>\r\n\r\n <script>\r\n (function () {\r\n const form = document.getElementById(\"profile-form\");\r\n const status = document.getElementById(\"status\");\r\n const submitButton = document.getElementById(\"submit-button\");\r\n const styleInputs = Array.from(form.querySelectorAll('input[name=\"style\"]'));\r\n const nlgEmailDomain = \"@thenationallearninggroup.co.uk\";\r\n const fields = {\r\n email: { wrap: document.getElementById(\"email-field\"), error: document.getElementById(\"email-error\"), focus: document.getElementById(\"nlg-email\") },\r\n style: { wrap: document.getElementById(\"style-field\"), error: document.getElementById(\"style-error\"), focus: document.getElementById(\"keyword-grid\") },\r\n text: { wrap: document.getElementById(\"text-field\"), error: document.getElementById(\"text-error\"), focus: document.getElementById(\"short-extra\") },\r\n photo: { wrap: document.getElementById(\"photo-field\"), error: document.getElementById(\"photo-error\"), focus: document.getElementById(\"photo\") }\r\n };\r\n\r\n function setStatus(message, kind) {\r\n status.textContent = message;\r\n status.className = \"status\" + (kind ? \" \" + kind : \"\");\r\n }\r\n\r\n function selectedStyles() {\r\n return styleInputs.filter((input) => input.checked).map((input) => input.value);\r\n }\r\n\r\n function clearFieldErrors() {\r\n Object.values(fields).forEach((field) => {\r\n field.wrap.classList.remove(\"field-error\", \"field-error-flash\");\r\n field.error.textContent = \"\";\r\n });\r\n }\r\n\r\n function showFieldError(field, message) {\r\n clearFieldErrors();\r\n field.error.textContent = message;\r\n field.wrap.classList.add(\"field-error\", \"field-error-flash\");\r\n field.wrap.scrollIntoView({ behavior: \"smooth\", block: \"center\" });\r\n if (field.focus && typeof field.focus.focus === \"function\") {\r\n setTimeout(() => field.focus.focus({ preventScroll: true }), 250);\r\n }\r\n setTimeout(() => field.wrap.classList.remove(\"field-error-flash\"), 1000);\r\n setStatus(message, \"error\");\r\n }\r\n\r\n function enforceStyleLimit() {\r\n const count = selectedStyles().length;\r\n styleInputs.forEach((input) => {\r\n input.disabled = !input.checked && count >= 3;\r\n });\r\n if (count === 3) fields.style.error.textContent = \"\";\r\n }\r\n\r\n async function validatePhoto(file) {\r\n if (!file) return { field: fields.photo, message: \"Please upload your tutor photo.\" };\r\n return null;\r\n }\r\n\r\n async function firstValidationError() {\r\n const email = document.getElementById(\"nlg-email\").value.trim().toLowerCase();\r\n if (!email || !email.endsWith(nlgEmailDomain) || email.length <= nlgEmailDomain.length) {\r\n return { field: fields.email, message: \"Enter your NLG email address with the correct ending: \" + nlgEmailDomain };\r\n }\r\n if (selectedStyles().length !== 3) {\r\n return { field: fields.style, message: \"Please choose exactly 3 tutoring style keywords.\" };\r\n }\r\n if (document.getElementById(\"short-extra\").value.trim().length < 50) {\r\n return { field: fields.text, message: \"Please write at least 50 characters for parents and students.\" };\r\n }\r\n return validatePhoto(document.getElementById(\"photo\").files[0]);\r\n }\r\n\r\n async function submitProfile(event) {\r\n event.preventDefault();\r\n const validationError = await firstValidationError();\r\n if (validationError) {\r\n showFieldError(validationError.field, validationError.message);\r\n return;\r\n }\r\n clearFieldErrors();\r\n\r\n const config = window.nlgTutorProfilePublic || {};\r\n const endpoint = config.saveEndpoint || \"\/lms\/wp-json\/nlg-tutor-profile-public\/v1\/profiles\";\r\n const payload = new FormData();\r\n payload.append(\"source\", \"standalone-wordpress\");\r\n payload.append(\"fullName\", \"\");\r\n payload.append(\"nlgEmail\", document.getElementById(\"nlg-email\").value.trim());\r\n payload.append(\"shortExtra\", document.getElementById(\"short-extra\").value.trim());\r\n selectedStyles().forEach((style) => payload.append(\"style[]\", style));\r\n payload.append(\"photo\", document.getElementById(\"photo\").files[0]);\r\n\r\n submitButton.disabled = true;\r\n setStatus(\"Submitting profile...\");\r\n try {\r\n const response = await fetch(endpoint, {\r\n method: \"POST\",\r\n credentials: \"same-origin\",\r\n body: payload\r\n });\r\n const result = await response.json().catch(() => ({}));\r\n if (!response.ok || !result.ok) throw new Error(result.message || \"Profile could not be saved.\");\r\n form.reset();\r\n styleInputs.forEach((input) => input.disabled = false);\r\n setStatus(\"Profile submitted. Thank you.\", \"success\");\r\n } catch (err) {\r\n setStatus(err.message || \"Profile could not be saved.\", \"error\");\r\n } finally {\r\n submitButton.disabled = false;\r\n }\r\n }\r\n\r\n styleInputs.forEach((input) => input.addEventListener(\"change\", enforceStyleLimit));\r\n form.addEventListener(\"input\", () => {\r\n clearFieldErrors();\r\n setStatus(\"\");\r\n });\r\n form.addEventListener(\"change\", () => {\r\n clearFieldErrors();\r\n setStatus(\"\");\r\n });\r\n form.addEventListener(\"submit\", submitProfile);\r\n })();\r\n <\/script>\r\n<\/body>\r\n<\/html>\r\n","protected":false},"excerpt":{"rendered":"<p>Tutor Profile Form Tutor Profile Your Details NLG email address Tutoring Style Pick exactly 3 key words or phrases you would use to describe your tutoring style. Confidence-building Patient Structured Exam-focused Encouraging Clear and methodical Engaging Fun Discussion-led Creative Interactive High expectations Real-world connections Approachable Practical Profile Information Write a short paragraph you would like…<\/p>\n","protected":false},"author":779,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_kad_post_transparent":"enable","_kad_post_title":"hide","_kad_post_layout":"fullwidth","_kad_post_sidebar_id":"","_kad_post_content_style":"unboxed","_kad_post_vertical_padding":"hide","_kad_post_feature":"hide","_kad_post_feature_position":"","_kad_post_header":true,"_kad_post_footer":true,"_kad_post_classname":"","footnotes":""},"class_list":["post-8475","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/nationallearninggroup.co.uk\/lms\/wp-json\/wp\/v2\/pages\/8475","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/nationallearninggroup.co.uk\/lms\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/nationallearninggroup.co.uk\/lms\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/nationallearninggroup.co.uk\/lms\/wp-json\/wp\/v2\/users\/779"}],"replies":[{"embeddable":true,"href":"https:\/\/nationallearninggroup.co.uk\/lms\/wp-json\/wp\/v2\/comments?post=8475"}],"version-history":[{"count":5,"href":"https:\/\/nationallearninggroup.co.uk\/lms\/wp-json\/wp\/v2\/pages\/8475\/revisions"}],"predecessor-version":[{"id":8482,"href":"https:\/\/nationallearninggroup.co.uk\/lms\/wp-json\/wp\/v2\/pages\/8475\/revisions\/8482"}],"wp:attachment":[{"href":"https:\/\/nationallearninggroup.co.uk\/lms\/wp-json\/wp\/v2\/media?parent=8475"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}