How to add a contact form to GitHub Pages

PostMyForm — Sun, 26 Jul 2026 17:23:00 +0000

GitHub Pages is ideal for publishing fast, low-maintenance static websites, but it cannot process contact-form submissions on its own.

In this guide, we’ll add a working HTML contact form, connect it to a hosted form endpoint, restrict submissions to the correct GitHub Pages origin, and test the complete flow—without deploying a server or serverless function.

Add a working form without a backend

GitHub Pages publishes static HTML, CSS, and JavaScript. It does not provide application code that can receive and process a form submission.

PostMyForm supplies the hosted form endpoint while your website remains a normal GitHub Pages site.

1. Create the form in PostMyForm

Configure:

A recognizable form name.
The email address that should receive notifications.
The allowed origin for the GitHub Pages site.
An optional success redirect URL.

For a project site such as:

https://username.github.io/project-name/

Use the following allowed origin:

https://username.github.io

The project path is not part of the browser origin.

When the site uses a custom domain, enter the exact origin shown in the browser, such as:

https://www.example.com

2. Add the fields

Add the fields required by the contact form.

A typical contact form includes:

Name
Email
Message

Mark fields as required where appropriate.

3. Copy the generated form

Open the form detail page and copy the complete generated HTML.

A shortened example looks like this:

<form action="https://postmyform.com/f/your-endpoint-id" method="POST">
  <label for="name">Name</label>
  <input id="name" name="name" type="text" 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>

Use the complete snippet from the dashboard. It contains the unique endpoint and anti-spam controls required by your form.

4. Add the form to the repository

Paste the generated HTML into the page or template where the contact form should appear.

For a simple HTML site, this may be index.html or contact.html.

Commit and push the change to the publishing source configured for GitHub Pages. That source may be a repository branch or a GitHub Actions deployment workflow.

5. Confirm the published URL

Wait for the GitHub Pages deployment to finish and open the published page in a browser.

Confirm that:

The form is visible.
The page uses HTTPS.
The browser origin matches the allowed origin in PostMyForm.
The form action points to the generated PostMyForm endpoint.

6. Send a test submission

Submit the published form once.

A clean submission should appear in the PostMyForm dashboard and trigger an email notification attempt. The submission history records the notification result.

If a success redirect is configured, PostMyForm redirects the browser after processing the submission.

7. You now have a working contact form

You now have a working contact form on a static GitHub Pages site without maintaining a separate backend.

Before considering the setup complete, test the form from the published HTTPS URL and confirm that:

the submission appears in the PostMyForm dashboard,
the notification email arrives,
the configured success redirect works,
and the browser origin matches the allowed origin.

For common problems and additional details, see the full troubleshooting guide:

Review the complete GitHub Pages guide and troubleshooting steps

DEV Community: PostMyForm