Send Emails From an HTML Contact Form Using FormSubmit
Are you looking for a simple way to send emails through a contact form on your web page? Okay, now you have reached the solution! I’ll explain a super simple way to do that here, only using HTML.
First, I’m going to make a contact form with a few input fields for getting the name, email, and message and also with a submit button. Then I’ll show how actually send emails to your email address after pressing the send button and redirecting to a thank you page. Here I’m using FormSubmit to do this. It essentially allows us to connect our form to their form endpoint and they will email out the submissions for us.
Okay, let’s make it!
The below code snippet will essentially create a form for us with an action that uses the form submit endpoint. You can just use your email address where you should receive emails from users instead of “firstname.lastname@example.org” in the below code. Also, you can change the other input fields according to your need, even though I’m just using them to get the name and email.
If you need to redirect to a thank you page, you can use this below code line inside your form after creating another page for it (Here, the page is thanks.html).
<input type="hidden" name="_next" value="https://yourdomain.co/thanks.html">
You can refer to the FormSubmit documentation to customize the email format and add many more features to your contact form.
The first time when you are going to submit the form, it will trigger an email requesting confirmation. The message will appear like this.
Note: Make sure to open this page through a web server. Because FormSubmit will not work in pages browsed as HTML files.
TADAA! You have done the work. Isn’t it so cool?😎
If you learned something new from this article or if you have any suggestions, please leave a comment. I love to hear from you.🧡