Dev Notes

Various Cheat Sheets and Resources by David Egan/Carawebs.

Jekyll Contact Forms Using Formspree


Forms, Jekyll
David Egan

Forms need somewhere to be submitted to, and form data needs to be processed.

For WordPress/PHP sites, this is pretty trivial. The form posts data to a PHP script, which takes certain actions - adds data to the database, sends email, etc.

If you’re embedding a form on a Static site (in this case Jekyll), you could create a PHP form processor provided that the server is running PHP. A simpler alternative would be to use a third party email based service like Formspree - which allows 1000 emails per month on the free tier.

Formspree Form Markup

This page is testing a Formspree contact form.

The form markup is as follows:

<form class="form-horizontal" action="//formspree.io/youremail@yourweb.com" method="POST">
<fieldset>
  <div class="form-group">
    <input type="text" name="name" placeholder="Your Name">
  </div>
  <div class="form-group">
    <input type="email" name="_replyto" placeholder="Your Email">
  </div>
  <div class="form-group">
    <textarea class="form-control" id="textarea" name="message">Your Message</textarea>
  </div>
  <div class="form-group">
    <input type="submit" value="Send">
  </div>
    <input type="text" name="_gotcha" style="display:none" />
</fieldset>
</form>

Once you submit the form for the first time, you’ll get a confirmation email to prevent spam submissions from random sites.

This page is testing the Formspree form.

Contact Form

Get in touch!


comments powered by Disqus