Netlify Forms provide a serverless form handling solution that works seamlessly with static sites and Jamstack architectures. For sites hosted on Netlify — including Next.js static exports — Netlify Forms eliminate the need for a separate form backend, server-side processing, or third-party form services. This guide covers setup, spam protection, notification configuration, and integration with CRMs and marketing automation tools.
Basic Form Setup
HTML Form Configuration
Netlify Forms work by detecting form elements during the build process. Add the netlify attribute to any HTML form tag, and Netlify automatically handles submission processing, storage, and notification. No JavaScript or server-side code required for basic functionality.
Essential form attributes:
- netlify attribute: Signals Netlify to process this form (data-netlify="true" for JavaScript-rendered forms)
- name attribute: Identifies the form in your Netlify dashboard — use descriptive names like "contact-form" or "audit-request"
- method="POST": Required for form submission
- action attribute: Redirect URL after successful submission (typically a thank-you page)
Hidden Form Detection
For JavaScript-rendered sites (React, Next.js), Netlify cannot detect forms during the HTML build phase. Add a hidden HTML form in your static HTML that mirrors the JavaScript form's name and fields. This hidden form tells Netlify's build process which forms to expect, while the JavaScript form handles the actual user interaction.
Spam Protection
Honeypot Fields
Add a honeypot field — a hidden form field that real users cannot see but spam bots fill in. When Netlify detects a submission with the honeypot field populated, it flags the submission as spam. Add the netlify-honeypot attribute to your form pointing to a hidden input field named something innocuous like "bot-field."
reCAPTCHA Integration
For additional spam protection, enable reCAPTCHA verification. Netlify supports both reCAPTCHA v2 (checkbox) and invisible reCAPTCHA. Configure via the data-netlify-recaptcha attribute on the form element. For high-value forms like consultation requests, reCAPTCHA provides an additional layer of protection against sophisticated spam.
Notification Configuration
Configure email notifications in the Netlify dashboard under Forms → Notifications. Set up instant email alerts for new submissions so leads are followed up immediately. For team distribution, configure notifications to multiple email addresses or use a shared inbox.
Advanced notification options:
- Email notifications: Instant alerts with form data for immediate follow-up
- Slack integration: Post new submissions to a team Slack channel for fast visibility
- Webhook notifications: Trigger external workflows when forms are submitted — ideal for CRM integration
- Zapier/n8n integration: Connect form submissions to automation workflows for lead routing, email sequences, and CRM entry
CRM and Marketing Automation Integration
Use webhook notifications or Zapier/n8n integrations to push form submissions directly into your CRM. Map form fields to CRM contact properties: name, email, company, and form-specific qualifying data. Trigger appropriate marketing automation sequences based on which form was submitted — a consultation request should trigger a different sequence than a newsletter signup.
Tracking Form Submissions
Configure conversion tracking on the thank-you page to record form submissions in GA4 and Google Ads. Fire a custom event on the thank-you page load, passing the form name as an event parameter. This connects lead generation to traffic source attribution, enabling accurate ROI reporting. Follow our conversion tracking setup guide for complete implementation instructions.
Include form submission volumes and conversion rates in your monthly reporting. Monitor submission quality alongside quantity — high spam volumes may indicate the need for stronger protection, while low submission rates on high-traffic pages signal CRO opportunities.