Forem: Allen Jones

Best Google Forms Alternatives in 2026 (Free & Paid)

Allen Jones — Sun, 19 Apr 2026 17:49:37 +0000

If you have been using Google Forms and hit a wall, you are not alone.

Google Forms is free, and it works for basic surveys and internal data collection. But the moment you need custom branding, a professional-looking page, file uploads without a Google account, or a form that actually looks like your business, Google Forms starts showing its limits.

In this article, I will walk through the best Google
Forms alternatives in 2026, covering price, features, and which one is right for your use case.

Why People Look for Google Forms Alternatives

Here are the most common reasons people switch:

No custom branding. Every Google Form looks like
a Google Form. There is no way to make it look like your business, your event, or your brand.

File uploads require a Google account. If you add a file upload question to Google Forms, every respondent must sign in with a Google account to upload.
No Google account means no upload. For customers, event participants, and external contacts, that is a real problem.

No shareable landing page. Google Forms gives you a bare form on a white page. There is no hero section, no event details, no schedule, no photos.
It does not look like something worth filling in.

No HTML form backend. If you have a static site or a custom HTML form, you cannot point it at Google Forms. You are stuck using their builder only.

No instant email notifications. Google Forms sends submissions to a Google Sheet. You have to check the sheet to see new responses. There is no instant email notification to your inbox by default.

No self-hosting or open source option. Your data lives on Google's servers. If data ownership or GDPR compliance matters to you, Google Forms gives you no alternative.

If any of those hit home, keep reading.

The Best Google Forms Alternatives in 2026

1. Formgrid: Form Builder, Landing Page Templates,

and Form Backend in One Place

Best for: Event organizers, small businesses, and developers who want a form that looks professional and works without a backend.

What makes it different:

Most form tools pick a lane. Either a drag-and-drop form builder or a form backend for developers.
Formgrid does both. And it adds something neither Google Forms nor most alternatives offer: world-class landing page templates that wrap your form in a complete branded page.

Here is how it works:

Option A: Build a Form With a Landing Page Template

This is the most powerful thing Formgrid does that
Google Forms cannot.

Instead of getting a bare form on a white page, you choose a professionally designed landing page template, and your form is embedded inside it. The result is a complete branded page that you are proud to share anywhere.

Step 1: Sign Up and Create a Form

Head to formgrid.dev and
sign up with Google or your email address.
No credit card required.

Once logged in, you land on your dashboard.
Click New Form to get started.

Step 2: Open the Form Builder

After creating your form, you will be taken to the form details page. Click Open Builder to enter the form builder.

Step 3: Choose a Landing Page Template

This is where Formgrid goes beyond every other form tool on this list.

At the top of the builder, click Choose Template.
A template gallery opens, showing professionally designed landing page templates for different industries and use cases.

Templates available include:

Horse Ride Registration
Event Registration
Wedding RSVP
Photography Booking
Cleaning Service Booking
Personal Trainer Enquiry
Real Estate Enquiry
Plumbing Quote Request
Job Application
Blank Form

Select the template that matches your use case, and Formgrid immediately loads a complete, beautiful landing page with your form embedded inside it.

This is not a basic form on a white page. It is a full landing page that looks like a real business website.

Step 4: Edit the Template Inline

Every piece of text on the page is editable.
Click directly on any text element, and it becomes editable in place. Just like editing a document.

Click on the headline and change it to your event name.
Click on the date and update it. Click on the description and write something about your specific event or business.

Change the primary color using the color picker on the right panel and the button, accents, and highlights across the entire page update instantly to match your brand.

Step 5: Customize Your Form Fields

Switch to the Form Fields tab to add, remove, and reorder the fields in your form. Drag fields from the left sidebar onto the canvas. Every field is fully customizable with labels, placeholder text, required status, and validation rules.

Step 6: Share Your Form Link

When you are happy with the page, click Save Changes.
Go back to the form details page and copy your unique shareable link.

That link is a real, live landing page. Share it
anywhere: WhatsApp groups, email newsletters, Instagram bio, Facebook events, or embed it on your website.

Your participants or customers visit the link and see a complete branded page. Not a Google Form.

Step 7: Receive Instant Email Notifications

The moment someone submits the form, you receive an instant email notification with all their details formatted cleanly:

New Registration: Blue Ridge Endurance
Classic 2026
Rider Name: Sarah Johnson
Email: sarah@email.com
Phone: (555) 123-4567
Horse Name: Midnight Storm
Division: 50 Mile
Experience: Advanced

No checking a spreadsheet. No logging into a
dashboard. Every submission arrives in your inbox the moment it happens.

Step 8: View and Export Submissions

All submissions are stored in your Formgrid dashboard. Go to the Submissions tab to view, search, filter, and export your complete
list as a CSV file.

Option B: Use Your Existing HTML Form

If you already have an HTML form on your website, just point it at your Formgrid endpoint URL.
No other changes needed:

<form 
  action="https://formgrid.dev/api/f/your-form-id"
  method="POST"
>
  <input 
    type="text" 
    name="name" 
    placeholder="Your Name" 
    required 
  />
  <input 
    type="email" 
    name="email" 
    placeholder="Your Email" 
    required 
  />
  <textarea 
    name="message" 
    placeholder="Your Message"
  ></textarea>

  <input 
    type="text" 
    name="_honey" 
    style="display:none" 
  />

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

Formgrid handles receiving submissions, sending email notifications, and storing the data. Your form stays exactly as it is.

Key features:

World-class landing page templates for different industries
Inline text editing directly on the template
Drag and drop form builder with shareable link
HTML form endpoint for static sites
File uploads from anyone without a Google account
Instant email notifications
Submissions dashboard with CSV export
Spam protection with honeypot and rate limiting
Color picker for brand matching
Auto-responder emails on Business plan
Google Sheets native integration on Business plan
Webhooks on Business plan
Self-hostable with Docker
100% open source under MIT license
GDPR friendly with no tracking

Pricing:

Plan	Price	Submissions
Free	$0/month	25/month
Premium	$8/month	1,000/month
Business	$29/month	15,000/month

The bottom line: Google Forms is free but it
gives you a bare form that looks nothing like your
brand. Formgrid gives you a complete branded
landing page with your form embedded inside it,
instant email notifications, and a submissions
dashboard starting at $8 per month.

A horse riding club manager in San Diego found Formgrid through one of our blog posts. She was collecting ride registrations by email and manually scanning each one for rider and horse details.
She set up a Formgrid registration page, shared the link with her 200 riders, and now every registration arrives in her inbox formatted and
ready to act on. She upgraded to the Business plan at $29 per month without hesitation.

That is the difference between a Google Form and
a Formgrid landing page.

👉 formgrid.dev

2. Tally: Clean Free Form Builder

Best for: Non-technical users who want a clean, minimal form experience at no cost.

Tally is a popular alternative with a simple interface. Their free plan is genuinely useful, with unlimited forms and unlimited responses, though some features are locked behind the paid plan.

Key features:

Unlimited forms and responses on the free plan
Conditional logic
File uploads on paid plan
Notion integration
Embeddable forms

Pricing: Free plan available. Paid plan at
$29/month.

Drawback: No landing page templates. No HTML
form backend. No self-hosting. No instant email
notifications by default. No open source. Forms look like Tally forms, not like your brand.

3. Typeform: Best for Conversational Forms

Best for: Marketers who want a beautiful conversational form experience for surveys and lead generation.

Typeform pioneered the one question at a time conversational format. It produces high completion rates for surveys and research forms, and the design is genuinely beautiful.

Key features:

Conversational one question at a time format
Beautiful design templates
Logic jumps and conditional branching
Payment integrations
Data analysis

Pricing: Free plan limited to 10 responses
per month. Paid plans start at $25/month.

Drawback: Extremely limited free plan. No HTML
form backend. No landing page templates. No
self-hosting. No open source. Overkill and
overpriced for simple contact forms or event
registrations.

4. Jotform: Most Feature Rich

Best for: Businesses that need advanced form logic, payment integrations, and a full form management suite.

Jotform is the most feature-rich form builder on this list. Hundreds of templates, payment integrations, conditional logic, and approval
workflows, PDF generation, and e-signatures.
If you need advanced functionality, Jotform has it.

Key features:

10,000+ templates
Payment integrations
Conditional logic
PDF generation
E-signatures
Approval workflows
150+ integrations

Pricing: Free plan available with 100 monthly
responses. Paid plans start at $34/month.

Drawback: Expensive. No HTML form backend. No
self-hosting. No open source. Significant overkill
for most small businesses and event organizers'
use cases.

5. Web3Forms: Lightweight Form Backend

Best for: Developers who just need a simple form endpoint for their static site with no frills.

Web3Forms is a lightweight form backend service.
No form builder. No landing page templates.
Just an endpoint URL you point your HTML form at.

Key features:

Simple HTML form endpoint
Email notifications
Spam protection
Free plan available

Pricing: Free plan available. Pro plan at
$18/month.

Drawback: No form builder. No landing page
templates. No submission dashboard on the free
plan. No self-hosting. No file upload support
at a reasonable price.

Side-by-Side Comparison

Feature	Google Forms	Formgrid	Tally	Typeform	Jotform
Form builder	✅	✅	✅	✅	✅
Landing page templates	❌	✅	❌	❌	❌
Inline page editing	❌	✅	❌	❌	❌
HTML form endpoint	❌	✅	❌	❌	❌
File upload (no Google account)	❌	✅	✅ Paid	✅ Paid	✅ Paid
Instant email notifications	❌	✅	❌	✅	✅
Self-hostable	❌	✅	❌	❌	❌
Open source	❌	✅	❌	❌	❌
Custom branding	❌	✅	✅ Paid	✅ Paid	✅ Paid
Free submissions	Unlimited	25/month	Unlimited	10/month	100/month
Starting price	Free	$8/month	$29/month	$25/month	$34/month
GDPR friendly	⚠️	✅	⚠️	⚠️	⚠️

Which One Should You Use?

Use Formgrid if:

You want a form that looks like a real business page, not a Google Form.

You are an event organizer, photographer, cleaning service, or small business owner who shares form links with customers or participants.

You need file uploads from people without a Google account.

You want instant email notifications when someone submits.

You need a form backend for your existing HTML site.

You care about open source and self-hosting.

GDPR compliance matters to you.

Use Google Forms if:

You need something completely free with unlimited responses.

Branding and design do not matter.

You are collecting internal data or running simple surveys within your organization.

Use Tally if:

You want a clean, minimal form builder for free.

You are a Notion user.

You do not need landing page templates or
an HTML form backend.

Use Typeform if:

You need a conversational one-question-at-a-time
time experience.

You are running surveys or research forms where completion rate matters most.

Visual design is your top priority, and budget is not a constraint.

Use Jotform if:

You need advanced logic, payments, approval workflows, and PDF generation.

Budget is not a constraint.

You are building complex enterprise forms.

Final Thoughts

Google Forms is genuinely useful for basic internal surveys and simple data collection.
If that is all you need, it is hard to argue against free.

But the moment you need your form to look professional, collect file uploads from anyone without a Google account, and send you an instant email when someone submits, or give participants a page that reflects your brand and event, Google Forms falls short.

Formgrid is the only tool on this list that combines world-class landing page templates, inline editing, an HTML form backend, and instant email notifications, and a submissions dashboard starting at $8 per month.

You can try it free at
formgrid.dev.
No credit card required. 25 submissions per month on the free plan to test your full setup.

Full disclosure: I built Formgrid. I wrote
this comparison as honestly as I could. If
anything looks inaccurate, let me know in
the comments.

How to Build a Professional Quote Request Form With File Upload for Your Small Business

Allen Jones — Sat, 18 Apr 2026 15:34:47 +0000

Your customer wants a quote.

They visit your website, fill in your contact form,
and hit send. You get an email with their name and
a vague description of what they need.

But where is the logo file? Where is the artwork?
Where is the reference photo of the job they want done?

It is not there. So you reply, asking them to send it.
They send it in a separate email. Now the details are in one thread, and the file is in another. You are manually piecing together a quote before you have even started the actual work.

This guide shows you how to fix that in under 20 minutes using a free HTML template and Formgrid as the form backend.
No coding experience required.
No monthly fees to get started. No backend to build.

What You Will End Up With

By the end of this guide, you will have:

A professional multi-section quote request page deployed live on the internet
A file upload field that accepts artwork, logos, photos, and design files from customers
An instant email notification every time someone submits a quote request with all their details and their uploaded file
A submissions dashboard where you can view and manage every quote request in one place
A live pricing estimate that updates as the customer fills in the form

Here is what the finished quote request page
looks like:

Link to Demo

The template includes a branded hero panel with trust points and stats, a five-section quote form with file upload, a live pricing estimate panel, and a slim footer with your contact details.
All in one self-contained HTML file.

Who This Is For

This guide is for small business owners who need
customers to submit files alongside a quote request:

Custom apparel and print shops collecting artwork files for t-shirts, hats, and hoodies
Photographers asking clients to upload reference images before a shoot
Graphic designers collecting client logos and brand assets
Contractors asking customers to upload photos of the job site
Embroidery shops receiving design files from customers
Any business where customers need to send you a file before you can give them a price

What You Need Before You Start

A free Formgrid account at formgrid.dev
A free Netlify account at netlify.com
A text editor (VS Code, Sublime Text, or even Notepad works fine)
About 20 minutes

No Node.js. No build tools. No command line required.

Step 1: Get the Template From GitHub

Go to the Formgrid examples repository:

👉 github.com/allenarduino/formgrid-examples

You will see a collection of free HTML templates built for different industries.
Find the Quote Request template. You will see

quote-request-form: A clean, focused version with just the brand panel, form, and live estimate.
Best for businesses that want to embed or share a standalone quote page.

You have two options to get the files:

Option A: Clone with Git

If you have Git installed, open your terminal and run:

git clone https://github.com/allenarduino/formgrid-examples.git

Then navigate to the quote request template folder.

Option B: Download as ZIP

Click the green Code button on the GitHub page
and select Download ZIP. Extract the folder to your desktop.

Open the folder, and you will find either
quote-request-form/index.html or

Open it in your browser right now by double-clicking it. You will see the full professional quote request page working locally on your computer. The only thing missing is a real form endpoint so submissions go somewhere.

That is what Formgrid provides.

Step 2: Create Your Formgrid Account

Go to formgrid.dev and
sign up with Google or your email address.

No credit card required. The free plan gives you 25 submissions per month, which is enough to test your entire setup before you go live.

Once you sign up, you land on the Formgrid dashboard.

Step 3: Create a New Form

From the dashboard click New Form.

Give it a name that reflects your business.
Something like:

Apex Studio: Quote Requests
LP Custom Tees: Quote Form
Studio Quote Requests 2026

Click Create Form and you will be taken
to the form details page.

Step 4: Copy Your Endpoint URL

On the form details page, you will see a section called Endpoint Information.

Your endpoint URL looks like this:
https://formgrid.dev/api/f/your-form-id

Click Copy next to the endpoint URL.

This URL is your form backend. When a customer fills in the quote request form and uploads their artwork file, everything is sent to this URL. Formgrid receives it, stores it in your dashboard, and sends you an instant email notification with all the details and a link to download the file.

Keep this URL copied. You need it in the next step.

Step 5: Enable File Uploads

File uploads are available on the Premium plan
at $8 per month.

Go to your billing page at
formgrid.dev/app/dashboard/billing
and upgrade to Premium.

Once you are on Premium, your form will accept file uploads, and the files will be delivered to your inbox alongside the submission details.

Step 6: Add Your Endpoint URL to the Template

Open the HTML file in your text editor.

Use the Find function (Ctrl+F or Cmd+F)
and search for:
YOUR_FORMGRID_ENDPOINT_URL

You will find it in the JavaScript section
near the bottom of the file:

const res = await fetch('YOUR_FORMGRID_ENDPOINT_URL', {
  method: 'POST',
  body: new FormData(form)
});

Replace YOUR_FORMGRID_ENDPOINT_URL with your
actual Formgrid endpoint URL. It should look like
this after the change:

const res = await fetch(
  'https://formgrid.dev/api/f/your-form-id',
  {
    method: 'POST',
    body: new FormData(form)
  }
);

Save the file.

That one change connects your quote request page to Formgrid. Every submission, including the uploaded file, now goes directly to your inbox
and your dashboard.

Step 7: Customize the Template for Your Business

Now open the file in your text editor and make the template your own.

Here are the key things to update:

The page title

Find this near the top of the file:

<title>Get a Quote — Apex Studio</title>

Change it to your business name.

The business name in the nav

Find the nav logo section:

<span class="nav-name">Apex Studio</span>

Change this to your business name.

The phone number

Find the nav phone link:

<a href="tel:+16304415244" class="nav-phone">
  (630) 441-5244
</a>

Replace with your actual phone number.

The hero headline

Find the h1 in the brand panel:

<h1 class="brand-h1 anim-2">
  GET YOUR<br />
  <em>FREE</em><br />
  QUOTE
</h1>

You can leave this as is or change it to something more specific to your business.

The trust points

Find the three trust items and update the text to reflect your actual business promises:

<div class="trust-text">
  <strong>Response within 24 hours</strong>
  We review your artwork and send a final 
  itemized quote.
</div>

The stats

Find the three stat boxes and update them to reflect your business:

<div class="bstat-num">600<em>+</em></div>
<div class="bstat-label">Orders Completed</div>

The product dropdown

Find the product selector and update the options to match what your business actually offers:

<select id="product" name="product" required>
  <option value="">Select a product</option>
  <option>Standard T-Shirt (Heat Print / DTF)</option>
  <option>Standard T-Shirt (Screen Printed)</option>
  <!-- Add your own products here -->
</select>

The pricing data

