How do I embed a Typeform into Webflow as a full page or widget?

Published on
September 22, 2023

To embed a Typeform into Webflow as either a full page or a widget, you can follow these steps:

Embedding as a Full Page:

  1. Open your Typeform and go to the "Share" section.

  2. Click on the "Embed" option.

  3. In the popup window, select the "Full page embed" option.

  4. Customize the form appearance and behavior according to your preference.

  5. Copy the provided code snippet.

    ```html

    \`\`\`
  6. In your Webflow project, open the page where you want to embed the Typeform.

  7. Drag and drop an Embed element onto your page.

  8. Paste the code snippet into the Embed element's code field.

  9. Adjust the dimensions of the Embed element to fill the page if necessary.

Embedding as a Widget:

  1. Open your Typeform and go to the "Share" section.

  2. Click on the "Embed" option.

  3. In the popup window, select the "Widget" option.

  4. Customize the widget's appearance and behavior as desired.

  5. Copy the provided code snippet.

    ```html

    ```

  6. In your Webflow project, open the page or section where you want to add the Typeform widget.

  7. Drag and drop an Embed element onto your page or section.

  8. Paste the code snippet into the Embed element's code field.

  9. Adjust the dimensions of the Embed element to fit the widget if needed.

By following these steps, you can seamlessly integrate a Typeform into your Webflow website either as a full-page form or as a widget. This allows you to collect data and engage with your visitors in a convenient and interactive manner.

Additional Questions:

  1. How can I customize the appearance of the embedded Typeform in Webflow?
  2. Can I use Typeform integration with the CMS collections in Webflow?
  3. Are there any limitations or considerations when embedding Typeform into Webflow?