Framework Guide

Jekyll Integration

Add a contact form to a Jekyll site, on GitHub Pages or any host

Jekyll outputs static HTML, and GitHub Pages builds it in safe mode, so you can't process a form with a plugin. To add a contact form without a backend, put your key in _config.yml, save the include below as _includes/contact-form.html, and add {% include contact-form.html %} to any page. The form posts straight to https://api.staticforms.dev/submit and each submission arrives in your inbox. It works on the free plan.

1. Add your API key to the site config

_config.yml

2. Create the include

_includes/contact-form.html

redirectTo is optional and must be a full URL; absolute_url builds one from the url and baseurl in your config. Remove it to show a plain confirmation instead. The visitor's email field becomes the reply-to address on the notification.

3. Add a contact page

contact.html

Create a thank-you.html page with permalink: /thank-you/ if you kept the redirect.

Public repositories

The key ends up in your published HTML whether or not the repository is public. It cannot read your submissions or sign in to your dashboard.

4. Push and test

Commit and push. GitHub Pages rebuilds the site, and other hosts work the same way after jekyll build. Send a test message from /contact/ and check your inbox. A longer walkthrough with styling and a fetch-based version is in the Jekyll contact form tutorial, and plain GitHub Pages sites without Jekyll are covered in the GitHub Pages guide.

FAQ

Does this work on the free plan?

Yes. The snippet only uses Free plan features: 250 submissions a month, 1 form endpoint, email delivery, the built-in spam filter, a honeypot field and reCAPTCHA v2. No credit card is needed.

How do I keep spam out?

Every submission is checked by the built-in spam filter on every plan. The snippet adds a hidden honeypot field (any field whose name contains "honeypot"); bots fill it in and those submissions are dropped. reCAPTCHA v2 is available on Free. Cloudflare Turnstile, hCaptcha, ALTCHA and reCAPTCHA v3 are available from the Starter plan.

Is it safe to put the API key in my HTML?

Yes. The form API key is meant to be public. It cannot read your submissions or sign in to your dashboard. From the Starter plan you can also restrict submissions to your own domains.

Does this need a Jekyll plugin?

No. The include is plain HTML and Liquid, so it builds in GitHub Pages safe mode. The browser posts the form directly to Static Forms.