Eleventy

Eleventy outputs static HTML, so a plain <form> can post to your endpoint. The Public Key goes in a global data file so every template can use it.

1. Save your Public Key

Copy the Public Key from the Endpoint form’s General tab. Create a global data file inside your input directory’s _data folder:

_data/site.json

{
  "url": "https://example.com",
  "surveyowlKey": "YOUR_FORM_PUBLIC_KEY"
}

Anything in _data is available to every template as a variable named after the file—here, site.

2. Create the contact page

This example uses Nunjucks, but the {{ }} tags work the same in Liquid.

contact.njk

---
layout: base.njk
title: Contact
permalink: /contact/
---

<h1>Contact us</h1>

<form action="https://api.surveyowl.co/v1/submit/{{ site.surveyowlKey }}" method="POST">
  <input type="hidden" name="redirect" value="{{ site.url }}/thank-you/" />

  <label for="name">Name</label>
  <input id="name" name="name" required />

  <label for="email">Email</label>
  <input id="email" name="email" type="email" required />

  <label for="message">Message</label>
  <textarea id="message" name="message" required></textarea>

  <button type="submit">Send message</button>
</form>

3. Create the thank-you page

thank-you.njk

---
layout: base.njk
title: Thank you
permalink: /thank-you/
---

<h1>Thanks — your message was sent.</h1>

Run npx @11ty/eleventy --serve, open /contact/, and send a test response. Confirm it appears in Submissions.

Good to know

Change layout: base.njk to the layout your site already uses.
While testing locally, the redirect points to site.url, so you will land on your live address. Temporarily set url to http://localhost:8080, or leave out the redirect field while you test.
To show a message without leaving the page, use the JavaScript example in your template.

Welcome

Hosted forms

Endpoint forms

Responses

Integrations

Build your form

Publish and share

Settings

Payments

Account and billing

1. Save your Public Key

2. Create the contact page

3. Create the thank-you page

Good to know

​1. Save your Public Key

​2. Create the contact page

​3. Create the thank-you page

​Good to know

1. Save your Public Key

2. Create the contact page

3. Create the thank-you page

Good to know