Using FormBeep with Webflow#

Webflow has native form handling, but FormBeep can send Webflow forms straight to your WhatsApp.

1. Add webflow.io to Allowed Domains#

  1. While testing in the Webflow Designer or via staging, your domain will be something like my-project.webflow.io.
  2. Add my-project.webflow.io to your FormBeep Dashboard → Domains.
  3. If you publish to a custom domain (e.g. example.com), add that to your dashboard as well.

2. Add Embed Script via Custom Code#

  1. In your Webflow project, go to Site SettingsCustom Code.
  2. Scroll down to the Footer Code (Before </body> tag) snippet box.
  3. Paste your FormBeep script:
<script src="https://api.formbeep.com/v1/s/formbeep.js"
        data-api-key="YOUR_API_KEY"></script>
  1. Save Changes.

(Alternatively, you can place this script on a specific page by going to that Page’s Settings in the Designer, scrolling down to Custom Code, and pasting it in the “Before </body> tag” box.)

3. Webflow’s Native Form Action behavior#

When a user submits a native Webflow form, Webflow tries to handle it using their own AJAX logic. You don’t want this! Because FormBeep’s script automatically intercepts standard forms, you must tell Webflow not to hijack the submission.

To do this, select your Form Block in the Designer, go to the Settings gear icon, and fill out:

  • Action: /
  • Method: POST

This bypasses Webflow’s native AJAX submit, allowing FormBeep’s script to take over, process the data, and ping your WhatsApp instantly.