Find the PRICING object in the JavaScript section and update the price ranges to match your actual pricing:

const PRICING = {
  'Standard T-Shirt (Heat Print / DTF)': {
    base: { min: 8.50, max: 14.00 },
    minQty: 6,
    // ...
  },
};

Update the min and max values for each product to reflect what you actually charge. The live estimate panel updates automatically.

The footer contact details

Find the footer and update the email, phone, and address:

<a href="mailto:hello@apexstudio.com">
  hello@apexstudio.com
</a>

The colors

At the top of the file in the CSS variables section, you will find:

:root {
  --amber: #e8a020;
  --black: #0a0a08;
  --cream: #f5f2ea;
}

Change the amber accent color to match your brand.
Every button, highlight, and accent across the page updates automatically.

Step 8: Test Your Form Locally

Before you deploy, test that the form submission and file upload work correctly.

Open the HTML file in your browser by double-clicking it. Fill in all the fields, attach a test file, and hit submit.

Check two things:

Your Formgrid submissions dashboard

Go to your form on formgrid.dev
and click the Submissions tab. Your test submission should include all fields and a download link for the uploaded file.

Your email inbox

You should have received an instant notification with all the quote details formatted cleanly and a link to download the attached file.

If both of those worked, your template is connected and ready to deploy.

Step 9: Deploy to Netlify

Netlify is the simplest way to get a static HTML file live on the internet for free.

Go to netlify.com and create a free account if you do not have one already.

Once you are logged in to the Netlify dashboard, you will see a large drag-and-drop area that says:

"Want to deploy a new site without connecting
to Git? Drag and drop your site output folder here."

Take the folder containing your HTML file and drag it directly onto that area.

Netlify uploads your file and gives you a live
URL in about 30 seconds. It looks something like:
https://random-name-abc123.netlify.app

Click the URL, and your quote request page is
live on the internet.

Step 10: Give Your Site a Better URL

The random Netlify URL works, but it is not what you want to put on your business cards.

Option A: Custom Netlify subdomain (free)

In your Netlify site settings, go to
Site Configuration then Change site name.

You can change it to something like:
apex-studio-quote.netlify.app

Option B: Your own domain (if you have one)

If you already own a domain, you can point it to Netlify in the Domain Management section of your site settings. Netlify handles the SSL certificate automatically.

What Arrives in Your Inbox

Every time a customer submits a quote request, you receive an email that looks like this:
New Quote Request
First Name: Sarah
Last Name: Thompson
Company: Lakewood Community Center
Email: sarah@lakewoodcc.org
Phone: (555) 234-5678
Project Type: New Design / First Order
Product: Standard T-Shirt (Heat Print / DTF)
Quantity: 150
Decoration Method: Heat Print / DTF
Placement: Full Front, Left Chest
Need By Date: May 30, 2026
Artwork: community-event-logo.pdf
[Download File]
Additional Instructions:
Navy blue shirts. Logo on the left chest.
Need them for our annual fundraiser gala.
Open to color recommendations.

Everything in one email. Name, contact details, what they need, how many, when they need it, and the artwork file ready to download.

No back and forth asking for missing information.
No hunting through two separate email threads.
Just a complete quote request you can act on
immediately.

Managing Your Quote Requests

Go to the Submissions tab on your form details page on formgrid.dev to see every quote request in one place.

You can:

Search for a specific customer by name or email
View the full details of any submission
Download attached files
Export all quote requests as a CSV spreadsheet
Mark submissions as read or responded to

The CSV export is useful at the end of each month if you want to review your quote volume or track which products are most requested.

Upgrading When You Go Live

The free plan gives you 25 submissions per month, which is enough to test your setup.

When you go live, and quote requests start coming
in you will want to upgrade:

Premium at $8 per month gives you 1,000
submissions per month with file uploads included.
This is the plan you need to accept artwork files from customers.

Business at $29 per month gives you 15,000
submissions per month, plus auto-responder emails so every customer automatically receives a confirmation the moment they submit their quote request. Something like:

Hi Sarah, we have received your quote request
for 150 t-shirts and will review your artwork
and get back to you within one business day.
Questions? Call us at (555) 000-1234.

That one automated email eliminates a significant number of follow-up calls from customers asking whether their request came through.

Why This Beats Every Alternative

Over a basic contact form

Standard contact forms do not support file uploads.
Your customer fills in their name and hits send.
The artwork arrives in a separate email. You spend
time matching the two. Formgrid receives everything
together in one submission.

Over Google Forms

Google Forms cannot accept file uploads unless
the submitter has a Google account. Formgrid
accepts files from anyone with no account
required.

Overbuilding your own backend

Building a file upload backend from scratch requires server configuration, file storage setup, security handling, and ongoing maintenance. Formgrid handles all of that so you can focus
on your actual business.

Over-expensive form tools

Jotform charges $49 per month. Typeform charges
$29 to $99 per month. Formgrid is $8 per month
for 1,000 submissions with file uploads included.

A Real Example

Jose Pineda runs LP Custom Tees, a custom apparel shop in Aurora, Illinois. He was using a basic contact form, but it could not accept artwork files.

He used AI to build a more advanced quote form and then searched for a form backend that could receive file uploads. He found Formgrid, added his endpoint URL, upgraded to Premium, and his new quote form was live the same day.

Now every customer who requests a quote submits their artwork alongside their order details in one submission. Jose gets everything he needs to prepare an accurate quote in a single email.

Get the Template

The quote request templates and all other
Formgrid HTML templates are available for
free on GitHub:

👉 github.com/allenarduino/formgrid-examples

Star the repo to stay updated as new templates are added.

Templates currently available:

Quote Request with Live Estimate (this guide)
Event Registration
Horse Ride Registration
Wedding RSVP
Photography Booking
Cleaning Service Booking
Personal Trainer Enquiry
Real Estate Enquiry

Each template follows the same pattern. Clone it, add your Formgrid endpoint URL, customize the text and colors, and deploy.

Start Collecting Quote Requests Today

Your customers are sending you files in separate emails right now. Or they are filling in a bare contact form, and you are chasing them for their artwork afterward.

This template fixes both of those problems in under 20 minutes.

Clone the template. Sign up for Formgrid. Deploy
to Netlify. Share the link.

Your customers get a professional quote request experience that makes your business look established. You get complete quote requests in your inbox, artwork file included, ready to respond immediately.

👉 Start free at formgrid.dev

No credit card required. Free plan available to test your setup. Upgrade to Premium at $8 per month when you are ready to go live
with file uploads.

Have questions about the template or the
Formgrid setup? Email allen@formgrid.dev
and I will help you get it working for
your specific business.

Free Event Registration Page Template You Can Deploy in 20 Minutes

Allen Jones — Fri, 17 Apr 2026 23:11:50 +0000

You have an event coming up, and you need a registration page.

Not a Google Form. Not an Eventbrite listing that takes a cut of every ticket. A real, beautiful, branded registration page that
looks like your event deserves to be attended.

This guide shows you how to deploy a world-class event registration page using a free HTML template and Formgrid as the
form backend. No coding experience required.
No monthly fees to get started. No backend to build.

You will be live in under 20 minutes.

What You Will End Up With

By the end of this guide, you will have:

A complete event registration landing page deployed live on the internet
A working form that collects attendee details and sends them directly to your inbox
A submissions dashboard where you can view and export all your registrations as CSV
A professional page you are proud to share in WhatsApp groups, emails, and social media

Here is what the finished page looks like:

The template includes a hero section with your event name and stats, an animated ticker bar, a photo strip, an about section, event
highlights, a full schedule timeline, and guest reviews, a how it works section, a CTA band, and a complete footer.
All in one self-contained HTML file.

What You Need Before You Start

A free Formgrid account at formgrid.dev
A free Netlify account at netlify.com
A text editor (VS Code, Sublime Text, or even Notepad works fine)
About 20 minutes

That is it. No Node.js. No build tools. No command line required.

Step 1: Get the Template From GitHub

Go to the Formgrid examples repository:

👉 github.com/allenarduino/formgrid-examples

You will see a collection of free HTML templates
built for different industries. Find the
Event Registration template.

You have two options to get the files:

Option A: Clone with Git

If you have Git installed, open your terminal
and run:

git clone https://github.com/allenarduino/formgrid-examples.git

Then navigate to the event registration
template folder.

Option B: Download as ZIP

Click the green Code button on the GitHub page and select Download ZIP.
Extract the folder to your desktop.

Open the folder and you will find a single another folder called event-registration, in that folder you will find a file called
file: index.html
If you want to copy the code directly, you can visit this link:
https://github.com/allenarduino/formgrid-examples/blob/main/industries/event-registration/index.html

Open it in your browser right now by double-clicking it. You will see the full, beautiful registration page working locally on your computer.
The only thing missing is a real form endpoint, so submissions
go somewhere.

That is what Formgrid provides.

Step 2: Create Your Formgrid Account

Go to formgrid.dev
and sign up with Google or your email address.

No credit card required. The free plan gives you 25 submissions per month, which is enough to test the whole setup and run a small event.

Once you sign up, you land on the Formgrid dashboard.

Step 3: Create a New Form

From the dashboard click New Form.

Give your form a name that matches your event.
Something like:

Westside Community Gala 2026
Annual Members Meetup: Summer Edition
Blue Ridge Photography Workshop 2026

Click Create Form. You will be taken to the form details page.

Step 4: Copy Your Endpoint URL

On the form details page you will see a section called Endpoint Information.

Your endpoint URL looks like this:

https://formgrid.dev/api/f/your-form-id

Click Copy next to the endpoint URL.

This URL is your form backend. When someone fills in the registration form on your page and hits submit, their details are sent to
this URL. Formgrid receives the submission, stores it in your dashboard, and sends you an instant email notification.

Keep this URL copied. You need it in the next step.

Step 5: Add Your Endpoint URL to the Template

Open event-registration-template.html in your text editor.

Use the Find function (Ctrl+F or Cmd+F)
and search for:
YOUR_FORMGRID_ENDPOINT_URL

You will find it in the JavaScript section near the bottom of the file inside the form submit handler:

const res = await fetch('YOUR_FORMGRID_ENDPOINT_URL', {
  method: 'POST',
  body: new FormData(form)
});

Replace YOUR_FORMGRID_ENDPOINT_URL with your actual Formgrid endpoint URL. It should look like this after the change:

const res = await fetch(
  'https://formgrid.dev/api/f/your-form-id', 
  {
    method: 'POST',
    body: new FormData(form)
  }
);

Save the file.

That one change connects your beautiful registration page to Formgrid. Every submission now goes directly to your inbox and your dashboard.

Step 6: Customize the Template for Your Event

Now open the file in your text editor and make the template your own. Everything is clearly labeled in the HTML comments.

Here are the key things to update:

The page title

Find this near the top of the file:

<title>Westside Gala 2026 — Register Now</title>

Change it to your event name.

The hero headline

Find the hero section and update the h1:

<h1 class="anim-2">
  An evening worth<br />
  <em>remembering.</em>
</h1>

Change this to something that captures your event. For a photography workshop, it might be:

<h1 class="anim-2">
  Two days of learning<br />
  <em>and creating together.</em>
</h1>

The event description

Find the hero description paragraph and replace the placeholder text with a sentence about your actual event.

The event stats

Find the three stat boxes in the hero and update the numbers and labels to match your event:

<div class="stat-num">400<span>+</span></div>
<div class="stat-label">Expected Guests</div>

Change 400 to your expected attendance and update all three stats to reflect your event.

The ticker bar

Find the ticker section and update the
items to match your event details:

<div class="ticker-item">
  <span class="ticker-dot"></span>
  Saturday June 14, 2026
</div>

Update the date, venue name, dress code, and other details.

The schedule timeline

Find the timeline section and replace the placeholder schedule with your actual event schedule. Each timeline item follows this pattern:

<div class="timeline-item">
  <div class="timeline-time">
    6:30 PM
    <span>Saturday</span>
  </div>
  <div class="timeline-content">
    <h4>Doors Open and Welcome Reception</h4>
    <p>Your description here.</p>
    <span class="timeline-tag">Your Tag</span>
  </div>
</div>

The footer contact details

Find the footer and update the email address and phone number:

<a href="mailto:hello@westsidegala.com">
  hello@westsidegala.com
</a>

The colors

At the top of the file in the CSS variables section, you will find:

:root {
  --forest: #1b3a2d;
  --gold: #c9973a;
  --cream: #faf6ee;
}

Change these to match your event branding.
The entire page updates automatically because every color reference in the file points back to these variables.

Step 7: Test Your Form Locally

Before you deploy, test that the form
submission works.

Open the HTML file in your browser by double-clicking it. Fill in the form with your own details and hit submit.

Check two things:

Your Formgrid inbox

Go to your form details page on
formgrid.dev
and click the Submissions tab.
You should see your test submission appear there.

Your email

Check the email address you signed up with.
You should have received an instant notification with all the
details you submitted.

If both of those worked, your template is connected and ready to deploy.

Step 8: Deploy to Netlify

Netlify is the simplest way to get a static HTML file live on the internet for free.

Go to netlify.com and create a free account if you do not have one already.

Once you are logged in to the Netlify dashboard, you will see a large drag and drop area that says:

"Want to deploy a new site without
connecting to Git? Drag and drop your
site output folder here."

Take the folder containing your
event-registration-template.html
file and drag it directly onto that area.

Netlify uploads your file and gives you
a live URL in about 30 seconds. It looks
something like:
https://random-name-abc123.netlify.app

Click the URL, and your event registration page is live on the internet.

Step 9: Give Your Site a Better URL

The random Netlify URL works but it is not the kind of link you want to share in a WhatsApp group with 200 riders.

Option A: Custom Netlify subdomain (free)

In your Netlify site settings go to
Site Configuration then Change site name.

You can change it to something like:
westside-gala-2026.netlify.app

That is a much cleaner link to share.

Option B: Your own domain (if you have one)

If you already own a domain you can point it to Netlify in the Domain Management section of your site settings.
Netlify handles the SSL certificate
automatically.

What Happens When Someone Registers

The moment an attendee submits the form
on your live page two things happen.

You receive an instant email notification:
New Registration: Westside Gala 2026
Name: Allen Jones
Email: allen@gmail.com
Phone: (555) 234-5678
Ticket Type: VIP
Number of Guests: 2
Dietary Requirements: Vegetarian
Notes: Looking forward to the evening!

No inbox archaeology. No reply threads to dig through. Every registration arrives formatted and ready to read.

The submission is saved to your dashboard:

Go to your form on formgrid.dev and click the Submissions tab to see every registration. Search by name, view individual submissions, and export the complete attendee list as a CSV file with one click.

Upgrading When Your Registrations Open

The free plan gives you 25 submissions
per month, which is enough for testing and small events.

When your registrations open, you will
want to upgrade:

Premium at $8 per month gives you
1,000 submissions per month. Enough
for most community events and workshops.

Business at $29 per month gives you
15,000 submissions per month, plus auto-responder emails so every registrant automatically receives a confirmation message from you.

The auto-responder is worth the upgrade
on its own. Instead of manually replying to every registration confirmation request, every attendee gets an instant email the moment they submit:

Thank you for registering for the
Westside Gala 2026. We have received
your registration for 2 guests on
the VIP plan. Doors open at 6:30 PM
on Saturday June 14 at the Grand
Westside Ballroom. We look forward
to seeing you on the night.

One automated email. Zero inbox clutter.

Why This Approach Beats Every Alternative

Eventbrite

Eventbrite charges a service fee per
ticket plus a payment processing fee.
For a free community event, you still pay Eventbrite to host your page.
For a paid event, they take a percentage of every ticket you sell.

With this approach, you pay nothing to Eventbrite. Your registrations
go directly to your inbox and dashboard.

Google Forms

Google Forms is free and functional, but it gives you a bare form on a
white page with Google branding.
There is no hero section, no event details, no schedule, no photos,
and no customization that makes the page look like your event.

This template gives you a complete event website in a single HTML file.

Building from scratch

Building a registration page from scratch takes days or weeks.
This template is ready in 20 minutes.

Get the Template

The event registration template and all other Formgrid HTML templates are available for free on GitHub:

👉 github.com/allenarduino/formgrid-examples

Star the repo to stay updated as new templates are added.

Templates currently available:

Event Registration (this guide)
Horse Ride Registration
Wedding RSVP
Photography Booking
Cleaning Service Booking
Personal Trainer Enquiry
Real Estate Enquiry
Plumbing Quote Request

Each template follows the same pattern.
Clone it, add your Formgrid endpoint URL, and customize the text
and colors, and deploy.

Start Your Registration Page Today

Your event deserves a registration page that matches the effort you
have put into organizing it.

Clone the template. Sign up for Formgrid. Deploy to Netlify.
Share the link.

Your attendees get a registration experience that looks and feels
professional.
You get a clean attendee list in your inbox and dashboard. No chasing reply-all email threads to find out who is coming.

👉 Start free at formgrid.dev

No credit card required. Free plan available. Upgrade when your
registrations open.

Have questions about the template
or the Formgrid setup? Email
allen@formgrid.dev and I will
help you get live before your
event opens.

The Simplest Way to Create a Horse Show Registration Form Online

Allen Jones — Fri, 17 Apr 2026 13:19:33 +0000

If you are organizing an endurance ride, a horse show, or any equestrian event, you already know the problem.
Entries come in by email. Some people forget to include their horse's name. Others send the wrong division.
You spend hours chasing information that should have been on a form in the first place.

The traditional fix is expensive event management software that charges per-entry fees, takes a cut of your registration fees, or locks you into a platform your participants have never heard of.

There is a simpler way. This guide shows you how to build a professional horse show registration page in under 10 minutes using Formgrid, no coding, no expensive software, no per-entry fees.

