Während Heyflow eine schnelle und einfache Lösung anbietet, um deinen Clickflow 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 Clickflow ü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 Clickflow 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 Clickflow ein
Hol dir nun die URL deines Clickflows und füge sie in den IFrame-Code ein. Du erhältst deine Clickflow-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.
