How do I add the form?

Use a Custom HTML block with a ` ` pointing at FormLoom.

WordPress (static) contact form

Verified against WordPress (static) Simply Static / WP2Static · June 2026

If you export WordPress to static HTML (Simply Static, WP2Static), the PHP form handlers stop working. FormLoom replaces them: paste an HTML form block (or use a plugin's custom-HTML widget) that POSTs to FormLoom.

Customize in the generator Full WordPress (static) guide

The code

Add a Custom HTML block with a `<form method="POST">` to FormLoom. The exported static site POSTs directly to the hosted backend.

Plain HTML (no JavaScript)

contact.html

<form action="https://formloom.vercel.app/api/submit/YOUR_ACCESS_KEY" method="POST">
  <label>
    Name
    <input type="text" name="name" required />
  </label>
  <label>
    Email
    <input type="email" name="email" required />
  </label>
  <label>
    Message
    <textarea name="message" required placeholder="How can we help?"></textarea>
  </label>
  <!-- honeypot: bots fill this, humans don't see it -->
  <input type="checkbox" name="botcheck" style="display:none" tabindex="-1" autocomplete="off" />
  <button type="submit">Send</button>
</form>

AJAX fetch (vanilla JS)

contact.html

<form id="contact-form">
  <label>
    Name
    <input type="text" name="name" required />
  </label>
  <label>
    Email
    <input type="email" name="email" required />
  </label>
  <label>
    Message
    <textarea name="message" required placeholder="How can we help?"></textarea>
  </label>
  <!-- honeypot: bots fill this, humans don't see it -->
  <input type="checkbox" name="botcheck" style="display:none" tabindex="-1" autocomplete="off" />
  <button type="submit">Send</button>
</form>

<script>
const form = document.getElementById("contact-form");
form.addEventListener("submit", async (e) => {
  e.preventDefault();
  const res = await fetch("https://formloom.vercel.app/api/submit/YOUR_ACCESS_KEY", {
    method: "POST",
    headers: { "Content-Type": "application/json", Accept: "application/json" },
    body: JSON.stringify(Object.fromEntries(new FormData(form))),
  });
  const data = await res.json();
  if (data.success) {
    form.reset();
    alert("Thanks — we got your message.");
  } else {
    alert(data.message || "Something went wrong.");
  }
});
</script>

@formloom/client (typed SDK)

submit.ts

// npm i @formloom/client
import { createForm } from "@formloom/client";

type Contact = {
  name: string;
  email: string;
  message: string;
};

const form = createForm<Contact>("YOUR_ACCESS_KEY");

// End-to-end typed: TS errors if you send the wrong shape.
const { success, message } = await form.submit({
  name: form.name.value,
  email: form.email.value,
  message: form.message.value,
});

Gotchas

Static export means no `admin-ajax.php` — your form must POST to an external backend.
Use a Custom HTML block rather than a PHP-based form plugin.

Form types for WordPress (static)

Tailored field sets and code for common use cases.

WordPress (static) contact form WordPress (static) newsletter form WordPress (static) waitlist form WordPress (static) feedback form WordPress (static) support ticket form WordPress (static) lead capture form WordPress (static) rsvp form WordPress (static) job application form WordPress (static) survey form WordPress (static) bug report form

FAQ

They rely on PHP/admin-ajax, which isn't present in a static export. FormLoom gives you a backend the static HTML can POST to.