How To Add A Contact Form To Your Website
In this post, I’ll show you how to add a contact form to your UpDog site, like this one:
In order to start receiving messages from your site’s visitors, you’ll need to add an HTML form. The minimum required code to set this up is:
<form method='post'> <textarea name='message'></textarea> <button type='submit'>Submit</button> </form>
The two most important parts of the above code are:
which tells UpDog to process a form request instead of loading a file from your Dropbox folder.
Every form input on your site with a
name attribute, will be collected and formatted
into a table before arriving in your inbox.
You can have as many form inputs as you like.
Confirming a Successful Form Submission
By default, visitors who submit the contact form will be redirected back to the page with the contact form.
If instead, you’d like to redirect to a thank you or confirmation page, add a
hidden input with the name
<input type='hidden' name='redirect' value='/thanks.html'>
The Complete Code
<!-- index.html --> <h1>An Example Contact Form</h1> <form method='post'> <label>Your Email</label> <input required type='email' name='email' firstname.lastname@example.org'> <label>Your Message</label> <textarea required name='message'></textarea><br> <input type='hidden' value='/thanks.html' name='redirect'> <button type='submit'>Submit</button> </form>
<!-- thanks.html --> <h1>Thank You!</h1> <p>Your form was sent successfully.</p>
Questions? Contact us.