What You Will End Up With

By the end of this guide, you will have:

A beautiful, branded registration page for your participants can visit on any device
A form that collects exactly the information you need from each rider and horse
An instant email notification every time someone registers
A submissions dashboard where you can view, search, and export all your entries as a CSV

Here is what the finished registration page
looks like:

Step 1: Create Your Formgrid Account

Go to formgrid.dev and
sign up with Google or your email address.

No credit card required. The free plan gives you
25 submissions per month, which is enough to test
the whole setup before your entries open.

Once you sign up, you land on your dashboard.

Step 2: Create a New Form

From the dashboard click New Form.

Give your form a name that makes sense for your
event. Something like:

Descanso Endurance Ride 2026
Spring Horse Show Entries
Club Championship Registration

Click Create Form and you will be taken to
the form details page.

Step 3: Open the Form Builder

On the form details page, you will see the
Form Builder section. Click Open Builder.

This takes you into the Formgrid builder, where
everything happens.

Step 4: Choose the Horse Riding Template

When the builder opens you will see a
Choose Template button at the top of the page.

Click it. A template gallery appears, showing
all the available landing page templates.

Find the Horse Ride Registration template
and click Use This Template.

The builder immediately loads a complete,
professional horse ride registration page with a hero section, event details, registration form, and footer, all ready for you to customize.

This is not a basic form on a white page. It is
a full landing page that looks like a real event website.

Step 5: Customize the Template to Match Your Event

This is where it gets interesting. Every piece
of text on the page is editable. You do not need
to know any code.

Switch to Page View

At the top of the builder, you will see two buttons:
Form Fields and Page View.

Click Page View to see and edit your
landing page.

Edit Text by Clicking Directly on It

Click any text element on the page to make it editable instantly. Just like editing a document.

Click on the headline that says
"Ride Registration 2026" and change it to
your actual ride name:

Blue Ridge Endurance Classic 2026

Click on the date and change it to your event date.
Click on the location and add your venue.
Click on the description and write something that captures what makes your ride special.

Every click saves you a support email from a
confused participant who could not find the date.

Change the Colors to Match Your Brand

On the right side panel, you will see a
Primary Color picker.

Click it and choose a color that matches your
club or event branding. The button, the accents,
and the highlights across the entire page update
instantly to match.

You can also change the background color to
give the page a completely different feel.

Update Your Contact Details

Scroll to the footer section of the template
editor panel on the right. Update:

Your club or organization name
Your contact email address
Your phone number

These appear in the footer of your registration
page so participants can reach you if they have
questions.

Step 6: Customize Your Registration Form Fields

Now switch back to Form Fields by clicking
the Form Fields button at the top.

The horse ride template comes pre-loaded with the most common fields for an equestrian event.
registration:

Rider Full Name
Email Address
Phone Number
Horse Name
Breed
Division (50 Mile, 25 Mile, 12 Mile Intro, Limited Distance)
Experience Level
Emergency Contact
Additional Notes

If you need to add more fields, like a waiver
acknowledgment, a vet card number, or a
t-shirt size, click Add Field from the
left sidebar and drag it into position on
the canvas.

You can make any field required or optional,
change the label, add placeholder text, and
reorder fields by dragging them up or down.

Step 7: Preview Your Registration Page

Want to see exactly what your participants
will see before you share it?

Click Page View again to see the live
preview of your complete registration page
with all your customizations applied.

Take a moment to read through it as if you were a participant. Is the date clear? Is the division selector labeled correctly? Does the page reflect your event's personality?

Make any final adjustments by clicking directly
on the text or updating the panel on the right.

Step 8: Save Your Form

When you are happy with everything, click
Save Changes at the top of the builder.

Formgrid saves your template design, your
form fields, and all your customizations.

Step 9: Share Your Registration Link

Go back to the form details page. You will see
your unique registration link.

It looks something like this:

This is a real, working landing page. Share
it anywhere:

Post it in your WhatsApp group
Add it to your club website or Facebook page
Put it in your event announcement email
Share it in equestrian Facebook groups
Add it to your Instagram bio

Participants visit the link, see your branded
registration page, fill in the form, and hit
submit. That is it.

What Happens When Someone Registers

The moment a participant submits the form, two things happen simultaneously.

You receive an instant email notification
with all their details formatted cleanly:
Blue Ridge Endurance Classic 2026

Rider Name: Sarah Johnson
Email: sarah@email.com
Phone: (555) 123-4567
Horse Name: Midnight Storm
Breed: Arabian
Division: 50 Mile
Experience Level: Advanced
Additional Notes: First 50 at this ride.
Looking forward to it.

No more digging through a chain of reply-all emails trying to find someone's horse's name. Every registration arrives in your inbox in the same format, ready to read.

The submission is also saved to your dashboard
where you can view every entry, search by name, filter by division, and export the complete list as a CSV file for your records or to share with your ride manager.

Managing Your Entries

Go to the Submissions tab on your form
details page to see everything in one place.

You can:

Search for a specific rider by name
See every detail they submitted
Export all entries as a CSV spreadsheet
Mark entries as read or responded

If you are on the Business plan you can set up
an auto-responder email that goes to every
participant automatically when they register.
Something like:

Thank you for entering the Descanso 50 Mile

We have received your registration for [Horse Name] in the [Division] division. You will receive your ride packet information and camp details approximately two weeks before the ride. See you at the start line.

That one automated email eliminates a week of
answering the same question from 200 riders.

Upgrading When Your Entries Open

The free plan gives you 25 submissions per month
which is useful for testing and small events.

When your entries open and registrations start coming in, you will want to upgrade to Premium at $8 per month for 1,000 submissions or
Business at $29 per month for 15,000 submissions with the auto-responder and custom email templates included.

For context, Annie, who manages the San Diego Endurance Riders events, use the Business plan for her ride registrations. At $29 per month it is a fraction of what dedicated event management software costs, and there are no per-entry fees.

Why Event Organizers Choose Formgrid

No per-entry fees. Eventbrite and similar
platforms charge a percentage of each registration. Formgrid charges a flat monthly fee regardless of how many entries you collect.

Your participants do not need an account.
They just visit the link, fill in the form, and submit. No login required. No app to download.

Works on any device. The registration page
looks great on a phone, tablet, or desktop.
Most of your participants will register on their phones.

You own your data. Every submission is yours.
Export it anytime as a CSV. No lock-in.

Instant notifications. You know the moment
someone registers. No logging into a platform
to check. It arrives in your email inbox just
like any other message.

Start Your Registration Page Today

Setting up your horse show or endurance ride registration page takes less than 10 minutes.

The template does the heavy lifting. You just
fill in your event details, pick your colors, and share the link.

Your participants get a professional registration experience.
You get clean, organized entries
in your inbox and dashboard. Nobody has to chase anyone by email.

👉 Start free at formgrid.dev

No credit card required. Free plan available.
Upgrade when your entries open.

Have questions about setting up your registration
form? Email allen@formgrid.dev and I will help
you get it live before your entries open.

How to Build a Waitlist Page for Your Startup in 2026

Allen Jones — Sat, 11 Apr 2026 11:00:39 +0000

You have an idea. Maybe you are still building it. Maybe
it is ready, but you want to build an audience before you
launch. Either way, the worst thing you can do is wait until launch day to start collecting emails.

A waitlist page solves that problem. It lets you validate
demand, build excitement, and collect real email addresses
from genuinely interested people before you write a single line of production code or spend a dollar
on ads.

In this guide, you will build a complete, working waitlist
page from scratch using plain HTML and CSS, with a form
backend powered by Formgrid.dev.
Every email collected goes straight to your inbox and your dashboard. No backend. No server. No complex setup.

By the end, you will have a live waitlist page you can
deploy on GitHub Pages, Netlify, Cloudflare Pages, or
any static host for free.

Why a Waitlist Page Matters Before You Launch

Most founders make the same mistake. They build for
months, launch to the public, and discover nobody is
waiting. The problem was not the product. It was the
absence of a pre-launch audience.

A waitlist page does three things at once:

It validates demand. If people will not give you their
email address, they will not give you their money either.
A hundred signups before launch is proof that real humans
care about what you are building.

It gives you a launch list. When you are ready to go
live, you have a warm audience to email. That first wave
of users does not come from cold outreach. It comes from
people who already said yes.

It creates momentum. Showing "1,200 people on the
waitlist" on your landing page is social proof that
compounds. Every new visitor sees it and thinks,
"maybe I should sign up too."

The good news: you do not need a fancy tool or a
monthly subscription to build one. You need HTML,
CSS, and a form backend.

What You Will Build

A clean, professional waitlist page with:

A compelling hero section with your headline and value proposition
A working email capture form
A success message after submission
Spam protection built in
Email notification to your inbox on every signup
A submission dashboard to track all your signups

Step 1: Create Your Formgrid Account

Head to https://formgrid.dev
and sign up using Google or Email.

No credit card required. The free plan gives you
50 submissions per month, which is more than enough
to validate your idea before you launch.

Step 2: Create a New Form

Once logged in, click New Form from your dashboard.

Name your form something descriptive, like:

"Waitlist Signups"
"Early Access"
"Pre-Launch Leads"

Click Create Form.

Step 3: Copy Your Endpoint URL

Go to the Overview tab of your new form and
copy your unique endpoint URL.

It looks like this:
https://formgrid.dev/api/f/your-form-id

This is the URL your waitlist form will submit
data to. Keep it handy for the next step.

Step 4: Build Your Waitlist Page

Create a new file called index.html and paste
this complete waitlist page. Replace
YOUR_FORMGRID_ENDPOINT_URL with the endpoint
you copied in Step 3, and update the headline,
description, and colours to match your product.

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8" />
  <meta name="viewport" 
        content="width=device-width, 
                 initial-scale=1.0" />
  <title>Join the Waitlist</title>
  <link rel="preconnect" href="https://fonts.googleapis.com" />
  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
  <link
    href="https://fonts.googleapis.com/css2?family=Outfit:wght@600;700;800&family=Plus+Jakarta+Sans:ital,wght@0,400;0,500;0,600;0,700;1,400&display=swap"
    rel="stylesheet"
  />
  <style>
    *, *::before, *::after {
      box-sizing: border-box;
      margin: 0;
      padding: 0;
    }

    :root {
      --brand: #1d4f3d;
      --brand-light: #e8f3ee;
      --text: #111827;
      --muted: #6b7280;
      --border: #e5e7eb;
      --bg: #f9fafb;
      --font-sans: "Plus Jakarta Sans", -apple-system, BlinkMacSystemFont,
        "Segoe UI", sans-serif;
      --font-display: "Outfit", "Plus Jakarta Sans", sans-serif;
    }

    body {
      font-family: var(--font-sans);
      background: var(--bg);
      color: var(--text);
      line-height: 1.6;
      min-height: 100vh;
      display: flex;
      flex-direction: column;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
    }

    /* NAV */
    .site-nav {
      position: sticky;
      top: 0;
      z-index: 50;
      background: rgba(255, 255, 255, 0.92);
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
      border-bottom: 1px solid rgba(229, 231, 235, 0.85);
      box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8) inset,
        0 4px 24px -4px rgba(17, 24, 39, 0.06);
    }

    .site-nav-inner {
      max-width: min(1100px, 94vw);
      margin: 0 auto;
      padding: 1rem clamp(1.25rem, 4vw, 2rem);
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 1rem;
    }

    .logo {
      font-family: var(--font-sans);
      display: inline-flex;
      align-items: center;
      gap: 0.65rem;
      font-size: 1.25rem;
      font-weight: 800;
      letter-spacing: -0.02em;
      color: var(--text);
      text-decoration: none;
      transition: opacity 0.2s ease;
    }

    .logo:hover {
      opacity: 0.85;
    }

    .logo-mark {
      width: 2.25rem;
      height: 2.25rem;
      border-radius: 10px;
      background: linear-gradient(
        145deg,
        var(--brand) 0%,
        #163d30 100%
      );
      box-shadow: 0 2px 8px rgba(29, 79, 61, 0.25);
      flex-shrink: 0;
      position: relative;
    }

    .logo-mark::after {
      content: "";
      position: absolute;
      inset: 6px;
      border-radius: 4px;
      border: 2px solid rgba(255, 255, 255, 0.35);
      opacity: 0.9;
    }

    .logo-text {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      gap: 0.1rem;
    }

    .logo-name {
      line-height: 1.15;
      color: var(--text);
    }

    .logo-kicker {
      font-size: 0.65rem;
      font-weight: 700;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: var(--muted);
    }

    .nav-cta {
      font-size: 0.875rem;
      font-weight: 600;
      color: var(--brand);
      text-decoration: none;
      padding: 0.5rem 1rem;
      border-radius: 999px;
      border: 1px solid rgba(29, 79, 61, 0.2);
      background: var(--brand-light);
      transition: background 0.2s ease, border-color 0.2s ease;
      white-space: nowrap;
    }

    .nav-cta:hover {
      background: #dceee5;
      border-color: rgba(29, 79, 61, 0.35);
    }

    @media (max-width: 480px) {
      .logo-kicker {
        display: none;
      }

      .logo {
        font-size: 1.1rem;
      }

      .logo-mark {
        width: 2rem;
        height: 2rem;
      }

      .nav-cta {
        font-size: 0.8125rem;
        padding: 0.45rem 0.75rem;
      }
    }

    /* HERO — wide column, large type */
    .hero {
      flex: 1;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      text-align: center;
      padding: clamp(3rem, 8vw, 6rem) clamp(1.25rem, 4vw, 3rem);
      max-width: min(1100px, 94vw);
      margin: 0 auto;
      width: 100%;
    }

    .badge {
      display: inline-block;
      background: var(--brand-light);
      color: var(--brand);
      font-family: var(--font-sans);
      font-size: 0.8125rem;
      font-weight: 700;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      padding: 10px 20px;
      border-radius: 999px;
      margin-bottom: clamp(1.25rem, 3.5vw, 2rem);
    }

    .hero h1 {
      font-family: var(--font-display);
      font-size: clamp(3.125rem, 9vw + 0.75rem, 5.75rem);
      font-weight: 800;
      letter-spacing: -0.035em;
      line-height: 1.02;
      color: var(--text);
      margin-bottom: clamp(1.25rem, 3vw, 2rem);
      width: 100%;
    }

    .hero h1 .hero-accent {
      display: inline-block;
      font-weight: 800;
      color: var(--brand);
    }

    @supports (-webkit-background-clip: text) or (background-clip: text) {
      .hero h1 .hero-accent {
        background: linear-gradient(
          120deg,
          var(--brand) 0%,
          #2d7a5c 45%,
          #1a5c46 100%
        );
        -webkit-background-clip: text;
        background-clip: text;
        color: transparent;
      }
    }

    .subtitle {
      font-family: var(--font-sans);
      font-size: clamp(1.35rem, 2.8vw, 1.75rem);
      font-weight: 500;
      line-height: 1.6;
      letter-spacing: -0.015em;
      color: var(--muted);
      max-width: min(48rem, 100%);
      margin: 0 auto clamp(2rem, 4vw, 3rem);
    }

    /* FORM */
    #waitlist-form {
      scroll-margin-top: 5.5rem;
    }

    .form-wrap {
      width: 100%;
      max-width: min(640px, 100%);
      margin: 0 auto;
    }

    .form-row {
      display: flex;
      gap: 10px;
    }

    .form-row input[type="email"] {
      flex: 1;
      padding: 16px 20px;
      font-size: 1.0625rem;
      border: 1px solid var(--border);
      border-radius: 12px;
      outline: none;
      background: #fff;
      transition: border-color 0.2s;
    }

    .form-row input[type="email"]:focus {
      border-color: var(--brand);
    }

    .form-row button {
      padding: 16px 28px;
      background: var(--brand);
      color: #fff;
      font-size: 1.0625rem;
      font-weight: 700;
      border: none;
      border-radius: 12px;
      cursor: pointer;
      white-space: nowrap;
      transition: opacity 0.2s;
    }

    .form-row button:hover {
      opacity: 0.9;
    }

    .form-row button:disabled {
      opacity: 0.6;
      cursor: not-allowed;
    }

    .form-hint {
      font-size: 0.82rem;
      color: var(--muted);
      margin-top: 10px;
      text-align: center;
    }

    /* SUCCESS STATE */
    .success {
      display: none;
      background: var(--brand-light);
      border: 1px solid #cde3d8;
      border-radius: 14px;
      padding: 20px 24px;
      text-align: center;
    }

    .success h3 {
      color: var(--brand);
      margin-bottom: 6px;
    }

    .success p {
      color: var(--muted);
      font-size: 0.95rem;
    }

    /* SOCIAL PROOF */
    .proof {
      margin-top: clamp(2rem, 5vw, 3rem);
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      font-size: clamp(0.95rem, 1.5vw, 1.05rem);
      color: var(--muted);
      max-width: min(52rem, 100%);
      margin-left: auto;
      margin-right: auto;
    }

    .proof-dot {
      width: 8px;
      height: 8px;
      background: var(--brand);
      border-radius: 50%;
    }

    /* FEATURES */
    .features {
      padding: 64px 24px;
      max-width: 960px;
      margin: 0 auto;
      width: 100%;
    }

    .features h2 {
      font-family: var(--font-display);
      text-align: center;
      font-size: clamp(1.5rem, 3vw, 1.85rem);
      font-weight: 800;
      letter-spacing: -0.03em;
      margin-bottom: 40px;
    }

    .features-grid {
      display: grid;
      grid-template-columns: repeat(
        auto-fit, minmax(240px, 1fr)
      );
      gap: 24px;
    }

    .feature-card {
      background: #fff;
      border: 1px solid var(--border);
      border-radius: 16px;
      padding: 24px;
    }

    .feature-icon {
      width: 40px;
      height: 40px;
      background: var(--brand-light);
      border-radius: 10px;
      display: flex;
      align-items: center;
      justify-content: center;
      margin-bottom: 16px;
    }

    .feature-icon svg {
      width: 20px;
      height: 20px;
      stroke: var(--brand);
      fill: none;
      stroke-width: 2;
      stroke-linecap: round;
      stroke-linejoin: round;
    }

    .feature-card h3 {
      font-size: 1rem;
      font-weight: 700;
      margin-bottom: 8px;
    }

    .feature-card p {
      font-size: 0.9rem;
      color: var(--muted);
    }

    /* FOOTER */
    footer {
      text-align: center;
      padding: 24px;
      font-size: 0.85rem;
      color: var(--muted);
      border-top: 1px solid var(--border);
    }

    @media (max-width: 560px) {
      .form-row {
        flex-direction: column;
      }
    }
  </style>
