iframe-Einbettung

Den embedCode in die HTML-Seite einfügen – mit optionaler automatischer Höhenanpassung.

Den embedCode aus der Session-Erstellung in die HTML-Seite einfügen.

Einfache Einbettung

<iframe
  src="https://app.de/embed/form?s=SESSION-ID"
  width="100%"
  height="800"
  style="border:0;border-radius:12px;overflow:hidden"
  loading="lazy"
  referrerpolicy="strict-origin-when-cross-origin"
></iframe>

Mit automatischer Höhenanpassung (empfohlen)

Das Formular sendet automatisch seine aktuelle Höhe per postMessage. Das Script passt den iframe dynamisch an, damit kein Scrollbalken entsteht.

<iframe
  id="anolink-embed-form"
  src="https://app.de/embed/form?s=SESSION-ID"
  width="100%"
  height="800"
  style="border:0;border-radius:12px;overflow:hidden"
  loading="lazy"
  referrerpolicy="strict-origin-when-cross-origin"
></iframe>
<script>
  window.addEventListener("message", function (event) {
    if (!event || !event.data || event.data.type !== "anolink:embed:height")
      return;
    var iframe = document.getElementById("anolink-embed-form");
    if (!iframe) return;
    iframe.style.height =
      Math.max(560, Number(event.data.height || 0)) + "px";
  });
</script>

Wie es funktioniert

  1. Das eingebettete Formular misst seine eigene Höhe
  2. Per window.postMessage wird ein Event mit type: "anolink:embed:height" gesendet
  3. Das Script auf der Eltern-Seite empfängt das Event und passt iframe.style.height an
  4. Mindesthöhe ist 560px, damit das Formular nie zu klein wird
Session erstellenTemplate laden