Guide

Build a contact form with AI and make it actually work

AI tools write you a clean contact form in seconds. Then you paste it onto your site, hit send, and nothing happens. Here is the part the AI leaves out, and how to fix it in one line.

Why the AI form does nothing

Ask Claude, ChatGPT, or any model for a contact form and you get HTML like this:

<form action="REPLACE_WITH_YOUR_ENDPOINT" 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></textarea></label>
  <button type="submit">Send</button>
</form>

The markup is fine. The problem is the action. A form needs a backend to receive the submission, store it, and email you. The AI cannot give you that, because a backend is a running service, not a snippet. So the form posts to nowhere.

The one missing piece: an endpoint

You need a URL that accepts the submission. That is exactly what a form backend is. Create a form in your Scroll Theory Forms dashboard and you get an endpoint shaped like https://forms.scrolltheory.media/f/YOUR_FORM_ID.

Wire it up

Set the form's action to your endpoint. While you are there, add a hidden honeypot field so bots get filtered. That is the whole change:

<form action="https://forms.scrolltheory.media/f/YOUR_FORM_ID" 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></textarea></label>

  <!-- hidden spam honeypot: leave empty -->
  <input type="text" name="_gotcha" tabindex="-1" autocomplete="off"
         style="position:absolute;left:-9999px" aria-hidden="true">

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

No JavaScript, no API key in the page, no library. Submit the form and the entry shows up in your dashboard. Add a verified notification email and it also lands in your inbox.

Tell the AI to do it for you

You can skip the manual edit. Once you have your endpoint, give the model a follow-up like:

Set this form's action to https://forms.scrolltheory.media/f/YOUR_FORM_ID, keep method POST,
and add a hidden honeypot field named _gotcha for spam protection.

This works the same whether the AI gave you plain HTML, a React component, or a static-site template. The backend does not care what generated the form.

Want a custom success message?

By default the visitor sees a clean thank-you page, or you can redirect them to your own. If you would rather keep them on the page and show your own confirmation, post the form with JavaScript and read the JSON response. The AJAX section of the docs has a copy-paste example.

Get your endpoint

Create a form on the free plan and you get an endpoint to drop into any of the examples above. Every submission is stored and spam is quarantined rather than deleted, so a false positive never costs you a real lead.

Start free   Read the docs

More guides