Skip to main content
Webflow Embedding

This article shows you how to embed your Heyflow flow on a site created and hosted by Webflow.

Heyflow avatar
Written by Heyflow
Updated over a week ago

You have a Webflow 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

Follow these steps to embed your Heyflow flow on your Webflow website. To embed our heyflow, we have to insert two scripts. One goes into the Head section, the other into the body.

Step 1: Insert Head Code

Let's first insert the Head script. In Webflow, you can either add a custom code in all the pages or one specific one. Find more information here.

To add custom code inside the <head> tag of an individual page:

  1. Open your site in the Designer
    ​

  2. Open Page settings for the page where you’d like to add your code
    ​

  3. Add your custom code to the Inside <head> tag section under Custom code
    ​

  4. Save your changes

Step 2: Insert Body Code

Now, create or update the page you want your heyflow to appear on.

  1. Go to a Collection item
    ​

  2. Open Rich text field options
    ​

  3. Select custom code
    ​

  4. Paste in your second embed code from Heyflow:
    ​

  5. Save, close and publish!

❗ Note: Custom code and scripts will only appear on the published site.

Did this answer your question?