Wix - FormBnB Documentation

Why Use FormBnB with Wix

Wix has a built-in form app, but it’s limited:

Submission limits on free and lower plans
No webhook support
Limited integrations
No API access to submission data

FormBnB gives you:

Unlimited submissions on the free plan
Spam protection (honeypot, reCAPTCHA, Turnstile)
Webhooks and 21+ integrations
Full API access to all your data

Setup Steps

Create FormBnB Form

Create a new form in your FormBnB dashboard and copy the form slug.

Add HTML Embed

In the Wix editor, click Add → Embed Code → Embed HTML. Place it where you want the form.

Paste Form Code

Select “Code” mode and paste your FormBnB form HTML.

Resize and Publish

Resize the embed to fit your form, then publish.

Example Embed

Paste this into a Wix HTML embed:

<html>
<head>
<style>
  * { margin: 0; padding: 0; box-sizing: border-box; }
  body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; padding: 16px; }
  .field { margin-bottom: 14px; }
  .field label { display: block; font-size: 13px; margin-bottom: 4px; color: #333; }
  .field input, .field textarea {
    width: 100%; padding: 10px; border: 1px solid #ddd;
    border-radius: 6px; font-size: 14px; font-family: inherit;
  }
  .field textarea { resize: vertical; height: 80px; }
  button {
    width: 100%; padding: 12px; background: #000; color: #fff;
    border: none; border-radius: 6px; font-size: 14px; cursor: pointer;
  }
  button:hover { background: #333; }
  .status { margin-top: 10px; font-size: 13px; }
</style>
</head>
<body>
  <form id="formbnb-form">
    <input type="text" name="_gotcha" style="display:none">
    <div class="field">
      <label>Name</label>
      <input type="text" name="name" required>
    </div>
    <div class="field">
      <label>Email</label>
      <input type="email" name="email" required>
    </div>
    <div class="field">
      <label>Message</label>
      <textarea name="message" required></textarea>
    </div>
    <button type="submit">Send Message</button>
    <p class="status" id="status"></p>
  </form>

  <script>
    const form = document.getElementById('formbnb-form');
    const status = document.getElementById('status');

    form.addEventListener('submit', async (e) => {
      e.preventDefault();
      status.textContent = 'Sending...';
      const data = new FormData(form);

      try {
        const res = await fetch('https://api.formbnb.com/f/YOUR_ORG/YOUR_FORM', {
          method: 'POST',
          body: data,
          headers: { 'Accept': 'application/json' }
        });
        if (res.ok) {
          status.textContent = '✓ Message sent!';
          status.style.color = 'green';
          form.reset();
        } else {
          throw new Error();
        }
      } catch {
        status.textContent = 'Error. Please try again.';
        status.style.color = 'red';
      }
    });
  </script>
</body>
</html>

Wix HTML embeds run in an iframe, so you need a full HTML document with inline styles. Use AJAX submission to avoid the iframe navigating away on submit.

​Why Use FormBnB with Wix

​Setup Steps

​Example Embed

Why Use FormBnB with Wix

Setup Steps

Example Embed