formtoDashboard

Wix

Where the code goes

Add an Embed HTML (custom code) element and paste the generated HTML. Wix runs embedded HTML in a frame served from its own domain.

The origin to allow

Because of that frame, the request's origin is Wix's frame domain, not yours. Leave allowed origins empty on this project, or allow the domain shown under rejected origins in the dashboard after a test post.

Thank-you handling

The script shows the thank-you message inside the frame. A success redirect opens inside the frame too, so the in-place message usually reads better.

File uploads

A file field works inside the frame; the upload goes straight to formto.

The code

Generated from the form’s fields (plain HTML with a small script). Replace YOUR_FORM_ID with your form’s public id, then restyle it; keep the field names and the hidden _gotcha honeypot.

<form id="formto-form" action="https://api.formto.io/f/YOUR_FORM_ID" method="post" enctype="application/x-www-form-urlencoded">
  <h2>Contact</h2>
  <p>
    <label for="formto-name">Name</label>
    <input type="text" id="formto-name" name="name" required>
  </p>
  <p>
    <label for="formto-email">Email</label>
    <input type="email" id="formto-email" name="email" autocomplete="email" required>
  </p>
  <p>
    <label for="formto-message">Message</label>
    <textarea id="formto-message" name="message" rows="5" required></textarea>
  </p>
  <!-- Spam trap: people never see or fill this field. -->
  <input type="text" name="_gotcha" tabindex="-1" autocomplete="off" aria-hidden="true" style="position:absolute;left:-10000px">
  <button type="submit">Send</button>
  <p data-formto-status role="status" aria-live="polite"></p>
</form>
<script>
  // Progressive enhancement: without JavaScript the form above posts natively.
  ;(function () {
    var form = document.getElementById('formto-form')
    if (!form || !window.fetch || !window.FormData) return
    form.addEventListener('submit', function (event) {
      event.preventDefault()
      var status = form.querySelector('[data-formto-status]')
      var button = form.querySelector('button[type=submit]')
      button.disabled = true
      fetch(form.action, { method: 'POST', body: new FormData(form), headers: { Accept: 'application/json' } })
        .then(function (res) {
          return res.json().then(function (body) {
            if (!res.ok || !body.success) throw new Error(body.error || 'Something went wrong. Please try again.')
            form.reset()
            status.textContent = 'Thanks, we got it.'
          })
        })
        .catch(function (err) {
          status.textContent = err.message || 'Could not send. Please try again.'
        })
        .finally(function () {
          button.disabled = false
        })
    })
  })()
</script>

Other platforms: Plain HTML, React, Next.js, Astro, WordPress, Squarespace, Webflow, Framer, Shopify.