StaticForms lets you submit HTML forms from your static website and saves them in a database that you can view in the dashboard. It's a great solution for contact forms, email list subscriptions, user surveys, and more.
To create a new form, start by clicking on the Create Form button the Dashboard.
There are three sections to configure your form but only the first one, the name, needs to be entered.
For now, let's leave the other two sections with their defaults...
...the user submitting the form will be and you will get an email notification every time a form is submitted.
Save and you'll see a confirmation that the form was created successfully.
This page has the link you'll need to set as the action. Click on it to copy it to the clipboard and we'll use it in a second when we create our form.
We'll create the simplest possible form for this example, one which captures an email address. You might use something like this for capturing leads or sign-ups for an email newsletter.
The code looks like this:
<form action="https://api.staticforms.co/submit?form=bWTn" method="post">
<label for="email">Email address</label>
<input name="email" type="email" id="email" />
Let's look at the key elements that make this work with StaticForms...
The first thing is
This specifies the URL that the form will be posted to when it is submitted. When you create a form you would replace the URL in this example with the one you copied from the confirmation page.
Next is the
<input name="email" type="email" />
The critical thing here is the
name attribute. StaticForms will store the value of any field that has a name, so make sure any fields you want to be stored have a name.
And that's it. If you drop this in to a HTML page it will just work. You'll have a fully fuctioning form. When someone submits it they will see a confirmation page and you will get a confirmation email containing the values of the form's fields, and you can view and download all subissions through the dashboard.
The next step would be to style the form to make it look a bit more attractive and to add validation, perhaps ensuring that a valid email address has been entered. You might also want to enable spam filtering.