</head>
<body>

  <header class="site-nav" role="banner">
    <div class="site-nav-inner">
      <a href="#" class="logo" aria-label="YourProduct home">
        <span class="logo-mark" aria-hidden="true"></span>
        <span class="logo-text">
          <span class="logo-name">YourProduct</span>
          <span class="logo-kicker">Waitlist</span>
        </span>
      </a>
      <a href="#waitlist-form" class="nav-cta">Join waitlist</a>
    </div>
  </header>

  <section class="hero">

    <span class="badge">Coming Soon</span>

    <h1>
      The smarter way to<br />
      <span class="hero-accent">do the thing you do</span>
    </h1>

    <p class="subtitle">
      We are building something that solves 
      your problem better than anything else 
      out there. Join the waitlist and be 
      the first to know when we launch.
    </p>

    <div class="form-wrap">

      <form id="waitlist-form">

        <input 
          type="hidden" 
          name="_subject" 
          value="New Waitlist Signup" 
        />

        <!-- Honeypot spam protection -->
        <input 
          type="text" 
          name="_honey" 
          style="display:none" 
          tabindex="-1" 
          autocomplete="off" 
        />

        <div class="form-row">
          <input 
            type="email" 
            name="email" 
            placeholder="Enter your email address" 
            required 
          />
          <button type="submit" id="submit-btn">
            Join Waitlist
          </button>
        </div>

        <p class="form-hint">
          No spam. Unsubscribe anytime.
        </p>

      </form>

      <div class="success" id="success-msg">
        <h3>You are on the list!</h3>
        <p>
          We will email you the moment we launch. 
          Thank you for your interest.
        </p>
      </div>

    </div>

    <div class="proof">
      <span class="proof-dot"></span>
      <span>Join 500+ people already on the waitlist</span>
    </div>

  </section>

  <section class="features">
    <h2>Why people are excited</h2>
    <div class="features-grid">

      <div class="feature-card">
        <div class="feature-icon">
          <svg viewBox="0 0 24 24">
            <polyline points="20 6 9 17 4 12"></polyline>
          </svg>
        </div>
        <h3>Benefit One</h3>
        <p>
          Describe the first key benefit of your 
          product in one or two sentences. 
          Be specific and outcome focused.
        </p>
      </div>

      <div class="feature-card">
        <div class="feature-icon">
          <svg viewBox="0 0 24 24">
            <circle cx="12" cy="12" r="10"></circle>
            <polyline points="12 6 12 12 16 14">
            </polyline>
          </svg>
        </div>
        <h3>Benefit Two</h3>
        <p>
          Describe the second key benefit. 
          What problem does this solve? 
          How does it save time or money?
        </p>
      </div>

      <div class="feature-card">
        <div class="feature-icon">
          <svg viewBox="0 0 24 24">
            <path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z">
            </path>
          </svg>
        </div>
        <h3>Benefit Three</h3>
        <p>
          Describe the third benefit. 
          What makes your approach different 
          from everything else out there?
        </p>
      </div>

    </div>
  </section>

  <footer>
    Built with HTML and 
    <a href="https://formgrid.dev" 
       style="color: var(--brand);">
      Formgrid
    </a>
  </footer>

  <script>
    const form = document.getElementById(
      'waitlist-form'
    );
    const btn = document.getElementById(
      'submit-btn'
    );
    const successMsg = document.getElementById(
      'success-msg'
    );

    form.addEventListener('submit', async (e) => {
      e.preventDefault();

      btn.disabled = true;
      btn.textContent = 'Joining...';

      const data = new FormData(form);

      try {
        const res = await fetch(
          'YOUR_FORMGRID_ENDPOINT_URL',
          { method: 'POST', body: data }
        );

        if (res.ok) {
          form.style.display = 'none';
          successMsg.style.display = 'block';
        } else {
          btn.disabled = false;
          btn.textContent = 'Join Waitlist';
          alert(
            'Something went wrong. Please try again.'
          );
        }
      } catch (err) {
        btn.disabled = false;
        btn.textContent = 'Join Waitlist';
        alert(
          'Network error. Please check your connection.'
        );
      }
    });
  </script>

</body>
</html>

Replace these three things before you deploy:

YourProduct with your actual product name

The headline and subtitle with your real value
proposition

YOUR_FORMGRID_ENDPOINT_URL with the endpoint
URL from Step 3

Step 5: Email Notifications Are Already Set Up

Good news: you do not need to configure anything.
Formgrid automatically sends every new signup to the
email address you used to create your account.

The moment someone joins your waitlist, you will
receive an email like this:

If you want signups sent to a different address, go
to your form's Settings tab, find
Email Notifications, and update it there.

Step 6: Deploy Your Waitlist Page for Free

You have several free options for hosting your
waitlist page. All of them serve static HTML
with no setup required.

GitHub Pages: Push your index.html to a
GitHub repo and enable Pages in the repository
settings. Your page goes live at
username.github.io/repo-name.

Netlify: Drag and drop your index.html file
onto netlify.com/drop
and it goes live instantly at a random Netlify URL.
Connect a custom domain in settings.

Cloudflare Pages: Connect your GitHub repo and
Cloudflare deploys on every push. Fast, free, and
global CDN included.

All three options are completely free for a static
HTML page. Pick whichever you are most comfortable
with.

Step 7: View and Manage Your Signups

Every signup is stored automatically in your
Formgrid dashboard. Go to the Submissions tab
to see everyone who has joined your waitlist.

You can search, filter, and export all your
signups as a CSV file at any time. When you are
ready to launch, export the list, and import it
into your email tool of choice to send your
launch announcement.

What Makes a Waitlist Page Convert

Based on the research behind this guide, here are
the elements that separate high-converting waitlist
pages from ones that collect zero signups:

A specific headline. "The future of productivity."
converts nobody. "The form backend for developers
who hate maintaining servers" converts the right
people. Be specific about who it is for and what
it does.

One clear action. Your only CTA should be the
email field. No navigation links, no secondary
buttons, no distractions. One page. One goal.

Social proof near the form. "Join 500 people
already on the waitlist" creates FOMO and builds
trust. Even if you are starting from zero, update
this number as you grow.

A reason to sign up now. "Early access" or
"be first to know" gives people a reason to act
today instead of coming back later and forgetting.

Keep the form short. Email only for first
contact. You can ask for more information in a
follow-up survey after signing up. Every extra field
reduces conversion.

Customising the Page for Your Brand

The template above uses a green brand colour
defined as --brand: #1d4f3d in the CSS variables
at the top. To match your own brand, just change
that one value:

:root {
  --brand: #your-colour-here;
  --brand-light: #lighter-version-here;
}

Everything else on the page inherits those two
values automatically. No need to hunt through
the CSS changing colours one by one.

Final Thoughts

A waitlist page is not a nice-to-have. It is the
difference between launching to silence and
launching to a warm, engaged audience.

The page in this guide takes less than 30 minutes
to set up. It costs nothing to host. And every
signup goes straight to your inbox and your
dashboard the moment it happens.

Stop waiting to start collecting. Build your
waitlist today.

With Formgrid.dev you get:

✅ Working form with email capture in minutes

✅ Instant email notification on every signup

✅ Spam protection built in

✅ Submission dashboard to track all signups

✅ CSV export when you are ready to launch

✅ Free to start, no credit card required

👉 Start free at formgrid.dev

How to Add an Email Capture Form to Your Landing Page Without a Backend

Allen Jones — Sat, 11 Apr 2026 02:34:55 +0000

You built a landing page. It looks great. But when
someone fills out your contact form and clicks submit, nothing happens.

That is because HTML forms need a server to process
submissions. And setting up a server just to collect
email addresses is overkill for most landing pages.

In this guide, you will learn exactly how to add a working email capture form to any landing page without writing any backend code, using
Formgrid.dev.

Why HTML Forms Do Not Work on Their Own

When someone submits an HTML form, the browser sends the data to whatever URL is in the
action attribute:

<form action="WHERE_DOES_THIS_GO" method="POST">

On a static site, there is no server listening at that URL. So the data goes nowhere. The visitor gets an error. You get nothing.

You have three options:

Option 1: Set up your own server. Node.js,
PHP, Python. Configure email sending. Handle spam.
Maintain it forever. This is weeks of work for
something that should take 10 minutes.

Option 2: Use a form backend service. Point
your form at their endpoint. They handle everything.
You get submissions in your inbox and dashboard.

Option 3: Do nothing. Lose every lead that
tries to contact you.

Option 2 is the right call for 90% of landing pages.

The Solution: Formgrid.dev

Formgrid is a form backend
that works with any HTML form on any website. Point
your form's action attribute at your Formgrid
endpoint and it just works.

Free plan includes:

Unlimited forms
50 submissions per month
Instant email notifications
Spam protection built in
Submission dashboard

Step by Step Setup

Step 1: Create your Formgrid account

Go to formgrid.dev and
sign up with Google or Email. No credit card needed.

Step 2: Create a new form

Click New Form, give it a name like
"Landing Page Leads" or Contact Form, and click Create Form.

Step 3: Copy your endpoint URL

Go to the Overview tab and copy your endpoint:

https://formgrid.dev/api/f/your-form-id

Step 4: Add the form to your landing page

Here is a complete email capture form ready to
drop into any landing page:

<form 
  id="lead-form"
  action="YOUR_FORMGRID_ENDPOINT_URL" 
  method="POST"
>
  <input 
    type="hidden" 
    name="_subject" 
    value="New Lead Signup" 
  />

  <input 
    type="email" 
    name="email" 
    placeholder="Enter your email address" 
    required 
  />

  <button type="submit">
    Get Early Access
  </button>

  <!-- Honeypot spam protection -->
  <input 
    type="text" 
    name="_honey" 
    style="display:none" 
    tabindex="-1" 
    autocomplete="off" 
  />

</form>

<p id="form-status"></p>

<script>
  const form = document.getElementById('lead-form');
  const status = document.getElementById(
    'form-status'
  );

  form.addEventListener('submit', async (e) => {
    e.preventDefault();
    status.textContent = 'Submitting...';

    try {
      const res = await fetch(form.action, {
        method: 'POST',
        body: new FormData(form)
      });

      if (res.ok) {
        form.style.display = 'none';
        status.textContent = 
          'You are on the list. We will be in touch!';
      } else {
        status.textContent = 
          'Something went wrong. Please try again.';
      }
    } catch {
      status.textContent = 
        'Network error. Please try again.';
    }
  });
</script>

Replace YOUR_FORMGRID_ENDPOINT_URL with your
actual endpoint from Step 3.

Step 5: Test it

Fill out the form yourself and submit. Within
seconds, you should receive a notification email.

Check your Formgrid dashboard, and you will see
the submission logged there too.

What If I Want to Capture More Than Just Email

You can add any fields you need. Here is a version
that captures name, email, and company:

<form 
  id="lead-form"
  action="YOUR_FORMGRID_ENDPOINT_URL" 
  method="POST"
>
  <input 
    type="text" 
    name="name" 
    placeholder="Your name" 
    required 
  />

  <input 
    type="email" 
    name="email" 
    placeholder="Work email" 
    required 
  />

  <input 
    type="text" 
    name="company" 
    placeholder="Company name" 
  />

  <select name="role">
    <option value="">Select your role</option>
    <option value="developer">Developer</option>
    <option value="designer">Designer</option>
    <option value="founder">Founder</option>
    <option value="other">Other</option>
  </select>

  <!-- Honeypot -->
  <input 
    type="text" 
    name="_honey" 
    style="display:none" 
    tabindex="-1" 
    autocomplete="off" 
  />

  <button type="submit">
    Request Access
  </button>

</form>

Every field value appears in your notification
email and your dashboard are automatically.

Spam Protection Included

Formgrid includes two layers of spam protection
out of the box.

The honeypot field is invisible to real users, but
bots fill it in automatically. Any submission with
that field filled is rejected silently.

Rate limiting blocks the same IP address from
submitting too many times in a short window.
This stops bot floods before they reach your inbox.

You never see spam submissions. Only real leads.

Deploy Your Landing Page for Free

Once your form is working, deploy your landing
page on any of these free platforms:

GitHub Pages: Push to a repo and enable
Pages in settings. Free forever.

Netlify: Drag and drop your HTML file at
netlify.com/drop. Goes live instantly.

Cloudflare Pages: Connect your GitHub repo
and deploy on every push.

Your Formgrid endpoint works regardless of where
you host. No platform lock-in.

Final Thoughts

Adding a working email capture form to your landing
page does not require a backend. It does not require
a server. It does not require any infrastructure.

Point your form at Formgrid. Get submissions in
your inbox. Done.

👉 Start free at formgrid.dev

Full disclosure: I built Formgrid. This post
shows the exact workflow I recommend to everyone
who asks how to add a form to their landing page.

Jotform Alternatives in 2026: Cheaper, Open Source, and Self-Hostable

Allen Jones — Fri, 10 Apr 2026 18:19:31 +0000

If you have been using Jotform and recently looked at your bill, you are not alone.
Jotform's free plan limits you to 100 responses per month and
their paid plans start at $34/month for features that other tools offer for free or at a fraction of the cost.

For developers, indie hackers, and small businesses that is hard to
justify in 2026.

In this article, I will walk through the best Jotform alternatives in 2026, covering price, features, self-hosting options, and which one is right for your use case.

Why Developers and Businesses Look for Jotform Alternatives

Before jumping into the list, here are the most common reasons people switch:

Price: Jotform's free plan is limited to 100 responses per month
and 5 forms. Paid plans start at $34/month, which is expensive for
what most people actually need.

No HTML form backend: Jotform is a hosted form builder only. You cannot point your existing HTML form at a Jotform endpoint.
If you have a static site, you are out of luck.

No self-hosting: If you care about
data ownership or GDPR compliance, Jotform gives you no option to run
it on your own infrastructure.

Overkill for simple use cases:
Jotform has 10,000 templates, approval workflows, PDF generation, and
e-signatures. If you just need a contact form or event registration
form that is a lot of complexity you will never use.

No open source option: You are locked in with no transparency and no way to customize the core behavior.

If any of those hit home, keep reading.

The Best Jotform Alternatives in 2026

1. Formgrid.dev: Form Builder and Form Backend in One Place

Best for: Developers who want a form backend AND non-technical users who need a shareable form link. Both in one tool.

What makes it different:

Most form tools pick a lane. Either a form backend for developers or a no-code form builder for everyone else.
Formgrid does both.

You can point your existing HTML form at a Formgrid endpoint URL just like you would with Formspree. Or you can use the drag and drop form builder, get a shareable link, and send it via WhatsApp or email without touching any code.

Here is how both workflows look:

Option A: Use Your Existing HTML Form

If you already have an HTML form on your static site, just point the action attribute at your Formgrid endpoint. No other changes needed:

<form 
  action="https://formgrid.dev/api/f/your-form-id"
  method="POST"
>
  <input 
    type="text" 
    name="name" 
    placeholder="Your Name" 
    required 
  />
  <input 
    type="email" 
    name="email" 
    placeholder="Your Email" 
    required 
  />
  <textarea 
    name="message" 
    placeholder="Your Message"
  ></textarea>

  <!-- Honeypot spam protection -->
  <input 
    type="text" 
    name="_honey" 
    style="display:none" 
  />

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

Your form stays exactly as it is.
Formgrid handles receiving submissions, sending email notifications, and storing the data.

Option B: Build a Form With the Drag and Drop Builder

If you are non-technical or just want a shareable form link without writing any HTML, Formgrid has a full drag-and-drop form builder built in.

Here is how it works step by step:

Step 1: Sign Up and Create a Form

Head to formgrid.dev
and sign up using Google or Email.
No credit card required.

Once logged in you will land on your
dashboard. Click New Form to get started.

Step 2: Choose Your Path

After creating your form you will be taken to the form overview page.
You will see two options:

Build with Form Builder: Opens the
drag and drop editor.

Use Endpoint URL: Gives you the URL
to point your existing HTML form at.

Step 3: Build Your Form

Click Build with Form Builder and you will be taken to the builder page.
Drag fields from the left panel onto the canvas: text fields, email fields, dropdowns, checkboxes, file uploads, and more.

Each field is fully customizable. Click any field to edit its label,
placeholder, required status, and validation rules.

Step 4: Customize Your Brand

Formgrid includes a color picker so you can match the form to your brand or your client's brand. Change the primary color, background, and button style directly in the builder.

Every form you share looks as if it belongs to your brand. Not like a
generic third-party tool.

Step 5: Preview and Share

Once you are happy with the form, click Preview to see exactly how it
looks to your users. When it is ready, click Share to get your shareable form link.

You can send that link via:
WhatsApp, Email, SMS, or embed it on any website.

No code. No hosting. Just a link.

Step 6: Configure Settings

Go to the Settings tab on your form to:

