{"id":1010,"date":"2026-01-24T20:09:22","date_gmt":"2026-01-24T20:09:22","guid":{"rendered":"https:\/\/menorcayachtbroker.com\/?page_id=1010"},"modified":"2026-01-25T00:17:15","modified_gmt":"2026-01-25T00:17:15","slug":"consent","status":"publish","type":"page","link":"https:\/\/menorcayachtbroker.com\/de\/consent\/","title":{"rendered":"Zustimmung Datenschutz"},"content":{"rendered":"<section class=\"bcm-consent-wrap\">\n  <div class=\"bcm-consent-card\">\n    <header class=\"bcm-consent-header\">\n      <h1>\n        Einwilligung: Infos &#038; Angebote von Boat Charter Menorca S.L.\n        <br \/>\n        <small>inklusive der Marken \u201eMenorca Yacht Broker\u201c und \u201eBar Italia\u201c<\/small>\n      <\/h1>\n      <p>\n        Wenn du m\u00f6chtest, senden wir dir gelegentlich Informationen zu Menorca,\n        spannenden Angeboten rund um Yachten, Charter &#038; Villen.\n        Du kannst dich jederzeit wieder abmelden.\n      <\/p>\n    <\/header>\n\n    <form id=\"bcmConsentForm\" class=\"bcm-consent-form\" novalidate action=\"\">\n      <div class=\"bcm-grid\">\n        <label>\n          <span>Vorname<\/span>\n          <input type=\"text\" name=\"firstName\" autocomplete=\"given-name\">\n        <\/label>\n\n        <label>\n          <span>Nachname<\/span>\n          <input type=\"text\" name=\"lastName\" autocomplete=\"family-name\">\n        <\/label>\n      <\/div>\n\n      <!-- EMAIL (was missing before) -->\n      <label>\n        <span>E-Mail *<\/span>\n        <input type=\"email\" name=\"email\" required autocomplete=\"email\">\n      <\/label>\n\n      <!-- PHONE (intl-tel-input) -->\n      <label>\n        <span>Handy Nummer *<\/span>\n        <input\n          type=\"text\"\n          id=\"phone\"\n          name=\"phone\"\n          required\n inputmode=\"tel\"\n          autocomplete=\"tel\"\n          placeholder=\"644 754 900\"\n        >\n      <\/label>\n\n      <label>\n        <span>Pr\u00e4ferierte Sprache<\/span>\n        <select name=\"language\">\n          <option value=\"de\">Deutsch<\/option>\n          <option value=\"en\">English<\/option>\n          <option value=\"es\">Espa\u00f1ol<\/option>\n          <option value=\"fr\">Fran\u00e7ais<\/option>\n          <option value=\"pt\">Portugu\u00eas<\/option>\n          <option value=\"it\">Italiano<\/option>\n        <\/select>\n      <\/label>\n\n      <!-- INTERESTS -->\n      <fieldset class=\"bcm-interests\">\n        <legend>Was interessiert dich? (gern Mehrfachauswahl)<\/legend>\n        <label><input type=\"checkbox\" name=\"interests\" value=\"Menorca\"> Menorca<\/label>\n        <label><input type=\"checkbox\" name=\"interests\" value=\"boatbuy\"> Bootskauf<\/label>\n        <label><input type=\"checkbox\" name=\"interests\" value=\"boatrent\"> Boot mieten<\/label>\n        <label><input type=\"checkbox\" name=\"interests\" value=\"villa\"> Unterkunft finden<\/label>\n      <\/fieldset>\n\n      <!-- CONSENT -->\n      <label class=\"bcm-checkbox\">\n        <input type=\"checkbox\" name=\"consent\" required>\n        <span>\n          Ich willige ein, Informationen &#038; Angebote von Boat Charter Menorca S.L.\n          per E-Mail und \u00fcber die von mir angegebene Telefonnummer\n          (z. B. WhatsApp \/ SMS \/ Telefon) zu erhalten.\n          Details in der\n          <a href=\"\/de\/privacy-policy\/\" target=\"_blank\" rel=\"noopener\">Datenschutzerkl\u00e4rung<\/a>.\n        <\/span>\n      <\/label>\n\n      <!-- HIDDEN META -->\n      <input type=\"hidden\" name=\"consentVersion\" value=\"v1-2026-01-24\">\n\n      <button type=\"submit\" class=\"bcm-btn\">Einwilligung senden<\/button>\n      <div id=\"bcmConsentStatus\" class=\"bcm-consent-status\" aria-live=\"polite\"><\/div>\n    <input type=\"hidden\" name=\"trp-form-language\" value=\"de\"\/><\/form>\n  <\/div>\n<\/section>\n\n<style>\n  .bcm-consent-wrap{padding:48px 16px}\n  .bcm-consent-card{max-width:720px;margin:0 auto;background:#fff;border-radius:16px;box-shadow:0 10px 30px rgba(0,0,0,.08)}\n  .bcm-consent-header{padding:24px}\n  .bcm-consent-header h1{margin:0 0 12px;font-size:28px;line-height:1.2}\n  .bcm-consent-header small{font-size:16px;font-weight:400}\n  .bcm-consent-form{padding:24px;display:grid;gap:16px}\n  .bcm-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}\n  @media(max-width:600px){.bcm-grid{grid-template-columns:1fr}}\n  label span{font-weight:600;font-size:14px;margin-bottom:6px;display:block}\n\n  input,select{\n    padding:12px;\n    border-radius:10px;\n    border:1px solid #ccc;\n    width:100%;\n    box-sizing:border-box;\n  }\n\n  .bcm-interests{border:1px solid #eee;border-radius:12px;padding:12px}\n  .bcm-interests legend{font-weight:600;margin-bottom:8px}\n  .bcm-interests label{display:block;margin-bottom:6px}\n\n  .bcm-checkbox{display:flex;gap:10px;background:#f5f5f5;padding:12px;border-radius:12px}\n  .bcm-checkbox input{width:18px;height:18px;margin-top:2px}\n  .bcm-btn{background:#0b3b5a;color:#fff;border:none;padding:14px;border-radius:12px;font-size:16px;font-weight:700;cursor:pointer}\n  .bcm-consent-status{font-size:14px}\n\n  \/* intl-tel-input full width *\/\n  .iti{width:100%}\n<\/style>\n\n<!-- intl-tel-input -->\n<link rel=\"stylesheet\"\n  href=\"https:\/\/cdn.jsdelivr.net\/npm\/intl-tel-input@18.2.1\/build\/css\/intlTelInput.css\">\n<script src=\"https:\/\/cdn.jsdelivr.net\/npm\/intl-tel-input@18.2.1\/build\/js\/intlTelInput.min.js\"><\/script>\n<script src=\"https:\/\/cdn.jsdelivr.net\/npm\/intl-tel-input@18.2.1\/build\/js\/utils.js\"><\/script>\n\n<script>\n(function(){\n  const form = document.getElementById('bcmConsentForm');\n  const status = document.getElementById('bcmConsentStatus');\n  const phoneInput = document.getElementById('phone');\n\n  const WEBHOOK_URL = \"https:\/\/hook.eu1.make.com\/3cv8by4oi1myx529c1nounf4ideq1xhk\";\n\n  \/\/ init phone plugin (all countries)\n  const iti = window.intlTelInput(phoneInput, {\n    initialCountry: \"es\",\n    separateDialCode: true,\n    nationalMode: false,\n    autoPlaceholder: \"polite\",\n    preferredCountries: [\"es\",\"de\",\"fr\",\"it\",\"gb\",\"nl\",\"us\"],\n    utilsScript: \"https:\/\/cdn.jsdelivr.net\/npm\/intl-tel-input@18.2.1\/build\/js\/utils.js\"\n  });\n\n  \/\/ --- Fix for Chrome autofill putting +34644754900 into the input ---\n  \/\/ When input becomes a full E.164 number, parse it and set it properly in the widget.\n  function normalizeAutofillPhone(){\n    const raw = (phoneInput.value || \"\").trim();\n    if (!raw) return;\n\n    \/\/ If it looks like E.164 (+digits), let intl-tel-input parse and format it.\n    if (\/^\\+\\d{8,15}$\/.test(raw.replace(\/\\s+\/g,\"\"))) {\n      iti.setNumber(raw.replace(\/\\s+\/g,\"\"));\n      \/\/ After setNumber, the plugin typically formats input to national display with dial code separated\n      \/\/ (depending on config). This corrects the \"double country code\" UX issue.\n    }\n  }\n\n  \/\/ Run on common autofill moments\n  window.addEventListener(\"load\", () => setTimeout(normalizeAutofillPhone, 300));\n  phoneInput.addEventListener(\"change\", normalizeAutofillPhone);\n  phoneInput.addEventListener(\"blur\", normalizeAutofillPhone);\n  phoneInput.addEventListener(\"input\", () => {\n    \/\/ some autofills trigger \"input\" with full number\n    if ((phoneInput.value || \"\").trim().startsWith(\"+\")) normalizeAutofillPhone();\n  });\n\n  function interestsToText(values){\n    const map = {\n      Menorca: \"Menorca\",\n      boatbuy: \"Bootskauf\",\n      boatrent: \"Boot mieten\",\n      villa: \"Unterkunft finden\"\n    };\n    return values.map(v => map[v] || v).join(\", \");\n  }\n\n  \/\/ Simple client-side validation (we use novalidate so we can show clear messages)\n  function validate(){\n    const email = (form.email.value || \"\").trim();\n    if (!email) return \"Bitte E-Mail angeben.\";\n\n    if (!form.consent.checked) return \"Bitte best\u00e4tige die Einwilligung.\";\n\n    normalizeAutofillPhone();\n\n    if (!iti.isValidNumber()) return \"Bitte eine g\u00fcltige Handynummer eingeben.\";\n    return \"\";\n  }\n\n  form.addEventListener('submit', async (e) => {\n    e.preventDefault();\n    status.textContent = \"\";\n\n    const err = validate();\n    if (err) {\n      status.textContent = err;\n      return;\n    }\n\n    const interestsArr = Array.from(\n      form.querySelectorAll('input[name=\"interests\"]:checked')\n    ).map(i => i.value);\n\n    const cd = iti.getSelectedCountryData();\n\n    const payload = {\n      firstName: (form.firstName.value || \"\").trim(),\n      lastName: (form.lastName.value || \"\").trim(),\n      email: (form.email.value || \"\").trim().toLowerCase(),\n      language: form.language.value,\n\n      interests: interestsArr,\n      interests_text: interestsToText(interestsArr),\n\n      phone_input: (phoneInput.value || \"\").trim(),\n      phone_e164: iti.getNumber(),        \/\/ +34644754900 (clean)\n      phone_country_iso2: cd.iso2 || \"\",\n      phone_dial_code: cd.dialCode || \"\",\n\n      consent: \"yes\",\n      consentChannels: \"email,whatsapp,sms,call\",  \/\/ combined consent (as per text)\n      consentVersion: form.consentVersion.value,\n      submittedAt: new Date().toISOString(),\n      pageUrl: window.location.href\n    };\n\n    try {\n      const res = await fetch(WEBHOOK_URL, {\n        method: \"POST\",\n        headers: { \"Content-Type\": \"application\/json\" },\n        body: JSON.stringify(payload)\n      });\n\n      if (!res.ok) {\n        const txt = await res.text().catch(() => \"\");\n        throw new Error(\"Make webhook error: \" + res.status + \" \" + txt);\n      }\n\n      status.textContent = \"Danke! Deine Einwilligung wurde gespeichert.\";\n      form.reset();\n      iti.setCountry(\"es\");\n    } catch (error) {\n      console.error(error);\n      status.textContent = \"Fehler beim Senden: \" + (error?.message || \"\");\n    }\n  });\n})();\n<\/script>\n\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>","protected":false},"excerpt":{"rendered":"<p>Einwilligung: Infos &#038; Angebote von Boat Charter Menorca S.L. inklusive der Marken \u201eMenorca Yacht Broker\u201c und \u201eBar Italia\u201c Wenn du m\u00f6chtest, senden wir dir gelegentlich Informationen zu Menorca, spannenden Angeboten rund um Yachten, Charter &#038; Villen. Du kannst dich jederzeit wieder abmelden. Vorname Nachname E-Mail * Handy Nummer * Pr\u00e4ferierte Sprache DeutschEnglishEspa\u00f1olFran\u00e7aisPortugu\u00easItaliano Was interessiert dich?&#8230;<\/p>","protected":false},"author":5,"featured_media":0,"parent":0,"menu_order":21,"comment_status":"closed","ping_status":"closed","template":"","meta":{"postBodyCss":"","postBodyMargin":[],"postBodyPadding":[],"postBodyBackground":{"backgroundType":"classic","gradient":""},"_kad_post_transparent":"","_kad_post_title":"","_kad_post_layout":"","_kad_post_sidebar_id":"","_kad_post_content_style":"","_kad_post_vertical_padding":"","_kad_post_feature":"","_kad_post_feature_position":"","_kad_post_header":false,"_kad_post_footer":false,"_kad_post_classname":"","footnotes":""},"class_list":["post-1010","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/menorcayachtbroker.com\/de\/wp-json\/wp\/v2\/pages\/1010","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/menorcayachtbroker.com\/de\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/menorcayachtbroker.com\/de\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/menorcayachtbroker.com\/de\/wp-json\/wp\/v2\/users\/5"}],"replies":[{"embeddable":true,"href":"https:\/\/menorcayachtbroker.com\/de\/wp-json\/wp\/v2\/comments?post=1010"}],"version-history":[{"count":31,"href":"https:\/\/menorcayachtbroker.com\/de\/wp-json\/wp\/v2\/pages\/1010\/revisions"}],"predecessor-version":[{"id":1055,"href":"https:\/\/menorcayachtbroker.com\/de\/wp-json\/wp\/v2\/pages\/1010\/revisions\/1055"}],"wp:attachment":[{"href":"https:\/\/menorcayachtbroker.com\/de\/wp-json\/wp\/v2\/media?parent=1010"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}