Static form collection

Forms

Collect entries from static HTML forms, keep visitors on the same page after submit, and review every entry from the site workspace.

Add one attribute to collect entries.

StaticX Forms works with normal HTML forms. Add data-staticx-form, publish the site, then open the site workspace and use the Forms tab as the submission inbox.

Automatic collection

Use this when one page has one form. StaticX creates the collection name from the page path, such as /contact.html to contact.

Named collection

Use data-staticx-form-id when several pages should send entries to the same collection, such as contacts or newsletter.

Automatic page form.

Good for contact pages, quote pages, and simple landing pages where each page should have its own inbox.

<form data-staticx-form>
  <label for="contact-name">Name</label>
  <input id="contact-name" name="name" required>

  <label for="contact-email">Email</label>
  <input id="contact-email" type="email" name="email" required>

  <label for="contact-message">Message</label>
  <textarea id="contact-message" name="message"></textarea>

  <button type="submit">Send</button>
</form>

Named form collection.

Good for shared contact forms, newsletter forms, campaign forms, and repeated footer forms.

<form
  data-staticx-form
  data-staticx-form-id="contacts"
  data-staticx-success-message="Thanks, we received your message."
>
  <label for="shared-contact-name">Name</label>
  <input id="shared-contact-name" name="name" required>

  <label for="shared-contact-email">Email</label>
  <input id="shared-contact-email" type="email" name="email" required>

  <label for="shared-contact-message">Message</label>
  <textarea id="shared-contact-message" name="message"></textarea>

  <button type="submit">Send</button>
</form>

What StaticX handles for you.

During upload or deploy

StaticX finds forms with data-staticx-form, adds the correct submit action, adds a hidden spam field, and includes the small Forms script once per page.

After a visitor submits

With JavaScript, the visitor stays on the page and sees a thank-you message. Without JavaScript, the form still submits and returns to the page.

Optional redirect.

StaticX does not require a thank-you page. Add a redirect only when you want one.

<form
  data-staticx-form
  data-staticx-form-id="contact"
  data-staticx-redirect="/thank-you.html"
>
  ...
</form>

End-to-end check.

  1. Add the attribute. Put data-staticx-form on an existing HTML form.
  2. Publish the site. Upload files, import a URL, or run your normal deploy.
  3. Open the site workspace. Use the Forms tab to confirm the collection appears.
  4. Submit a test entry. The form should show the same-page thank-you message.
  5. Open the inbox. Click the form collection and confirm the entry data is visible.

AI agent instruction

Use this when an agent is editing a site that contains forms.

Copy this into your coding agent when the site should use StaticX Forms instead of a custom backend.

If the site includes an HTML form that should send entries to StaticX:

1. Add data-staticx-form to the <form> element.
2. Use data-staticx-form-id="contacts" only when multiple pages should share the same collection.
3. Give every input, textarea, and select a stable name attribute.
4. Keep the form as normal HTML. Do not wire it to a custom backend endpoint.
5. Optional attributes:
   - data-staticx-success-message="Thanks, we received your message."
   - data-staticx-error-message="Something went wrong. Please try again."
   - data-staticx-redirect="/thank-you.html"
6. Do not manually inject the StaticX script or submit action. StaticX adds the action, honeypot, and same-page submit script during upload or deploy.
7. After deployment, submit one test entry and confirm the collection appears in the site Forms tab.