Skip to content
Formwire
Framework guide

Add a contact form to a plain HTML site

A plain HTML form can post straight to Formwire, so a static page gets a working contact form without a server. This guide gives you the complete form, a thank-you redirect and spam protection in one copy.

3 min read

The form

Replace YOUR-ACCESS-KEY with the key from your form's page. The highlighted line is the one that points the form at Formwire.

contact.html 

            1
            <form action="https://formwire.io/submit" method="POST">
          
            2
              <input type="hidden" name="access_key" value="YOUR-ACCESS-KEY" />
          
            3
              <input type="hidden" name="redirect" value="https://example.com/thanks" />
          
            4
              <input type="text" name="fax" tabindex="-1" autocomplete="off" style="display:none" />
          
            5
             
          
            6
              <label for="name">Name</label>
          
            7
              <input id="name" type="text" name="name" required />
          
            8
             
          
            9
              <label for="email">Email</label>
          
            10
              <input id="email" type="email" name="email" required />
          
            11
             
          
            12
              <label for="message">Message</label>
          
            13
              <textarea id="message" name="message" rows="5" required></textarea>
          
            14
             
          
            15
              <button type="submit">Send</button>
          
            16
            </form>

Steps

  1. 1

    Create a form and copy its access key

    Sign up at app.formwire.com and create a form. Your sign-in address receives its submissions from the start. The access key is on the form's Settings tab, under General.

  2. 2

    Paste the form into your page

    Add the form above wherever the contact form should sit and replace YOUR-ACCESS-KEY with your key. The action attribute sends the POST to Formwire; the hidden access_key field tells Formwire which form it belongs to.

  3. 3

    Set the thank-you page

    Point the hidden redirect field at a page on your own site. After a successful submission the visitor lands there. Leave the field out and Formwire shows its own confirmation page instead.

  4. 4

    Send a test submission

    Open the page in a browser, fill the form in and send it. The submission appears in the form's inbox in the dashboard within a few seconds and the notification email follows, with Reply-To set to the address the visitor typed.

Notes for HTML

  • The fax field is the honeypot. It is a text input hidden with CSS, not type=hidden, because bots fill text inputs and skip hidden ones. Rename it in the form's settings if your form has a real fax field.
  • Any input with a name attribute is stored. Add a subject field, a phone field or a select, and they appear in the inbox and the email without any setup.
  • Keep the Content-Type the browser sends. Formwire accepts form posts, multipart (for file uploads) and JSON, so there is nothing to set.

Questions

Is the access key safe to put in client-side code?

Yes. The access key is a public ID that can only deliver submissions to the inbox you verified. It cannot read submissions or change settings, and you can rotate it from the form's settings if it is ever abused.

How does the form stop spam without a captcha?

The hidden fax field is a honeypot: a submission that fills it in goes to the Spam folder and nobody is emailed. A spam filter and rate limits also run on every form. Settings, Spam & security has the filter level, and on Pro, allowed domains.

Can I keep visitors on the page instead of redirecting?

Yes. Remove the redirect field and submit the form with fetch and an Accept: application/json header. The response is JSON with success and data.submission_id, and you show your own thank-you message. The React, Vue and Svelte guides do this.

Where do submissions go?

Each submission is stored in the form's inbox in the dashboard and emailed to you with Reply-To set to the visitor. On Pro it can also go to more recipients and to webhooks. The inbox exports to CSV and JSON.

Related guides

All guides