How to add a contact form on a static site
There are A LOT of external tools for sending emails and messages. I have just chosen one that I thought was easy to use and setup, getform. Small disclaimer: You only get one form in the free plan.
Fill out the form to create an endpoint for you contact form. You can give it any name, i.e. "Portfolio Contact Form" and choose your timezone.
After creating the endpoint, they will give you a URL which you will use inside of your HTML form. I have created a simple form (with Bootstrap) that you can plug directly into your page.
⚠️ Replace your endpoint inside of the action
<form action="INSERT_YOUR_GETFORM_ENDPOINT_HERE" method="POST">
<div class="form-group">
<input type="text" name="name" class="form-control" placeholder="Name" required=true>
</div>
<div class="form-group">
<input type="email" name="email" class="form-control" placeholder="Email" required=true>
</div>
<div class="form-group">
<textarea type="text" name="message" class="form-control" placeholder="Message..." required=true></textarea>
</div>
<button type="submit" class="btn btn-primary w-100">Send</button>
</form>
You can now receive submissions from your form. You should see them arriving in your getform dashboard.
You won't want to come to the getform dashboard and check if someone has sent you a message. Geform can notify you with an email each time a submission comes in.
Click on the lightning bolt icon to pull up the automation options.
In the options on the top right, you should see "Send an email notification". Enter your email, click submit, and you're all set! 🚀