> ## Content Index
> Fetch the complete content index at: https://www.ectobuilder.com/llms.txt
> Use this file to discover other available public pages before exploring further.

# How to Add a Contact Form to Your Ghost Site
- URL: https://www.ectobuilder.com/blog/add-contact-form-to-ghost/
- Published: 2026-10-10T11:58:54.000Z
- Updated: 2026-10-19T15:13:55.000Z
- Description: Ghost has no contact form of its own. Here is how to add one that emails every message to your inbox, step by step, in about ten minutes.
- Author: Michal Wlosik
- Tags: Guides, Local business

Ghost has no contact form of its own. You can write a Contact page, but there is nowhere for a visitor to type a message and send it. This guide shows you how to add a working contact form to a Ghost site built with Ectobuilder, step by step, and what to do if you use a different Ghost theme.

It takes about ten minutes. You need an Ectobuilder theme and an email address where messages should arrive. Nothing to install, no plugins, no server.

## How it works

Ectobuilder's contact sections send messages through [Web3Forms](https://web3forms.com/?ref=ectobuilder.com), a free form service. When a visitor presses Send, Web3Forms emails the message to you. You never see a database or a dashboard; messages simply land in your inbox.

You connect Web3Forms once per theme, with an access key. After that, every contact form in the theme works, on every page.

## Step 1: Get a free Web3Forms access key

1. Go to [web3forms.com](https://web3forms.com/?ref=ectobuilder.com).
2. Type the email address where you want to receive messages and click **Create Access Key**.
3. Open the email Web3Forms sends you and copy the access key. It is a long code that looks like `xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx`.

The key is not a password. It only tells Web3Forms which inbox to send messages to, so it is fine for it to sit inside your theme.

## Step 2: Add the key in Ectobuilder

1. Open your theme in the Ectobuilder editor.
2. Click **Settings** at the bottom left, then choose **Integrations**.
3. Open **Web3Forms** and paste the key into **Access key**. If you skipped step 1, the **Get a key** button takes you to Web3Forms.

![Ectobuilder Settings, Integrations tab, with the Web3Forms access key field open](https://aacjqjlqxtolhkbvhlbg.supabase.co/storage/v1/object/public/module-images/v2/ectobuilder-rx0a/1791632060546-pk3mfr.webp)

Settings → Integrations → Web3Forms. Paste your access key here.

The badge next to Web3Forms changes from *Not set up* once the key is saved. The key belongs to this theme only; if you build another theme, add it there too.

[![CTA Image](https://www.ectobuilder.com/content/images/size/w256h256/2026/06/Ecto_builder_logo_sq_small.png)](https://editor.ectobuilder.com/login?mode=signup&plan=free&ref=ectobuilder.com) 

****Want the form built into your theme?** Ectobuilder themes come with contact sections ready for Web3Forms: paste your key and the form works. Start free and only pay if you’re happy with the design.

[Try it free ](https://editor.ectobuilder.com/login?mode=signup&plan=free&ref=ectobuilder.com) 

## Step 3: Add a contact section to a page

If your theme already has a contact section (many Ectobuilder gallery themes do), skip to step 4\. Otherwise:

1. Pick the page you want the form on. A dedicated Contact template works well (see step 5), but a form at the bottom of the homepage is fine too.
2. Click **Add** at the top left and choose the **Contact** category.
3. Click a layout to add it. Some have the form next to your email, phone and address; others are just the form.

![The Add a section dialog in Ectobuilder showing the Contact category](https://www.ectobuilder.com/content/images/2026/10/add-contact-section.webp)

Add → Contact. Every layout here can send messages once Web3Forms is set up.

Double-click any text on the canvas to change it: the heading, the field labels, the button. Change the labels to suit your business. A [real estate agent](https://www.ectobuilder.com/blog/real-estate-agent-ghost-theme/) might ask "Which home, or what are you looking for?"; a dentist might ask "Are you a new patient?".

## Step 4: Check the section settings

Click the contact section to select it. The panel on the right has a **Contact form** group.

![A contact section selected in Ectobuilder, with the Contact form and Booking button settings on the right](https://www.ectobuilder.com/content/images/2026/10/re-contact-form-inspector.webp)

1: Contact form status. 2: Booking button.

1. **Contact form** tells you whether the form can send. If it says the form has nowhere to send messages yet, the key from step 2 is missing; the **Add a Web3Forms key** button opens the settings for you.
2. **Booking button** adds a "Book a time" button that opens your booking page. Leave it *Off* for a plain contact form. *With form* shows the button next to the form, and *Instead* replaces the form with the button. Booking is covered in [How to add online booking to your Ghost site](https://www.ectobuilder.com/blog/add-booking-to-ghost-site/).

## Step 5: Make a Contact page in Ghost (optional)

If you put the form on a custom template such as *Contact*, Ghost needs a page that uses it:

1. In Ghost Admin, go to **Pages** and click **New page**.
2. Title it *Contact*. You can leave the body empty; the template draws the page.
3. Open the page settings (the panel icon at the top right), set **Page URL** to `contact` and choose **Contact** under **Template**.
4. Publish the page. It now lives at `yoursite.com/contact/`.

Add it to your menu in Ghost Admin under **Settings → Navigation** if it isn't there already.

## Step 6: Deploy and send a test message

1. Click **Deploy** in Ectobuilder to put the updated theme on your Ghost site.
2. Open your live site in a private window, fill in the form and press Send.
3. Check your inbox, and your spam folder the first time. Mark the message as "not spam" so later ones arrive normally. The subject line reads "New message from" followed by your site's name.

The form only sends from your live site, not from the Ectobuilder editor or preview. That way testing the design never fills your inbox.

## Common problems

- **Nothing arrives.** Check spam first. Then check that the email you used on Web3Forms is the one you are reading, and that you deployed after adding the key.
- **The form says it isn't set up.** The key is missing or was added to a different theme. Open Settings → Integrations in the theme that is live on your site.
- **You want messages to go to someone else.** Create a new key on Web3Forms with their address and replace the old one. Deploy again.
- **Spam.** The form includes a hidden trap field that catches most bots, and Web3Forms filters more. If some still gets through, its dashboard has extra spam options.

## Using a different Ghost theme?

Any theme can have a contact form; it just takes code. The usual routes:

- **Embed a form service.** Tally, Google Forms, Typeform and similar tools give you an embed code. Paste it into an HTML card on a Ghost page. Easy, but the form looks like the service, not your site.
- **Write the HTML yourself.** A plain HTML form that posts to Web3Forms or Formspree, placed in an HTML card or a theme template. It matches your site, but you style it yourself.
- **Use a mailto link.** An "Email me" button that opens the visitor's email app. Simple, but many visitors don't have an email app set up on their computer.

Ectobuilder's contact sections do the second option for you, styled to your theme, with nothing to paste.