Add a Contact Form

Let people get in touch with a contact form. Easy instructions to create a form and integrate it with Formspree.io

by Ryan Feigenbaum

Add a Contact Form

Share

Let people get in touch with you by adding a contact form to your site. Because Ghost doesn't provide this functionality by default, you need to use some kind of form service. These steps assume you're using a Formspree account (the base level is free), but it's possible to use other services, too.

  1. Create a form on Formspree and copy the custom URL to be used in step three.
  2. Create a new page for the contact form. You can call it whatever you want.
  3. Add an HTML card to the new page, using the code below. Remember to add the custom URL you copied from Formspree.
<form class="sm-form"
  action="https://formspree.io/YOUR-CODE-HERE"
  method="POST"
>
  <label class="sm-form__label" for="name">Name</label>
  <input class="sm-form__input" id="name" name="name" type="text" required autofocus>
  
  <label class="sm-form__label" for="email">Email</label>
  <input class="sm-form__input" id="email" name="email" type="text"  required>
 
  <label class="sm-form__label" for="message">Message</label>
  <textarea class="sm-form__input" id="message" name="message" required></textarea>
  
  <button class="sm-button" type="submit" value="Send">Send</button>
</form>

Learn more about integrating Formspree into Ghost