-
-
Save schlos/ecbba9831429ea5e33a6c34f8de6966a to your computer and use it in GitHub Desktop.
Jekyll Contact Form using Formspree
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!-- | |
After implementing this contact form make sure | |
1. you have defined "email: [email protected]" in _config.yml file. | |
2. you verify your form on formspree.io. | |
--> | |
<form class="wj-contact" action="https://formspree.io/{{site.email}}" method="POST"> | |
<input type="text" name="email" placeholder="Email Address"> | |
<textarea type="text" name="content" rows="10" placeholder="Message"></textarea> | |
<input type="hidden" name="_next" value="<REDIRECTION LINK> "> | |
<input type="hidden" name="_subject" value="New Contact Form Submission"> | |
<input type="text" name="_gotcha" style="display:none"> | |
<input type="submit" value="Submit"> | |
</form> | |
<style> | |
form.wj-contact input[type="text"], form.wj-contact textarea[type="text"] { | |
width: 100%; | |
vertical-align: middle; | |
margin-top: 0.25em; | |
margin-bottom: 0.5em; | |
padding: 0.75em; | |
font-family: monospace, sans-serif; | |
font-weight: lighter; | |
border-style: solid; | |
border-color: #444; | |
outline-color: #2e83e6; | |
border-width: 1px; | |
border-radius: 3px; | |
transition: box-shadow .2s ease; | |
} | |
form.wj-contact input[type="submit"] { | |
outline: none; | |
color: white; | |
background-color: #2e83e6; | |
border-radius: 3px; | |
padding: 0.5em; | |
margin: 0.25em 0 0 0; | |
border: 1px solid transparent; | |
height: auto; | |
} | |
</style> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment