Work-email hints on Webflow forms

Webflow collects form submissions for you, so none of your server code sits in the submit path. That gives two parts: an inline hint in the page (publishable key), and classification of submissions on a server or automation tool (secret key).

1. Create a publishable key

In the dashboard, create a publishable key (ibe_pub_…) and add your site’s origins, for example https://www.example.com and your staging origin such as https://your-site.webflow.io. It will only work from those origins, and it gets a reduced response with low limits. That’s all a hint needs.

2. Add the hint script

In Page settings → Custom code → Before </body> tag (or site-wide), add the script below. Set your email field’s Name to email in the form settings, or change the selector.

<script>
(function () {
  var input = document.querySelector('form input[name="email"]');
  if (!input) return;
  var hint = document.createElement('div');
  hint.setAttribute('role', 'status');
  hint.setAttribute('aria-live', 'polite');
  hint.style.cssText = 'font-size:14px;margin-top:6px;color:#b91c1c';
  input.insertAdjacentElement('afterend', hint);

  input.addEventListener('blur', async function () {
    hint.textContent = '';
    var email = input.value.trim();
    if (email.indexOf('@') < 1) return;
    try {
      var res = await fetch('https://api.isbusinessemail.com/v1/check', {
        method: 'POST',
        headers: { 'Authorization': 'Bearer ibe_pub_…', 'Content-Type': 'application/json' },
        body: JSON.stringify({ email: email }),
        signal: AbortSignal.timeout(1500)
      });
      if (!res.ok) return;
      var r = await res.json();
      if (r.did_you_mean) {
        hint.textContent = 'Did you mean ' + r.did_you_mean + '?';
      } else if (r.recommendation === 'block') {
        hint.textContent = 'Please use your work email so we can set up your company account.';
      }
    } catch (e) { /* stay quiet on errors */ }
  });
})();
</script>

This guides people; it doesn’t enforce anything. Anyone can still submit.

3. Classify submissions

To act on every submission, send Webflow form submissions to a server or automation tool, then call the API with your secret key:

• Automation: trigger on new Webflow form submissions in Zapier, Make or n8n, call /v1/check, and route the lead.
• Your server: subscribe to form-submission webhooks through Webflow’s site settings or developer APIs and handle them like the Express example.

Typical routing: allow → CRM and sales notification, review → review list, block → nurture or ignore.

Tips

• Keep the publishable key’s allowed origins tight: production plus staging only.
• Don’t show the hint while the user is still typing; blur is enough.
• Test with personal@test.isbusinessemail.com and gmial.com-style typos.

Official docs: Webflow University and Webflow Developers. See also: Signup form guide.