You have a Unbounce page set up, and you now want to integrate your Heyflow?
Easy. Just follow these few steps.
π‘ Before we start, make sure to publish your flow before you embed it into your website. Only after you've published your flow is the embed script generated.
π If you want to learn more about embedding and customization options, click here.
Setup
Step 1: Insert Head Code
Navigate to your landing page in the Classic Builder and click the Javascripts button on the bottom left-hand corner of the Classic Builder:
An open box will open up. You can now insert your Script Name and choose Head as your placement.
Now, copy the first code snippet and insert it. Click Done to save the Head Code.
π You can learn more about adding Custom JavaScript in Unbounce here.
Step 2: Insert Body code
Almost there.
Now, create or update the page you want your heyflow to appear on. You can use the Custom HTML feature within the Classic Builder to embed the heyflow into your page.
Switch back to Heyflow and copy the second code snippet and paste the code into the newly created HTML block.
Click Save Code. Stretch or move the Custom HTML box to be the correct size and save your page. You can see your heyflow when clicking on preview in the top right corner.
Tada π Your heyflow is now embedded into your Unbounce page.
β Custom widgets appear in the Classic Builder, just in Preview mode and the final published page.
π You can learn more about Custom HTML in Unbounce here.