Add notification email addresses so you receive an email every time
someone submits.

Enable spam protection with a honeypot and rate limiting built in.

Set a custom redirect URL after
submission.

Step 7: View Submissions

All submissions are stored in your Formgrid dashboard. Go to the
Submissions tab to view, search, filter, and export your data as CSV.

Key features:

Drag and drop form builder with shareable link.

HTML form endpoint that works with any static site.

Spam protection with honeypot and rate limiting.

Instant email notifications.

File uploads up to 1GB.

CSV export.

Color picker for brand matching.

Google Sheets sync on Professional
plan at $16/month.

Self-hostable with Docker.

100% open source under MIT license.

GDPR friendly with no tracking
and no data selling.

Pricing:

Plan	Price	Submissions
Free	$0/month	50/month
Premium	$8/month	5,000/month
Professional	$16/month	10,000/month
Business	$29/month	15,000/month

The bottom line: Jotform charges
$34/month for their starter paid plan.
Formgrid gives you a form builder,
a form backend, self-hosting, and
open source code starting at $8/month.
If you are paying for Jotform just to
build and share forms, this is the
obvious switch.

👉 formgrid.dev

2. Google Forms: Best Free Option

Best for: Anyone who needs a completely free form builder for
basic use cases.

Google Forms is completely free with no submission limits. It is the most widely used form of tool in the world for good reason. It works, it is fast, and everyone knows how to use it.

Key features:

Completely free.
Unlimited responses.
Google Sheets integration built in.
Conditional logic.
Simple analytics.

Pricing: Free.

Drawback: No custom branding.
No custom domain. No HTML form
backend. No self-hosting. Forms look
like Google Forms, not like your brand.
Not suitable for professional
client work.

3. Tally: Clean and Free Form Builder

Best for: Non-technical users who
want a Typeform-like experience at a lower price.

Tally is a popular alternative with a clean, minimal interface. Their free plan is genuinely useful, with unlimited forms and unlimited responses, though some features are locked behind the paid plan.

Key features:

Unlimited forms on the free plan.
Unlimited responses.
Conditional logic.
File uploads on paid plan.
Notion integration.
Embeddable forms.

Pricing: Free plan available.
Paid plan at $29/month.

Drawback: No HTML form backend.
No self-hosting. No open source.
Heavier than you need for a simple
contact form.

4. Typeform: Best for Conversational Forms

Best for: Marketers who want a
beautiful conversational form
experience for surveys and lead
generation.

Typeform pioneered the one question at a time conversational form format. It is visually stunning and produces high completion rates for surveys and research forms.

Key features:

Conversational one question at a time format.
Beautiful design templates.
Logic jumps and conditional branching.
Payment integrations.
Data analysis and insights.

Pricing: Free plan limited to
10 responses per month. Paid plans
start at $25/month.

Drawback: Extremely limited free
plan. No HTML form backend.
No self-hosting. No open source.
Expensive compared to alternatives.
Overkill for simple contact forms.

5. Paperform: Best for Beautiful Landing Page Forms

Best for: Marketers and creators who want visually stunning forms with a strong brand feel.

Paperform focuses on beautiful landing page-style forms that feel
like a designed experience rather than a generic form.
Strong media embedding, payment support, and good conditional logic.

Key features:

Beautiful form design.
Payment integrations.
Conditional logic.
Calculator fields.
Media embedding.

Pricing: Starts at $24/month.
No free plan.

Drawback: No free plan. No HTML
form backend. No self-hosting.
Expensive for what it offers compared
to alternatives.

6. Web3Forms: Lightweight Form Backend

Best for: Developers who just need a simple form endpoint for
their static site with no frills.

Web3Forms is a lightweight form backend service. No form builder.
Just an endpoint URL you point your HTML form at. Simple and fast.

Key features:

Simple HTML form endpoint.
Email notifications.
Spam protection.
Free plan available.

Pricing: Free plan available.
Pro plan at $18/month.

Drawback: No form builder.
No submission dashboard on the free plan. No self-hosting. No Google Sheets integration at a reasonable price.

Side-by-Side Comparison

Feature	Jotform	Formgrid	Google Forms	Tally	Typeform
Form builder	✅	✅	✅	✅	✅
HTML endpoint	❌	✅	❌	❌	❌
Shareable link	✅	✅	✅	✅	✅
Self-hostable	❌	✅	❌	❌	❌
Open source	❌	✅	❌	❌	❌
Google Sheets	✅ Paid	✅ $16/mo	✅ Free	❌	✅ Paid
File uploads	✅ Paid	✅	✅	✅ Paid	✅ Paid
Free responses	100/month	50/month	Unlimited	Unlimited	10/month
Starting price	$34/month	$8/month	Free	$29/month	$25/month
GDPR friendly	⚠️	✅	⚠️	⚠️	⚠️

Which One Should You Use?

Use Formgrid if:

You want a form backend AND a form builder in one tool.

You need to point an existing HTML form at an endpoint.

You care about open source and self-hosting.

You are paying too much for Jotform and want to cut costs significantly.

You need to share a form link with someone non-technical.

GDPR compliance matters to you.

Use Google Forms if:

You need something completely free.
Branding does not matter. You are collecting internal data or running simple surveys.

Use Tally if:

You want a clean, minimal form builder for free.
You do not need an HTML form backend.
You are a Notion user.

Use Jotform if:

You need advanced logic, payments,
approval workflows, and PDF generation.
Budget is not a constraint.
You are building a complex enterprise
forms that require heavy customization.

Use Typeform if:

You need a conversational one question at a time experience.
You are running surveys or research forms where completion rate matters. Visual design is your top priority.

Final Thoughts

Jotform built a genuinely powerful product. But in 2026, it is hard to
justify $34/month for a starter plan when better alternatives exist at a fraction of the cost.

If you are a developer who needs both a form backend for your static site AND a no-code builder for non-technical clients or teammates, there is no better option than Formgrid. It is the only tool on this list that does both, starting at $8/month.

If you need something completely free
for basic use cases, Google Forms or Tally will serve you well.

But if you are paying $34/month or more for Jotform and not using its
advanced approval workflows, PDF generation, or e-signature features you are significantly overpaying.

You can try Formgrid free at
formgrid.dev.
No credit card required.

Full disclosure: I built Formgrid.
I wrote this comparison as honestly
as I could. If anything looks
inaccurate, let me know in the comments.

How to Use Google Sheets as a CMS for Your Webflow Website (Without Zapier)

Allen Jones — Fri, 10 Apr 2026 15:20:25 +0000

If you build websites in Webflow for clients, you have probably had
this conversation at least once.

You finish the site. It looks great. The client is happy. Then they
ask: "How do I update the menu?" or "Can I add a new team member
myself?"

You explain Webflow CMS. You walk them through it. They nod along.
Then two weeks later, you get a message: "Can you just update it for
me? I can't figure out the CMS."

This is not a client problem. It is a workflow problem. And the
answer, most Webflow designers reach for syncing Google Sheets to
Webflow CMS via Zapier — turns out to create a different set of
headaches that are arguably worse than the original one.

This post covers why the Zapier approach breaks down, what the
real pain points are, and how to use Google Sheets as a live CMS
for your Webflow site without touching Zapier at all.

The Real Pain Points Webflow Designers Face With Google Sheets and CMS

Before getting to the solution, it is worth naming the problems
clearly because the Webflow forum and Reddit communities are full
of people running into the same walls.

Pain Point 1: Clients Simply Will Not Learn Webflow CMS

This is the most common frustration, and it is completely
understandable from the client's side. Most small business owners
already live in Google Sheets. They manage their inventory there,
their staff roster, their menu, and their event list. Asking them to
learn a new interface just to update a row of data is a genuine
barrier that most of them quietly abandon.

The result is that content goes stale. A menu shows items that
are no longer available. A team page shows people who left the
company. An event listing shows events that have already happened.
And the client either pays you to make every update manually or
just lives with outdated content.

Pain Point 2: The Zapier Sync Creates More Problems Than It Solves

The natural workaround Webflow designers reach for is Zapier or
Make. Connect Google Sheets to Webflow CMS, trigger a sync when
a row changes, and the CMS updates automatically.

In practice, this breaks down in several ways that users report
consistently on the Webflow forum.

The slug problem is the most common. Webflow CMS requires a slug
for every item and generates it automatically. When Zapier tries
to create or update items, it cannot easily match an existing
Webflow CMS item to a Google Sheets row, which means it often
creates duplicates instead of updating the correct item.

As one Webflow forum user described it: "I keep running into
issues comparing an existing item on the Webflow database to
update instead of just creating a new one."

Rate limits add another layer of fragility. Webflow's API allows
60 requests per minute with batches capped at 100 items per call.
For sites with frequent updates or large datasets, this means
delays, failed syncs, and content that is out of date, even when
the workflow is technically working.

The deprecation of Webflow API v1 in March 2025 also broke many
existing Zapier and Make integrations, leaving designers scrambling
to rebuild workflows that had been running for years.

Pain Point 3: The Webflow CMS Item Limits Hit Harder Than Expected

Webflow's CMS plan allows 2,000 items per site. The Business Plan
caps at 10,000 items with the option to purchase up to 20,000.
For a restaurant with a large menu, a directory site, a job board,
or any content-heavy project, these limits become a real constraint
fast.

Workarounds like splitting content across multiple collections
or setting up reverse proxies works, but add significant complexity
to what should be a simple content management task.

Google Sheets has none of these limits. A single spreadsheet can
hold hundreds of thousands of rows with no additional cost.

Pain Point 4: The Default Google Sheets Embed Is Unusable

The simplest approach using Webflow's Embed element to drop
in a Google Sheets iframe, it produces results that designers
consistently described as broken.

As one Webflow forum user put it: "I need to embed a Google
Sheet, but after inserting the code, I have no control over the
size. It defaults to a tiny square."

The native iframe embed shows the full Google Sheets interface, including tabs, header rows, and the Google branding. It is not
responsive, it cannot be styled to match your site design, and
it looks nothing like a purpose-built website element.

Pain Point 5: Custom Code Solutions Are Fragile and Hard to Hand Off

Some designers solve the problem with custom JavaScript that calls
the Google Sheets API directly. This works technically, but
introduces a new problem: the client now has a custom-coded
integration that requires an API key, a specific sheet format,
and code that lives somewhere in the Webflow custom code panel.

When something breaks, which it will, the client calls you. When
you want to hand the project off to another designer, you have
to explain the entire custom integration. The maintenance burden
never goes away.

The Better Approach: Skip the CMS Sync and Use a Live Widget Instead

Here is the insight that changes how this problem feels: you do
not need to sync Google Sheets to Webflow CMS at all.

The reason people try to sync is that Webflow CMS is the only
way to show dynamic content in Webflow, or so it seems. But
there is a simpler path. Instead of pushing your sheet data
into Webflow CMS, you render it directly on the page using
an embeddable widget that pulls live data from the sheet on
every page load.

No sync. No Zapier. No slug conflicts. No item limits. No
duplicate entries.

The client updates the Google Sheet. The page reflects the
change immediately. That is it.

How to Set This Up With SheetRocket

Sheetrocket is a tool that turns any Google Sheet into a
live REST API and an embeddable widget. The widget is what
matters for the Webflow use case.

Here is the exact process.

Step 1: Connect Your Google Sheet

Sign up at (sheetrocket.com)[sheetrocket.com] and sign in with Google. Paste
your Google Sheet URL into the dashboard. Sheetrocket
connects to your sheet via a service account, which means
your sheet stays private, and no OAuth consent screen appears
for your clients.

Example Google Sheet:

Share it with this service account email and copy your google sheet link
Service account email:

sheetrocket-api@sheetrocket-491214.iam.gserviceaccount.com

Paste your Google Sheet URL, and Sheetrocket generates your API and widget configuration in seconds.

Step 2: Open the Widgets Tab

On the API details page, click the Widgets tab. This is where
you configure what your embedded widget looks like and how
it behaves.

You will see two layout options: Table and Cards. Choose
Table if you want a traditional rows-and-columns layout.
Choose Cards if you want each row displayed as a visual card.

The Widgets tab. Choose between a table or cards layout depending on your content type.

Step 3: Choose a Card Template (For Cards View)

If you choose Cards, SheetRocket gives you six card template
designs to choose from:

Simple: Clean stacked fields. Works for any data type.
Good for staff directories, resource lists, FAQs.

Compact: Two-column field grid. Good for dense datasets
like price lists or inventory.

Profile: Large name with avatar image. Good for team
pages, speaker directories, member rosters.

Product: Full-width image at top with title and price
below. Good for restaurant menus, product catalogues,
service offerings. If a row has no image URL the card
renders cleanly without a broken placeholder.

Status: Color-coded status badge on each card. Green
for active or available, yellow for pending, red for
closed or sold, blue for featured. Good for job boards,
real estate listings, event availability.

Horizontal: Image left, content right, stacked as a
list. Good for blog post feeds, news listings, recipes.

Pick a card design. Each preview shows your actual layout so there are no surprises.

Step 4: Configure the Widget

After selecting your template, the customization panel gives
you full control over what appears and how it looks.

Sheet Tab: Which tab of your spreadsheet to display.

Row Limit: How many rows to show in the widget.

Theme: Light or dark, to match your Webflow site design.

Title: An optional heading above the widget.

Column Visibility: A checkbox list of every column in
your sheet. This is the feature that matters most for
client work. If your sheet has internal columns like
cost price, supplier name, or internal notes, you uncheck
them here, and they are completely hidden. They are
filtered server-side before the data ever leaves
SheetRocket, so there is no risk of a visitor finding
them by inspecting network requests.

Row Filter: Show only rows that match a condition.
For a restaurant menu: show only rows where Status
equals Available. For a job board: show only rows where
Status equals Open. For an events page: show only rows
where Date is not empty.

Typography: Customize font size, font weight, color,
text alignment, and letter spacing for column headers
and cell values independently. This is how you make
the widget feels like part of your Webflow design rather
than a generic embedded element.

Control exactly what appears. Column hiding keeps sensitive data private. Row filtering keeps content relevant.

Step 5: Copy the Embed Code

When your widget is configured, SheetRocket generates an
embed code that updates in real time as you adjust settings.
For a restaurant menu, it might look like this:

<div data-sheetrocket="your-sheet-id">
</div>
<script src="https://sheetrocket.com/widget.js" async></script>

Copy that code. Go to your Webflow project. Add an Embed
element wherever you want the widget to appear. Paste the
code in and publish.

The embed code updates live as you configure the widget. The preview below shows exactly what visitors will see.

That is the entire setup. There is no Zapier zap to maintain,
no slug to manage, no CMS item count to worry about, and no
Webflow Editor access required for your client.

Step 6: Show the Client How to Update Content

This is the part that changes client relationships. Open the
Google Sheet with your client. Show them that editing a cell
and saving the sheet is all they need to do. Within seconds,
the live website reflects the change.

No new software to learn. No login to a separate CMS. No
calls to you asking how to add a row.

The finished result on a live Webflow site. The client updates the Google Sheet, and the page updates automatically.

Real Use Cases Where This Works Better Than Webflow CMS

Restaurant and Cafe Menus

A restaurant client changes their menu regularly. Seasonal
items come and go. Prices update. Items sell out mid-service.
With Webflow CMS, they would need to log in, find the right
CMS item, make the change, and publish. With Sheetrocket,
they open their Google Sheet, change Available to Sold Out
in the Status column, and the website updates immediately.
No publish step required.

Team and Staff Directories

A company's team page needs to stay current as people join
and leave. The HR team already maintains a staff spreadsheet.
With Sheetrocket, that spreadsheet becomes the team page.
When HR updates the sheet, the website reflects it. The web
designer is not in the loop for every staff change.

Event Listings and Schedules

An events page needs to show upcoming events and hide past
ones. Set a row filter for Date is not empty and only filter
by upcoming dates. The client adds new events as rows, and
past events disappear automatically based on the filter.

Product Catalogues and Price Lists

A retail client has hundreds of products. Webflow CMS on
the Business plan allows 10,000 items, but that cap starts
to matter for larger catalogues. Google Sheets has no row
limit that a typical small business would ever hit, and
the client already manages their inventory there.

Job Boards

A company posts open roles in a Google Sheet with columns
for Title, Department, Location, Type, and Status. Set the
row filter to Status equals Open, and only active listings
appear on the website. When a role is filled, change the
status to Filled, and it disappears from the site instantly.

How This Compares to the Zapier Approach

	SheetRocket Widget	Zapier to Webflow CMS
Setup time	Under 5 minutes	30 to 60 minutes
Slug conflicts	Not applicable	Common problem
Duplicate entries	Not applicable	Common problem
Update speed	Instant on page load	Delayed by polling interval
CMS item limits	Not applicable	Yes, plan dependent
API deprecation risk	None	Webflow API v1 deprecated March 2025
Ongoing maintenance	None	Ongoing
Client needs Webflow access	No	No
Works if Zapier is down	Yes	No

What SheetRocket Cannot Do

It is worth being direct about the limitations so you can
decide if this is the right fit for your project.

Sheetrocket widgets are rendered client-side, which means
the data is not indexed by Google. If you need your content
to appear in search results, blog posts, individual product
pages, or SEO-driven directory listings. Webflow CMS is still
the right tool because it renders server-side, and Google
can index it.

Sheetrocket is the right tool for content that does not
need to be indexed: menus, team directories, event
schedules, price lists, and product catalogues on a page
that is already indexed, and any content that changes
frequently enough that the client cannot realistically
manage it through a CMS.

If your content needs SEO and your client needs Google
Sheets, those two requirements point toward a more complex
architecture like Webflow DevLink with an external framework.
For most small to medium client projects, that level of
complexity is not warranted.

