# Webflow Integration

Webflow is a web-based drag and drop tool for building responsive websites. You can use Getform to handle forms on your Webflow sites easily.

# Webflow Form Setup

  1. Copy your unique endpoint URL.
  2. Choose form element in Webflow and select Form Settings. Paste your unique Getform endpoint URL into action field and set your method as POST.
  3. Publish your website and send your first form submission using Getform.
  1. Copy your unique endpoint URL.
  2. Paste the endpoint URL into Webflow's action field in the form element’s settings in the Designer.
webflow-form-using-getform

  1. Copy-paste the code below into Project Settings > Custom Code > Footer Code.

  2. Publish your website and send your first form submission using Getform.

<!-- Project Settings > Custom Code > Footer Code -->
<script type="text/javascript">
  $('form[action^="https://getform.io/f/{your-form-endpoint}"]').each(function (i, el) {
    form = $(el);
    form.submit(function (e) {
      e.preventDefault();
      form = $(e.target);
      action = form.attr("action");
      $.ajax({
        url: action,
        method: "POST",
        data: form.serialize(),
        dataType: "json",
        success: function () {
          parent = $(form.parent());
          parent.children("form").css("display", "none");
          parent.children(".w-form-done").css("display", "block");
        },
        error: function () {
          parent.find(".w-form-fail").css("display", "block");
        },
      });
    });
  });
</script>

← Next.js →