Zum Hauptinhalt springen
iFrame Einbettung (Veraltet)
Heyflow avatar
Verfasst von Heyflow
Vor über einem Monat aktualisiert

❗ Wichtig

Die iFrame Einbettung wird ab Ende 24 nicht mehr funktionieren. Wenn du deinen Flow in deine Website einbetten möchtest, nutze unsere Heyflow Einbettungsfunktion.

Während Heyflow eine schnelle und einfache Lösung anbietet, um deinen Flow in deine Website einzubinden, indem du einen automatisch generierten HTML-Code in deinen Website-Code kopierst, funktioniert dies manchmal nicht.

Der Grund, die Bandbreite der verschiedenen Website-Builder und deren technische Infrastruktur variiert und damit auch die Wahrscheinlichkeit, dass der automatisch generierte Code nicht so funktioniert, wie er soll.

Um dies zu umgehen, kannst du dein Flow über einen eigenen HTML-Code namens iFrame einbinden.

🔎 Wenn du mehr über Heyflows Einbettungsmöglichkeiten wissen möchtest, klicke hier.


Einrichtung

Website Builder

Wenn du mit einem Website-Builder wie Instapages, WordPress oder Alternativen arbeitest, wähle einen HTML-Block und platziere ihn dort, wo dein Flow später angezeigt werden soll.

IFrame

Kopiere den folgenden Code innerhalb des HTML-Blocks

<iframe src="XXXX" width="100%" height="700" border="0px" style="border:none;"></iframe>

Füge deinen Flow ein

Hol dir nun die URL deines Flows und füge sie in den IFrame-Code ein. Du erhältst deine Flow-URL, indem du einfach auf den Pfeil rechts neben dem Publizieren-Button klickst und den Link kopierst.

Füge ihn an der Stelle ein, wo die XXXX im vorherigen Codeschnipsel sind.

❗ Da dieser IFrame Code speziell angefertigt wurde, passt er sich nicht automatisch an die Screengröße innerhalb deines Flows an. Daher ist es ratsam, die Höhe im iFrame Code an die Screengröße deines Flows anzupassen.

Dies betrifft nur Screens, die höher sind als die voreingestellten 700 Pixel, der iFrame passt sich trotzdem an, wenn die Screen-Höhe unter dem eingestellten Wert liegt. Die perfekte Höhe musst du selbst finden. Die meisten Flows funktionieren mit einer Höhe von 700 Pixeln wie im iFrame Code vorgeschlagen.

Hat dies deine Frage beantwortet?