Getting Started

SheetRocket has a free plan that includes 1,000 API calls
requests per month and 2 embeddable widgets. That is
enough to set up a complete restaurant menu or team
directory and show your client how it works before
committing to anything.

Try SheetRocket free at sheetrocket.com

No credit card required.

Frequently Asked Questions

Will the widget look good on mobile?

Yes. SheetRocket widgets are responsive by default. The
table view becomes horizontally scrollable on small screens.
The cards view collapses from three columns to one column
on mobile. You can also adjust font sizes and spacing in
the typography customizer to match your site's mobile
design.

What if my client accidentally deletes a row?

Google Sheets keeps a full version history. Your client
can restore any deleted row from the Edit menu by
accessing the version history. This is actually more
reliable than Webflow CMS, which has no native undo
for CMS item deletion.

Can I use this on a Webflow site that is already using CMS?

Yes. SheetRocket widgets and Webflow CMS are not mutually
exclusive. You might use Webflow CMS for your blog posts
(which need SEO) and SheetRocket for your menu or team
page (which the client needs to update frequently). They
coexist on the same page without any conflict.

Does the widget slow down my Webflow site?

The widget script loads asynchronously, which means it
does not block your page from rendering. The data fetch
happens after the page loads. For most use cases, the
widget renders within one to two seconds of page load,
which is acceptable for content like menus, directories,
and product lists.

What if I want to show different subsets of the same
sheet on different pages?

You can create multiple embed codes from the same sheet
with different filters. For example, a food menu page
could show only Food category items and a drinks menu
page could show only the Drinks category items, both pulling
from the same spreadsheet with a different row filter
configurations.

Can my client see which columns are hidden?

No. Hidden columns are filtered server-side before the
response is sent to the browser. If a visitor opens
their browser's developer tools and inspects the network
response, they will only see the columns you chose to
display. Internal columns never appear.

Last updated: April 2026

Sheetrocket is built by Allen Jones, a solo founder
based in Ghana, building tools that make the web
more accessible for small businesses and designers
who work with them.

Best Sheet2API Alternatives in 2026 (One Gives You an API AND a Website Widget)

Allen Jones — Fri, 10 Apr 2026 00:25:30 +0000

If you have been using Sheet2API or shopping around for a tool that
turns Google Sheets into a usable API, you are in the right place.
Sheet2API does a reasonable job at the core problem. But it has
limitations that push a lot of users to look elsewhere, and there
is now one tool in this category that does something none of the
others have even attempted.

This guide covers the five best Sheet2API alternatives in 2026.
what makes each one worth considering, and which one is the right one
fit depending on what you actually need.

Why People Look for Sheet2API Alternatives

Sheet2API is a legitimate tool. It converts Google Sheets into a
RESTful API quickly supports read and write operations. But
here is what users run into after signing up:

Pricing is steep for what you get. The Starter plan costs
around £24.99 per month, billed annually, and limits you to 15
spreadsheet APIs and only 1,500 rows per sheet. The Pro plan
jumps to £39.99 per month. For a tool built around a free product
like Google Sheets, that price point catches many users off guard.

It only speaks to developers. Sheet2API gives you a JSON
endpoint. What you do with that endpoint is entirely up to you.
If you are a small business owner, a Webflow designer, or anyone
who does not write code for a living? The tool stops being useful
the moment you get your API URL.

No visual output. You get data. You do not get anything to
show that data on a website without building something custom on
top of it.

These are not criticisms that make Sheet2API a bad tool. They
are simply gaps that the alternatives below address in different
ways. Let us go through them.

1. SheetRocket: Best Overall Alternative (API + Embeddable Widgets)

sheetrocket.com

Best for: Developers who need a REST API, small businesses
who want to display sheet data on their website, and anyone who
wants both in one product.

SheetRocket is the most complete tool in this category and the
only one that gives you a REST API and an embeddable website
widget from the same Google Sheet simultaneously. This is not
a minor feature difference. It is a fundamentally different
product vision.

How Sheetrocket Works

Step 1: Sign up and connect your sheet

You create an account, sign in with Google, and paste your
Google Sheet URL into the dashboard. Sheetrocket connects to
your sheet via a service account, which means no OAuth popups
for your users and no complicated permissions setup.

The Sheetrocket dashboard. Paste your Google Sheet URL, and your API is created in seconds.

Step 2: Your API is live immediately

The moment your sheet is connected, SheetRocket generates a
full REST API endpoint. On the API details page, you will see
the Overview tab first. This is where your API URL lives, along
with HTTP method controls. You can toggle GET, POST, PUT, and
DELETE on or off, depending on what you want to allow. A code
snippet below shows exactly how to start making requests in
JavaScript.

The Overview tab on the API details page. Your endpoint URL is ready to use immediately.

Step 3: Move to the Widgets tab

This is where SheetRocket separates itself from every other
tool in this list. Click the Widgets tab and you are presented
with two options: a Table widget or a Cards widget.

The Widgets tab. Choose between a table layout or a cards layout for your embedded widget.

Step 4: Choose a card template (if using cards)

If you choose the Cards view, SheetRocket offers six distinct
card template designs:

Simple: A clean stacked layout that works for any data. Good for contact directories and general content.

Compact: A tighter two-column grid for dense datasets.
Good for inventory lists and price tables.

Profile: Title and avatar image prominent. Good for the team
directories, speaker lists, and member rosters.

Product: Full image at top with title and price below.
Good for restaurant menus, product catalogues, and service
listings. If a row has no image URL, the card displays
cleanly without an image placeholder.

Status: Color-coded status badges for each record. Green
for active, yellow for pending, red for closed, and blue for
featured. Good for job boards, property listings, and
availability tables.

Horizontal: Image on the left with content on the right,
stacked as a list. Good for blog post feeds, news listings,
and recipe directories.

The template picker shows a live visual preview of each design. Pro templates are clearly labeled.

Step 5: Customize the widget

After selecting your template, you get full customization
panel:

Sheet Tab: Choose which tab of your spreadsheet to
pull data from.

Row Limit: Control how many rows appear in the widget.

Theme: Light or dark, matching your website design.

Title: An optional heading displayed above the widget.

Column Visibility: A checkbox list of every column in
your sheet. Uncheck any column to hide it from the widget.
This is critical for privacy. If your sheet has sensitive
columns like internal pricing, email addresses, or staff
notes, you can hide them completely. Hidden columns are
never sent to the widget at all. They are filtered on
the server before the response leaves SheetRocket.

Row Filtering: Show only rows that match a condition.
For example, only show rows where Status equals Active.
Supports contains, equals, starts with, and is not empty
operators.

Typography and Colors: Customize font size, font
weight, font style, text color, text alignment, text
transform, and letter spacing for column headers, cell
values, and the widget title independently.

Per-Column Styles: Apply different typography settings
to individual columns. Make the Price column bold and green
while the Description column stays default gray.

The customization panel. Column visibility, row filtering, and typography controls all in one place.

Step 6: Copy and paste the embed code

When your widget is configured, SheetRocket generates an embed
code in real time. It looks like this:

<div
  data-sheetrocket="your-sheet-id"
</div>
<script src="https://sheetrocket.com/widget.js" async></script>

Copy that snippet and paste it into any website. Webflow users
paste it into an Embed element. WordPress users paste it into a
Custom HTML block. Plain HTML sites just drop it into the body.
The widget renders your live Google Sheet data with your chosen
design and all your customizations applied.

Your configuration saves automatically. Come back the next day
and everything is exactly where you left it.

The embed code updates in real time as you change settings. The live preview below it shows exactly what visitors will see.

A live Sheetrocket widget embedded on an external website. The data comes directly from a Google Sheet.

Sheetrocket Pricing

Plan	Price	API Requests	Widgets	Active APIs
Free	$0/month	1,000/month	2	3
Pro	$12/month	50,000/month	Unlimited	10
Business	$29/month	500,000/month	Unlimited	Unlimited

The free plan includes the "Powered by Sheetrocket" branding on
widgets. The Pro plan removes it, which is the primary upgrade
trigger for anyone using widgets on a professional or client site.

Who SheetRocket Is For

Sheetrocket works for two very different people. The first is a
developer who wants a clean REST API to power an app or a
dashboard without setting up a backend. The second is a Webflow
designer, a WordPress site owner, or a small business owner who
has product data or team information in a Google Sheet and wants
it to appear on their website without writing any code.

No other tool in this category serves both audiences. Most
alternatives stop at the JSON endpoint and expect developers
to do the rest.

What Sheetrocket Does Not Do

Sheetrocket is built specifically for Google Sheets. It does not
support Excel Online or other spreadsheet formats. If your data
lives in Excel rather than Google Sheets, look at the other
options below.

2. Sheety: Free and Fast for Simple Projects

sheety.co

Best for: Developers who need a quick read-only API for
personal or prototype projects.

Sheety has been around since 2019 and remains one of the most
popular tools in this space because of how simple it is. Paste
a Google Sheet URL, click a button, and you have a JSON endpoint.
No account setup required on the free tier.

Sheety's dashboard. Clean and minimal with a single focus on generating your API URL.

The free plan is genuinely generous for personal use. For
anything production-facing, the limitations show up quickly.
Write support is restricted on free tiers, request limits are
low, and there is nothing beyond the API itself. No widgets,
no visual output, no customization.

Sheety is a solid starting point for a proof of concept or a
static site build-time data fetch. It is not the right tool
for anything that needs to display data on a website or handle
meaningful traffic.

Pricing: Free tier available. Paid plans start at
approximately $10 per month.

Best use case: Quick prototypes, personal projects, and
read-only API needs where you just need JSON and nothing else.

3. SheetDB: Clean API With Strong Documentation

sheetdb.io

Best for: Developers building applications who need
well-documented read and write API access.

SheetDB offers a clean REST API that supports the full range
of CRUD operations: create, read, update, and delete. What stands out compared to other tools in this category is the
quality of its documentation. If you are integrating Google
Sheets data into a custom application, and your team needs clear
reference docs; SheetDB delivers that better than most.

SheetDB's documentation is detailed and includes code examples for multiple languages.

It supports filtering rows by column value using query
parameters, pagination, and basic authentication. The
dashboard is straightforward and shows request usage clearly.

Like every other tool on this list except SheetRocket,
SheetDB gives you a JSON endpoint and nothing else. There
is no way to display your data on a website without building
something custom on top of it.

Pricing: Free tier available with 500 monthly requests.
Paid plans start at approximately $9 per month.

Best use case: Application backends where a developer
needs solid documentation and reliable write support.

4. SheetBest: Simple API With a Clean Interface

sheet.best

Best for: Users who want a polished dashboard experience
with minimal configuration.

SheetBest positions itself as the easiest way to turn a Google
Sheet into an API, and the dashboard backs that up. The
interface is clean, the setup flow is short, and you can have
an endpoint ready in under two minutes.

It supports GET, POST, PUT, PATCH, and DELETE operations and
handles basic filtering well. For straightforward read and
write use cases, it competes well with both Sheet2API and
SheetDB.

The pricing puts it in a similar bracket to Sheet2API, which
is where it tends to lose users to Sheetrocket. For a similar
price you get more with Sheetrocket, particularly if you need
to display data visually on a website.

Pricing: Free tier with limited requests. Paid plans
start at approximately $9 per month.

Best use case: Users who want a polished dashboard and
straightforward API access without needing any visual output
features.

5. Airtable: When You Need More Than a Spreadsheet

airtable.com

Best for: Teams who have outgrown Google Sheets and need
a proper database with API access.

Airtable is not a direct Sheet2API alternative in the same way
sense as the other tools here. It is a relational database
with a spreadsheet interface and a built-in REST API. If your
frustration with Sheet2API comes from Google Sheets itself
being too limited, with no relationships between tables, slow
performance on large datasets, and limited formula power.
Airtable solves those problems.

The API is well-documented and supports complex queries that
go beyond what any of the Google Sheets tools can offer.
Airtable also offers views, automations, forms, and
integrations that Google Sheets simply does not have.

The tradeoff is price and complexity. Airtable is
significantly more expensive than the other tools here and
requires learning a new platform. If your data is already
well-managed in Google Sheets, and you just need to expose it,
Airtable is more than you need.

Pricing: Free tier available. Paid plans start at $20
per user per month.

Best use case: Teams who need a relational database with
API access and are ready to move off Google Sheets entirely.

Side-by-Side Comparison

Feature	SheetRocket	Sheet2API	Sheety	SheetDB	SheetBest
REST API	Yes	Yes	Yes	Yes	Yes
Embeddable widgets	Yes	No	No	No	No
Card templates	6 designs	No	No	No	No
Table widget	Yes	No	No	No	No
Column visibility control	Yes	No	No	No	No
Row filtering in widget	Yes	No	No	No	No
Typography customization	Yes	No	No	No	No
Works on any website	Yes	No	No	No	No
Free plan	Yes	Trial only	Yes	Yes	Yes
Starting paid price	$12/month	~£25/month	~$10/month	~$9/month	~$9/month
Excel Online support	No	Yes	No	No	No

Which Tool Should You Choose

Here is a direct answer depending on your situation:

You are a developer who needs a quick JSON API for a
personal project or prototype, and price is the top concern:
Use Sheety. It is free, it is fast, and it requires almost
no setup.

You are a developer building an application and need solid
documentation and reliable write access:
Use SheetDB. The documentation quality justifies the price
for production application backends.

You need to display Google Sheet data on a website, and you
do not want to write any code to do it:
Use SheetRocket. It is the only tool in this category that
lets you embed your sheet data as a styled, customizable
widget on any website. The other tools on this list give
you a JSON endpoint and leave the display layer entirely
to you.

You are a developer who needs the API today and knows you
will eventually need to display that data on a website:
Use SheetRocket. You get both from the start without having
to build a custom frontend on top of your API later.

You need Excel Online support alongside Google Sheets:
Use Sheet2API. It is one of the few tools that handles both.

You have outgrown Google Sheets and need relationships
between tables, advanced automations, and a proper database:
Use Airtable. You are solving a different problem than the
other tools on this list address.

The Honest Verdict on Sheet2API

Sheet2API is a solid tool that has been around long enough to
prove it works. It handles authentication, supports webhooks,
and offers filtering. For a developer who needs a reliable API
with Excel Online support and does not need anything visual,
it remains a legitimate choice.

The problem is value. At its price point, you are paying for
a pure API tool in a market where a competitor now offers the
same API capability plus six card template designs, an
embeddable table widget, column visibility controls, row
filtering, typography customization, and a free plan with
1,000 monthly requests at a lower starting price.

For most users discovering this category today, Sheetrocket
is the better place to start.

Get Started With Sheetrocket

SheetRocket is free to start. No credit card required.
Connect your Google Sheet, get your API endpoint, and
build your first embeddable widget in under five minutes.

Start for free at sheetrocket.com

Frequently Asked Questions

Is there a free Sheet2API alternative?

Yes. Sheetrocket, Sheety, and SheetDB all offer free plans.
SheetRocket's free plan includes 1,000 API requests per month,
2 embeddable widgets, and 3 active APIs — which is more
generous than most free tiers in this category.

Can I embed Google Sheets data on a Webflow site?

Yes, with Sheetrocket. Connect your sheet, configure your
widget, and paste the generated embed code into a Webflow
Embed element. Your live sheet data appears on your site
automatically. The other tools on this list do not offer
an embed code. They only provide a JSON API endpoint
that requires custom code to display.

What is the difference between a Google Sheets API
tool and the Google Sheets API itself?

The Google Sheets API is Google's own API for reading
and writing spreadsheet data programmatically. Using it
directly requires setting up OAuth credentials, handling
authentication, and writing code to manage requests. Tools
like SheetRocket and Sheet2API sit on top of the Google
Sheets API and handle all of that for you, giving you a
simple endpoint you can use immediately without any setup.

Does SheetRocket work with private Google Sheets?

Yes. Sheetrocket connects to your sheets via a service
account that you share editor access with:

sheetrocket-api@sheetrocket-491214.iam.gserviceaccount.com

Your sheet stays private. Only the data you choose to
expose through Sheetrocket becomes accessible via your
API or widget, and you control exactly which columns
are visible.

What happens to my widget if I edit my Google Sheet?

Your changes appear automatically. Sheetrocket fetches
live data on every request, so your widget always reflects
the current state of your sheet. There is no manual sync
or rebuild required.

Can I use Sheetrocket on WordPress?

Yes. Paste the embed code into a Custom HTML block in
the WordPress block editor. Your widget will render
anywhere you can add custom HTML, including page builders
like Elementor and Divi.

Last updated: April 2026

Sheetrocket is built by Allen Jones, a solo founder
based in Ghana. If you found this post useful, the best
way to support it is to try Sheetrocket at
sheetrocket.com.

How to Add a Contact Form to Your Astro Site Without a Backend

Allen Jones — Thu, 09 Apr 2026 16:04:10 +0000

If you are building a portfolio, landing
page, or blog with Astro, chances are you need a contact form.

But here is the catch:

Astro is a static site framework.
It generates fast, lightweight HTML with no server-side backend. That means your forms have nowhere to send data by default.

Setting up a backend to handle a contact form feels unnecessary
work for most Astro developers.
And that is exactly why thousands of people search for things like "Astro contact form without backend" every month.

In this guide, you will learn exactly how to handle form submissions in your Astro site without building your own backend, using Formgrid.

We will walk through a step-by-step tutorial with code you can copy, paste, and deploy immediately.

Why Astro Developers Need a Form Backend

Astro builds static HTML files.
That is its biggest strength. Fast. Lightweight.
No server required.

But static HTML forms cannot process their own submissions. When someone clicks submit on a plain HTML form, the data has nowhere to go unless something on the server receives it.

Setting up your own backend just to collect form submissions means:

