I recently moved my blog from WordPress to Jekyll after experimenting with Jekyll as a documentation platform for the past several months. Jekyll also loads more quickly.
Erlier I was using php for form submission. But now in jekyll we do not have support for php in github. We need to handle any thing with only java script. When I was searching for a contact form submission to a mail, I found some interesting service website to do the same from java script. It is nothing but formspree io.
While coming to the details of formspree io, it sends the submitted form as a text to your mensioned email.You don't even have to register. Just send your form to the URL and it will forward it to your email. No PHP, Javascript or sign up required — perfect for static sites!
Setting it up is easy and free
Lets take below example of code.
<form action="//formspree.io/your@email.com">
Email: <input type="text" name="name"><br>
Name: <input type="text" name="email"><br>
Subject: <input type="text" name="subject"><br>
Message: <textarea name="message" cols="40" rows="5"></textarea>
<input type="submit" value="Send Message">
</form>
1.Setup the HTML form
Change your form's action
-attribute to this and replace your@email.com with your own email.
http://formspree.io/myusername@gmail.com
2. Submit the form and confirm your email address
Go to your website and submit the form once. This will send you an email asking to confirm your email address, so that no one can start sending you spam from random websites.
3. All set, receive emails
From now on, when someone submits that form, formspree will forward you the data as email.
We can even use AJAX
You can use Formspree via AJAX. This even works cross-origin. The trick is to set the Accept
header to application/json
. If you're using jQuery this can be done like so:
$.ajax({
url: "//formspree.io/username@gmail.com",
method: "POST",
data: {message: "hello!"},
dataType: "json"
});