You need a server running Node, PHP, or Python.
You need routing, validation, and spam protection. You must configure
email notifications. You need a database
to store submissions. You must maintain
it indefinitely.

All this work just to receive a message from a website visitor.

That is why most Astro developers use a form submission service instead.

Popular Ways to Handle Forms in Astro Without a Backend

Formspree

One of the oldest form backend services.
Simple and reliable, but paid plans get
expensive quickly.
Google Sheets integration starts at $90/month.

Netlify Forms

A great free option, but only works if your site is deployed on Netlify. If you host on Vercel, Cloudflare, or GitHub Pages, it does not work at all.

Formgrid.dev (Open-Source)

A newer privacy-first alternative that works with any Astro site, regardless of where it is deployed.

Features include:

Open source under MIT license

Works on any website or deployment platform

Email notifications for every submission

Spam protection with a honeypot and rate limiting

Optional Proof-of-Work CAPTCHA

Free plan: unlimited forms and
50 submissions per month

Google Sheets sync on the
Professional plan at $16/month

Why Use Formgrid for Your Astro Site

Formgrid is a privacy-first open source alternative to services like Formspree and Netlify Forms.
Here is why it works well with Astro specifically:

Instant email notifications: Receive every submission immediately in your inbox with clean, organized formatting.

Works anywhere: Unlike Netlify Forms,
Formgrid works whether you deploy on Vercel, Netlify, Cloudflare Pages, GitHub Pages, or your own server.

Spam protection: Built-in honeypot fields, rate limiting, and optional Proof-of-Work CAPTCHA keep bots out.

Self-hostable: Run Formgrid on your own infrastructure using Docker for complete data control.

Submission dashboard: Every submission is saved to your Formgrid
dashboard. No submission is ever lost, even if the email fails to arrive.

Open source: MIT license, no vendor
lock-in, fully auditable.

Whether you are a solo developer building a portfolio or a freelancer building client websites, Formgrid makes form handling fast, simple, and secure.

Step 1: Create a Formgrid Account

Go to formgrid.dev
and sign up using Google or Email.
No credit card required.

Formgrid offers free and paid plans.
The free plan includes:

Unlimited forms

50 submissions per month

Email notifications

Spam protection

Step 2: Create a New Form

Once logged in, go to your dashboard and click New Form.

Give your form a name:

"Astro Contact Form"
"Portfolio Enquiry Form"  
"Client Contact Form"

Click Create Form.

Step 3: Copy Your Endpoint URL

After creating your form, you will land on the form overview page.

Go to the Overview tab and copy your unique endpoint URL. It looks like this:

https://formgrid.dev/api/f/your-form-id

You will use this URL as the action attribute on your HTML form or inside your fetch call.

Step 4: Add the Form to Your

Astro Site

There are two ways to add Formgrid to your Astro site.
Choose the one that fits your project.

Option A: Simple HTML Form

This is the fastest approach and requires zero JavaScript.
Perfect for straightforward contact forms.

In any .astro file, add this code:


<form
  action="https://formgrid.dev/api/f/your-form-id"
  method="POST"
>
  <label for="name">Your Name</label>
  <input
    type="text"
    id="name"
    name="name"
    required
  />

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

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

  <!-- Honeypot spam protection -->
  <input
    type="text"
    name="_honey"
    style="display:none"
  />

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

Replace your-form-id with the actual endpoint slug from your Formgrid overview tab.

When someone submits the form the page redirects to a Formgrid confirmation page.
You receive the submission instantly by email.

Option B: Fetch-Based Form

with No Page Redirect

This approach keeps the user on your page after submission and shows a success message without any page reload.
It uses Astro's built-in <script> tag.

Create a new file called
ContactForm.astro in your components folder and add the following:

---
// ContactForm.astro
---

<div class="form-wrapper">
  <form id="contact-form">

    <!-- Honeypot spam protection -->
    <input
      type="text"
      name="_honey"
      style="display:none"
      aria-hidden="true"
    />

    <div class="field">
      <label for="name">Your Name</label>
      <input
        type="text"
        id="name"
        name="name"
        placeholder="Allen Jones"
        required
      />
    </div>

    <div class="field">
      <label for="email">Email Address</label>
      <input
        type="email"
        id="email"
        name="email"
        placeholder="allen@example.com"
        required
      />
    </div>

    <div class="field">
      <label for="message">Message</label>
      <textarea
        id="message"
        name="message"
        rows="5"
        placeholder="Write your message here"
        required
      ></textarea>
    </div>

    <p 
      id="success-message" 
      style="display:none; color: green;"
    >
      Your message was sent successfully.
    </p>

    <p 
      id="error-message" 
      style="display:none; color: red;"
    >
      Something went wrong. Please try again.
    </p>

    <button type="submit" id="submit-btn">
      Send Message
    </button>

  </form>
</div>

<script>
  const form = document.getElementById(
    'contact-form'
  ) as HTMLFormElement

  const submitBtn = document.getElementById(
    'submit-btn'
  ) as HTMLButtonElement

  const successMsg = document.getElementById(
    'success-message'
  ) as HTMLParagraphElement

  const errorMsg = document.getElementById(
    'error-message'
  ) as HTMLParagraphElement

  form.addEventListener('submit', async (e) => {
    e.preventDefault()

    submitBtn.textContent = 'Sending...'
    submitBtn.disabled = true
    successMsg.style.display = 'none'
    errorMsg.style.display = 'none'

    const formData = new FormData(form)
    const data = Object.fromEntries(
      formData.entries()
    )

    try {
      const response = await fetch(
        'https://formgrid.dev/api/f/your-form-id',
        {
          method: 'POST',
          headers: {
            'Content-Type': 'application/json',
          },
          body: JSON.stringify(data),
        }
      )

      if (response.ok) {
        form.reset()
        successMsg.style.display = 'block'
      } else {
        errorMsg.style.display = 'block'
      }
    } catch {
      errorMsg.style.display = 'block'
    } finally {
      submitBtn.textContent = 'Send Message'
      submitBtn.disabled = false
    }
  })
</script>

Replace your-form-id with the actual endpoint slug from your Formgrid overview tab.

Now import the component on any page:

---
// src/pages/contact.astro
import ContactForm from 
  '../components/ContactForm.astro'
---

<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>Contact</title>
  </head>
  <body>
    <h1>Get In Touch</h1>
    <ContactForm />
  </body>
</html>

Step 5: Receive Submissions Instantly

Whenever someone submits your form you will receive an email notification that looks like this:

New Submission: Astro Contact Form

Name: Allen Jones
Email: allen@example.com
Message: Hi, I would love to work 
         with you on my next project.

Submitted: 10:30 AM, April 9, 2026

Clean. Organized. Ready to act on.

You can also view all submissions
in your Formgrid dashboard at any time.

Every submission is saved to your
dashboard regardless of whether the
email was delivered. You never
lose a submission.

Bonus: Send Astro Form Submissions

to Google Sheets

If you want every form submission to automatically appear as a new row in a Google Sheet with no Zapier and no API setup, this is available on the Professional plan at $16/month.

Here is how it works:

Share a Google Sheet with the Formgrid service account email address. Paste the sheet URL into your form settings. Done.
Every submission flows in automatically as a new row.

Column headers are created from your form field names on the very first submission, so you do not need to set anything up in the spreadsheet.

When to Use a Form Service

vs Building Your Own Backend

Use Formgrid if:

You need a simple contact or enquiry form. You do not want to
build or maintain a backend.
You want instant email notifications. You want spam protection without configuration. You are deploying a static Astro site.
You want submissions saved to a dashboard automatically.

Build your own backend if:

You need custom authentication logic. You need advanced server-side validation.
You want to store submissions in your own database.
You are building a full SaaS application with complex form workflows.

For 90% of Astro portfolios, landing pages, and client websites, a form service is more than enough.

Final Thoughts

Handling form submissions in an Astro site without a backend used to mean hacks, expensive services, or deploying a server you did not need.

With Formgrid, you can:

Build a working contact form in under 5 minutes.
Receive submissions
instantly by email.
Avoid all backend code entirely.
Self-host if you want full data control.
Connect to Google Sheets automatically on the
Professional plan.

If you want a simple, open source, privacy-first way to handle form
submissions in your Astro site, give Formgrid a try.

👉 Try Formgrid free at formgrid.dev

👉 GitHub: github.com/allenarduino/formgrid

Full disclosure: I built Formgrid.
Written as honestly as I could.
Let me know in the comments if
anything looks off.

Tags: #astro #webdev #javascript

tutorial #formgrid

Why Contact Form 7 Emails Look Unprofessional and How to Fix It

Allen Jones — Wed, 08 Apr 2026 14:26:48 +0000

You installed Contact Form 7 on your WordPress site.
Someone fills out your contact form. You receive the email.

And it looks like this:

Or if you are lucky, it looks like this:

From: John Smith
Email: john@example.com
Message: Hello there
_wpcf7: 1234
_wpcf7_version: 5.7
_wpcf7_locale: en_US
_wpcf7_unit_tag: wpcf7-f1-p2-o1
_wpcf7_container_post: 2

Raw field data. Internal WordPress variables.
No structure. No labels.
No context.

If you are an event manager receiving 20 registrations a day, or a small business owner trying to act quickly on client inquiries, this email is a nightmare to read.

This guide explains exactly why CF7 emails look the way they do and gives you two ways to fix it permanently.

Why Contact Form 7 Emails Look So Bad

Contact Form 7 sends notification emails by dumping whatever data it receives into the email body.
It does not know your form's structure.
It does not know which fields are important.
It does not know that your recipient needs to see
Contact Information, Event Details, before Payment Summary.

It just sends everything in one flat list, including internal WordPress fields that your recipient should never see.

Here are the most common problems CF7 users complain about:

Internal fields showing up in every email

CF7 includes internal WordPress variables
like _wpcf7, _wpcf7_version,
_wpcf7_unit_tag, and
_wpcf7_container_post in every
notification email. These are not your
data. They are WordPress internals.
But CF7 sends them anyway.

No section headers

All fields appear in one flat list with no grouping. Name, email, message, event selection, dietary requirements, and payment details are all running together with no separation.

No formatting on long text

Long text values appear as one unbroken paragraph with no line breaks. Reading a multi-paragraph message in a CF7 email is genuinely difficult.

Wrong field order

Fields appear in the order they were submitted, not in a logical reading order. If your form has 20 fields, the email is impossible to scan.

Generic subject line

Every email says "New message from your contact form" with no context
about who submitted or what they selected.
If you receive 50 submissions per day, every email looks identical
in your inbox.

Looks like spam

Because CF7 relies on WordPress PHP
mail for delivery and includes internal fields and raw data.
Gmail and Outlook increasingly treat CF7 notifications as suspicious.
Many CF7 emails end up in spam folders or get rejected entirely.

The problem gets worse the more fields your form has. A simple 3-field contact form is manageable.
But event registration forms, client intake forms, and job application forms can have 20 to 40 fields. When all of that arrives
as one unformatted block, the person reading it has to hunt for the
information they need every single time.

What a Professional Form Email Should Look Like

Instead of a raw data dump, imagine
receiving this for every registration:

Clean. Organized. Readable by anyone.
Whether they are a developer, an event coordinator, or an office manager who just needs to know who is coming and what they paid.

That is what you should be receiving.
Here is how to get there.

Who Does This Problem Affect Most

Event organizers

Workshop registrations, conference entries, and seminar signups.
Your coordinator needs to see attendee details in a logical order, not a random field dump. For a 200-person event, receiving unreadable registration emails is hours of unnecessary work every time.

Small businesses

Client intake forms, service booking forms, and quote request forms. Your team needs to act on submissions quickly.
A clean email means faster response times and fewer mistakes.

Freelancers and consultants

Project brief forms, onboarding forms.
When a new client submits their project brief, you want it formatted like a document you can actually work from, not a wall of raw text.

Nonprofits and community organizations

Volunteer applications, membership forms, and donation forms. Your coordinator needs to process applications efficiently without deciphering raw data.

If you are sending form submission emails to anyone who is not a developer, the default CF7 email format is not good enough.

Fix 1: Customize CF7 Email

Templates Directly

Contact Form 7 does let you customize
your email template. It is not beautiful, but it works for simple forms.

Step 1: Open your CF7 form settings

In your WordPress dashboard, go to Contact and click on your form. Click the Mail tab at the top.

Step 2: Edit the message body

By default, the message body uses the [all_fields] shortcode, which
dumps everything. Replace it with your specific field shortcodes:

From: [your-name]
Email: [your-email]
Phone: [your-phone]

Message:
[your-message]

Replace [your-name], [your-email],
[your-phone], and [your-message]
with the actual field names from your form.

Step 3: Customize the subject line

Change the subject line from the
generic default to something meaningful:

New inquiry from [your-name] 
via [_site_title]

This gives every email a subject line that shows who submitted and where it came from.

Step 4: Remove internal fields

Make sure your message body only includes fields you actually want
to see. Do not include
[_wpcf7], [_wpcf7_version], or any other internal WordPress
variables.

The limitation of this approach

CF7 email customization is plain text.
You can control which fields appear and in what order, but you cannot add section headers, styled layouts, colored backgrounds, or anything
that makes the email look genuinely professional.

For a simple contact form, this is probably enough.
For complex registration forms with 10 or more fields, you will still end up with a long flat list that is hard to scan.

Fix 2: Use Formgrid for Fully Customizable Email Templates

If you want complete control over how your notification emails look
including section headers, branded colors, grouped fields, and custom subject lines, consider switching to Formgrid as your form backend.

Formgrid is an open-source form backend and form builder.
On the Business plan at $29/month, you get full HTML email template control using Mustache templating.
A simple, widely used templating language that lets you write an HTML email with placeholders that get replaced with real submission data automatically.

The available template variables

{{ _formName }}    
Name of your form

{{ _time }}        
Submission timestamp

{{ fieldName }}    
Any field by its exact name attribute

{{# fields }}      
Loop through all fields
  {{ _name }}      Field label
  {{ _value }}     Field value
{{/ fields }}      
Close the loop

Option A: The simple loop for any form

If you just want clean formatted emails without thinking too much about structure use the fields loop. This works for any form automatically:

<div style="font-family: sans-serif; 
            max-width: 600px; 
            margin: 0 auto;">

  <h2 style="color: #1d4f3d;">
    New Submission: {{ _formName }}
  </h2>

  {{# fields }}
  <div style="margin-bottom: 16px; 
              border-bottom: 1px solid #eee; 
              padding-bottom: 16px;">
    <p style="margin: 0; 
              font-size: 12px; 
              color: #888; 
              text-transform: uppercase;">
      {{ _name }}
    </p>
    <p style="margin: 4px 0 0; 
              font-size: 15px; 
              color: #333;">
      {{ _value }}
    </p>
  </div>
  {{/ fields }}

  <p style="font-size: 12px; 
            color: #999;">
    Submitted: {{ _time }}
  </p>

</div>

This renders every field cleanly with its label above and value below. No internal fields. No raw data. No mess.
Clean, readable output for every submission automatically.

Option B: Sectioned template for complex registration forms

If your form has multiple sections, like a workshop registration with
attendee details, session selection, dietary requirements, and payment. You can group fields into sections
with clear headers:

<div style="font-family: sans-serif; 
            max-width: 600px; 
            margin: 0 auto; 
            color: #1f2937;">

  <h2 style="color: #1d4f3d; 
             border-bottom: 2px solid #e8f3ee; 
             padding-bottom: 10px;">
    New Registration: {{ _formName }}
  </h2>

  <h3 style="color: #1d4f3d;">
    Attendee Information
  </h3>
  <p><strong>Name:</strong> {{ name }}</p>
  <p><strong>Email:</strong> {{ email }}</p>
  <p><strong>Company:</strong> {{ company }}</p>
  <p><strong>Phone:</strong> {{ phone }}</p>

  <h3 style="color: #1d4f3d; 
             margin-top: 24px;">
    Session Selection
  </h3>
  <p>
    <strong>Workshop:</strong> 
    {{ workshopName }}
  </p>
  <p><strong>Date:</strong> {{ date }}</p>
  <p><strong>Format:</strong> {{ format }}</p>

  <h3 style="color: #1d4f3d; 
             margin-top: 24px;">
    Payment
  </h3>
  <p>
    <strong>Ticket Type:</strong> 
    {{ ticketType }}
  </p>
  <p>
    <strong>Total:</strong> 
    {{ totalAmount }}
  </p>

  <h3 style="color: #1d4f3d; 
             margin-top: 24px;">
    Notes
  </h3>
  <p>{{ notes }}</p>

  <hr style="margin-top: 32px; 
             border: none; 
             border-top: 1px solid #e5e7eb;" />
  <p style="font-size: 12px; 
            color: #9ca3af; 
            margin-top: 12px;">
    Submitted: {{ _time }}
  </p>

</div>

The variable names like {{ name }},
{{ workshopName }}, and
{{ totalAmount }} must match the
name attributes of your HTML form
inputs exactly:

<input type="text" name="name" />
<select name="workshopName">...</select>
<input type="hidden" name="totalAmount" />

This gives you complete control over
the layout, grouping, and order of
every notification email.

Custom subject lines

You can control the email subject
line using the _subject hidden
field in your HTML form:

<input 
  type="hidden" 
  name="_subject" 
  value="New Registration from {{ name }}"
/>

This means every submission email has
a meaningful subject line like
"New Registration from Sarah Johnson"
instead of the generic
"New form submission."

How to Set Up Custom Email Templates in Formgrid

Custom email templates are available
on the Business plan at $29/month.

Step 1: Go to your form settings

Step 2: Find the Custom Email

Template section

Scroll down to the Custom Email
Template section. If you are on the Business plan, you will see the
full template editor.
If you are on the free or Premium plan, you will see a prompt to upgrade.

Step 3: Enable the custom template

Toggle the custom template on. The
editor pre-populates with a starter
template using the simple fields loop.
A clean starting point that works for
any form immediately.

Step 4: Customize your template

Edit the HTML to match your needs.
Use the simple loop for basic forms or build a sectioned template for
complex registration forms. The available variables panel shows
every variable you can use.

Step 5: Preview and save

Click Preview to see exactly how your
email will look with sample data
substituted in. When you are happy,
click Save Template.

From this point on, every submission to your form will use your custom template.
Clean, organized, and formatted exactly the way you designed.

Step 6: Test it

Submit a test entry on your form and check your inbox.
Your notification email should arrive formatted exactly as you designed.

How to Use Formgrid With WordPress

Formgrid is not a WordPress plugin.
It works through a simple HTML form
or iframe embed in your WordPress
Custom HTML block.

Option A: Replace CF7 with an

HTML form

Step 1: Sign up free at
formgrid.dev.
No credit card required.

Step 2: Create a new form and copy
your endpoint URL from the Overview tab:

https://formgrid.dev/api/f/your-form-id

Step 3: In your WordPress page editor
add a Custom HTML block and replace
your CF7 shortcode with this:

<form 
  action="https://formgrid.dev/api/f/your-form-id"
  method="POST">

  <div>
    <label for="name">Your Name</label>
    <input 
      type="text" 
      id="name" 
      name="name" 
      required />
  </div>

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

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

  <input 
    type="text" 
    name="_honey" 
    style="display:none" />

  <button type="submit">Send Message</button>

</form>

Step 4: Publish the page and submit a test entry.

Option B: Embed the Formgrid form builder

If you do not want to write any HTML, you can build your form using Formgrid's drag-and-drop form builder and embed it in WordPress using an iframe.

Step 1: Build your form in the Formgrid form builder. Drag and drop your fields, customize labels, and click Save.

Step 2: Copy your shareable form
link from the Overview tab.

Step 3: In your WordPress page editor, add a Custom HTML block and paste this embed code:

<iframe 
  src="https://share.formgrid.dev/f/your-form-id"
  width="100%"
  height="600"
  frameborder="0"
  style="border: none;">
</iframe>

Your form is now embedded in your WordPress page, and all submissions go directly to Formgrid.

Formgrid Business Plan Includes

More Than Just Email Templates

Custom email templates are part of the Formgrid Business plan at $29/month
which also includes:

15,000 submissions per month

Auto-responder emails
Automatically send confirmation emails to your form submitters. Every person who registers gets an instant professional confirmation.

Multiple notification recipients
Send submissions to your whole team simultaneously. Everyone who needs to see registrations gets them
in their inbox.

Custom subject lines
Every email has a meaningful subject line showing who submitted and what they selected.

Google Sheets sync
Every submission appears automatically as a new row in your spreadsheet.
No Zapier. No manual copying.

Webhooks
Connect to Slack, Notion, and other tools when a submission arrives.

Priority support
Direct access to the founder for any issues.

CF7 vs Formgrid: Which One

Should You Use

You have a simple 3-field contact 
form and just need basic improvements:

Customize CF7 directly using field shortcodes. 
Takes 10 minutes.
Free.


You have a complex registration form with multiple sections, and your team needs to read submissions quickly:

Switch to Formgrid. Full HTML email template control. Section 
headers. 
Branded colors. Clean, organized notifications.
Business plan at $29/month.


You are non-technical and do not want to touch any code:

Use Formgrid's form builder via iframe. Build your form with drag 
and drop. Upgrade to Business for professional email templates.

The Real Cost of Unreadable

Form Emails

It is easy to think of messy form emails as just a minor annoyance.
But the real cost is higher than it looks.

Every time you receive an unformatted registration email and have to hunt through raw field data to find the information you need, that is time wasted.
For a small team processing 50 registrations per event, that waste
adds up to hours.

Every time you forward an unformatted submission to a colleague, and they have to decode it, that is friction that slows your whole operation down.

And every time a submission arrives looking like spam and gets filtered by Gmail before it ever reaches you. That is a lead or registration you never knew you missed.

Clean, organized notification emails are not a luxury.
They are the difference between a form that works or your business and a form that creates extra work every single day.

Frequently Asked Questions

Can I fix CF7 email formatting
without switching tools?

Yes. Go to your CF7 form settings, click the Mail tab, and replace
[all_fields] with specific field shortcodes in the order you want
them.
This removes internal fields and gives you control over the field
order. It will not give you section headers or HTML styling, but it is a free improvement that takes 10 minutes.

Does Formgrid work with any
WordPress theme?

Yes. Formgrid uses a standard HTML form or an iframe embed. Both work
with any WordPress theme, including Astra, Divi, Elementor, GeneratePress, and Kadence.

What happens to my submissions
if the email fails?

With CF7 and PHP mail, if the email fails, the submission is lost permanently.
With Formgrid, every submission is saved to your dashboard regardless of email delivery.
You can always log in and see every submission ever received.

Can I see a preview before
my template goes live?

Yes. Formgrid's template editor includes a Preview button that shows
you exactly how your email will look with sample data substituted in before you save and go live.

Do I need to know HTML to use
custom email templates?

Basic HTML knowledge helps, but is not required.
The template editor pre-populates with a clean starter template that works immediately.
You can customize colors and layout by editing simple inline CSS values.

Final Thoughts

Contact Form 7 email notifications look the way they do because CF7
was built as a simple form tool, not an email design tool. For basic
contact forms, the default output is acceptable.

But the moment your form gets complex
with multiple sections and many fields, and your recipients need to act quickly on what they receive, the default CF7 email becomes a real problem.

You have two options:

Customize CF7 directly using field shortcodes for a free improvement
that takes 10 minutes.

Or switch to Formgrid for full HTML email template control, section headers, branded colors, custom subject lines, and a submission dashboard that saves every entry regardless of email delivery.

Either way, your notification emails will stop looking like spam and start looking like professional business email communications.

👉 Try Formgrid free at formgrid.dev

Full disclosure: I built Formgrid.
Written as honestly as I could.
Let me know in the comments if
anything looks off.

Why Your WordPress Contact Form Stopped Working in 2026

Allen Jones — Wed, 08 Apr 2026 12:08:32 +0000

You did not change anything.

Your website looks fine. Your contact form is still there.
Visitors can still fill it out and hit submit.
They even see a success message.

But the emails are not arriving.

No submissions in your inbox. No
notifications. Nothing. Just silence.

If this sounds familiar, you are not alone.
Thousands of WordPress site owners experienced the same problem starting in late 2025 and continuing into 2026. And most of them
had no idea why.

This guide explains exactly what happened and gives you two ways to
fix it permanently.

What Changed in Late 2025

In November 2025, Gmail made a fundamental change to how it handles
unauthenticated emails.

Previously, Gmail would route suspicious emails to your spam folder, where you could theoretically still find them.
From November 2025, Gmail started rejecting non-compliant emails entirely at the server level. They never arrive anywhere. Not your inbox. Not your spam folder. They simply disappear.

Microsoft Outlook and Yahoo made similar enforcement changes around the same time. The result was that millions of contact form emails that had been working for years suddenly stopped being delivered
with no warning and no error message.

Your contact form was not broken.
Your hosting server was sending the emails.
But Gmail, Outlook, and Yahoo were quietly rejecting them before they ever reached you.

Why WordPress Contact Forms Are Affected

WordPress sends all emails, including your contact form notifications, using a PHP function called mail(). This function sends emails directly from your web server without any authentication or encryption.

Email providers like Gmail, Outlook, and Yahoo have strict filters that verify whether the server sending an email is authorized to do so. When an email arrives from a random web server with no authentication, those filters mark it as spam or reject it entirely.

Your form is working perfectly. Your hosting server is sending the email. But it never reaches your inbox because
Gmail sees it as suspicious.

Every WordPress contact form plugin is affected:

Contact Form 7: affected
WPForms: affected
Gravity Forms: affected
Ninja Forms: affected
Formidable Forms: affected

The plugin itself is not broken. The problem is WordPress PHP mail, which every plugin depends on by default.

The Five Most Common Reasons Your

WordPress Form Emails Stopped Arriving

Reason 1: Gmail now rejects unauthenticated emails entirely

Before November 2025, Gmail sent suspicious emails to spam.
Now Gmail rejects them at the server level.
They never arrive anywhere. Your form is sending.
Gmail is refusing to accept.

Reason 2: Your host blocks or throttles PHP mail

Many shared hosting providers block or severely limit PHP mail to prevent their servers from being used for spam.
Bluehost, SiteGround, and other popular hosts have increasingly aggressive restrictions on PHP mail.

If you recently changed hosting providers and your contact form emails suddenly stopped working, this is almost certainly the reason.

Reason 3: Your domain has no SPF or DKIM records

SPF and DKIM are email authentication records that tell email providers your server is authorized to send emails from your domain. Without them, your emails look suspicious to spam filters.

Most WordPress PHP mail setups send emails without proper SPF and DKIM authentication, which is why they land in spam or get rejected entirely.

Reason 4: Contact Form 7 default settings use WordPress admin email

CF7, by default, sends notification emails from your WordPress admin email address using your server's PHP mail. If your server's IP address has been flagged for spam by any email provider, your notifications will be blocked or filtered.

Reason 5: No submission backup exists

This is not a deliverability problem, but it makes everything worse. When WordPress PHP mail fails, your submission is lost permanently. There is no dashboard. No submission history.
No way to recover what someone sent you.
If the email fails, you never
know it happened.

The Three Signs Your Contact Form

Is Affected

Sign 1: Your form shows a success message, but you receive nothing

The form submits successfully. The visitor sees a thank-you message. But you never receive the notification
email. This is the most common symptom since Gmail's November 2025 changes.

Sign 2: Emails were working and then suddenly stopped

You had been receiving form notifications for months or years, and then, around late 2025 or early 2026, they stopped arriving without any changes on your end.

Sign 3: Test emails from your form do not arrive

You send a test email from your contact form plugin settings, and it never arrives in your inbox or spam folder.

If any of these match your situation, the fix below will solve it.

Fix 1: Use an SMTP Plugin

The fastest fix for most WordPress users is to replace PHP mail with a proper SMTP connection using a dedicated email service.

SMTP (Simple Mail Transfer Protocol) sends your emails through a proper authenticated email server instead of your web host's PHP mail function. Email providers trust SMTP emails from known services significantly more than PHP mail.

Step 1: Install WP Mail SMTP

WP Mail SMTP is the most popular WordPress SMTP plugin, with over
3 million active installs. Install it from the WordPress plugin directory.

Step 2: Choose an SMTP provider

WP Mail SMTP works with several free
and paid SMTP providers:

Gmail SMTP (free)
If you have a Google Workspace account, you can use Gmail's SMTP server. Free for basic usage. Best for small sites
with low form volume.

Brevo (formerly Sendinblue) (free tier)
300 emails per day are free. Good deliverability. Easy to set up.

Mailgun (free tier)
100 emails per day are free. Excellent deliverability. Requires domain
verification.

Step 3: Configure WP Mail SMTP

Go to WP Mail SMTP settings in your WordPress dashboard. Enter your SMTP credentials from whichever provider you chose.
Send a test email to confirm it is working.

Once configured, all WordPress emails, including your contact form notifications, will be sent through your SMTP provider instead of PHP mail. Deliverability improves immediately.

Fix 2: Use Formgrid as Your Form Backend

If you want more than just reliable email delivery, including a submission dashboard so you never lose a submission again, consider switching to Formgrid as your form backend.

Formgrid is an open-source form backend and form builder that handles your form submissions independently of WordPress.
It handles email delivery through enterprise-grade, authenticated
infrastructure that Gmail and Outlook
accept reliably. Here is the most important difference
between Formgrid and the SMTP fix:

Every submission is saved to your Formgrid dashboard regardless of
whether the email was delivered.

Even if Gmail changes its rules again tomorrow, your submissions are not lost. You can log in to Formgrid and see every submission ever received.

Option A: HTML Form in a WordPress Custom HTML Block

This is the most reliable approach. Instead of using a form plugin, you write a simple HTML form in a WordPress Custom HTML block and point it at your Formgrid endpoint.

Step 1: Sign up free at
formgrid.dev.
No credit card required.

Step 2: Create a new form and copy your endpoint URL from the Overview tab.
It looks like this:

https://formgrid.dev/api/f/your-form-id

Step 3: In your WordPress page editor, add a Custom HTML block and paste this code:

<form 
  action="https://formgrid.dev/api/f/your-form-id"
  method="POST">

  <div>
    <label for="name">Your Name</label>
    <input 
      type="text" 
      id="name" 
      name="name" 
      required />
  </div>

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

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

  <!-- Honeypot spam protection -->
  <input 
    type="text" 
    name="_honey" 
    style="display:none" />

  <button type="submit">Send Message</button>

</form>

Replace your-form-id with your actual
Formgrid endpoint slug.

Step 4: Publish your page and submit
a test entry. Your notification email will arrive
instantly with reliable, authenticated
delivery.

Option B: Embed the Formgrid

Form Builder

If you do not want to write any HTML, you can build your form using Formgrid's drag-and-drop form builder and embed it in WordPress using an iframe.

Step 1: Build your form in the Formgrid form builder. Drag and drop your fields, customize labels, and click Save.

Step 2: Copy your shareable form
link from the Overview tab.

Step 3: In your WordPress page editor, add a Custom HTML block and paste this embed code:

<iframe 
  src="https://share.formgrid.dev/f/your-form-id"
  width="100%"
  height="600"
  frameborder="0"
  style="border: none;">
</iframe>

Your form is now embedded in your WordPress page, and all submissions go directly to Formgrid.

Why Formgrid Solves More Than

Just Deliverability

The SMTP plugin approach fixes your
email deliverability. Formgrid fixes
deliverability and gives you several
things WordPress form plugins cannot:

A submission dashboard
Every submission is saved in your Formgrid dashboard regardless of
whether the email was delivered. You never lose a submission again.

CSV export
Download all your submissions as a spreadsheet anytime. No plugin needed. No data loss.

File uploads
Accept resumes, images, and documents
up to 1GB per file on the Premium plan.

Google Sheets sync
On the Professional plan, every submission appears automatically in
a Google Sheet in real time. No Zapier.
No plugins. No Google API setup.

Spam protection
Built-in honeypot and rate limiting catch bots before they reach your inbox on all plans, including free.

Custom email templates
On the Business plan, you can design exactly how your notification emails look with full HTML control.

Which Fix Should You Use

You want the simplest fix with minimal setup and you are happy with your current form plugin:

Use WP Mail SMTP with a free SMTP provider. Takes 10 minutes. 
Your existing CF7 or WPForms setup stays the same.


You want reliable emails AND a submission dashboard, AND you never 
want to lose a lead again:

Use Formgrid as your form backend.
Submissions saved permanently regardless of email delivery.


You are a non-technical user who does not want to touch any code:

Use Formgrid's form builder embedded via iframe. No coding 
required.

The Honest Limitation of Formgrid

for WordPress

Formgrid is not a WordPress plugin. You cannot install it from the WordPress plugin directory. It requires either adding a custom HTML form to your page or embedding the form builder via iframe.

For users who are comfortable with WordPress Custom HTML blocks, this is a one-time 5-minute setup. For users who want a fully integrated WordPress plugin experience, WP Mail SMTP is the simpler choice.

Both fixes solve the core problem.
Choose the one that matches your technical comfort level.

Frequently Asked Questions

Will fixing this recover submissions
I already missed?

Unfortunately no. Emails rejected at the server level by Gmail are not stored anywhere. They are gone permanently. This is why having a submission dashboard like Formgrid is important going forward. Even if email delivery fails, your submissions are saved.

Will this fix Contact Form 7 emails going to spam?

If you use WP Mail SMTP with a proper SMTP provider, yes.
CF7 will send through your SMTP connection instead of PHP mail, and deliverability improves immediately.

If you switch to Formgrid, your CF7 plugin becomes optional. You can use a simple HTML form instead and bypass CF7 entirely.

Do I need to pay for an SMTP provider?

Most SMTP providers have generous free tiers. Brevo gives you 300 emails per day free. Mailgun gives you 100 emails per day free. For most small business contact forms, these free tiers are more than enough.

Does Formgrid work with any
WordPress theme?

Yes. Formgrid uses a standard HTML form or an iframe embed. Both work
with any WordPress theme, including Astra, Divi, Elementor, GeneratePress, and Kadence.

What happens if I miss a submission?

With a standard WordPress form plugin and PHP mail, a failed email means a lost submission. With Formgrid, every submission is saved to your dashboard regardless of email delivery. You can always log in and see every submission ever received.

Will this happen again?

Email providers will continue to tighten authentication requirements over time.
With SMTP or Formgrid, you are using a properly authenticated email
infrastructure that meets current and future standards. PHP mail will
continue to become less reliable over time.

Final Thoughts

Your WordPress contact form did not stop working because of anything you did.
It stopped because Gmail changed how it handles unauthenticated emails, and WordPress PHP mail has never used proper authentication.

The fix is straightforward:

Replace PHP mail with a proper SMTP connection using WP Mail SMTP and a free SMTP provider. Your emails will reach inboxes reliably from today.

Or switch to Formgrid for a form backend that handles reliable email
delivery, submission storage, Google Sheets sync, and spam protection
all in one place.

Either way, your contact form emails
will stop disappearing.

👉 Try Formgrid free at formgrid.dev

Full disclosure: I built Formgrid.
Written as honestly as I could.
Let me know in the comments if
anything looks off.

Tags: #wordpress #webdev #tutorial