WordPress Contact Forms — Contact Form 7, WPForms and Gravity Forms Guide
In this tutorial, you'll learn to create contact forms in WordPress using Contact Form 7, WPForms, and Gravity Forms, including spam protection, email notifications, conditional logic, multi-page forms, and form styling.
What You'll Learn
- Why WordPress doesn't include a built-in form builder and why you need a form plugin
- How to set up Contact Form 7 for simple, free contact forms
- How to use WPForms with its drag-and-drop builder
- How to use Gravity Forms for advanced conditional logic and payments
- How to create a standard contact form with Name, Email, Subject, and Message fields
- How to configure email notifications and auto-replies
- How to add spam protection with honeypot fields, reCAPTCHA, Akismet, and Turnstile
- How to use conditional logic to show and hide fields
- How to create multi-page forms
- How to handle file uploads in forms
- How to style forms with CSS classes and custom templates
- How to store form entries in the database
- How to connect forms to email marketing services like Mailchimp, ConvertKit, and Brevo
Why It Matters
Forms are how your visitors get in touch with you. Without a form plugin, you'd need to write custom PHP code to handle form submissions, validate input, send emails, and prevent spam. A form plugin handles all of this with a visual interface. Whether you need a simple "Contact Us" form or a complex multi-page application form with conditional logic, choosing the right form plugin saves development time and ensures reliable delivery.
Real-World Use
A real estate agency needs a property inquiry form. When a visitor clicks "Inquire About This Property," the form shows fields for name, email, phone, and message. If they select "I want to schedule a viewing," conditional logic reveals a date picker and time slot selector. The submission emails the agent, sends an auto-reply to the visitor, and stores the entry in the database. One form plugin handles this entire workflow without custom code.
Learning Path
flowchart LR
A[SEO Plugins] --> B[Contact Forms]
B --> C[Security Plugins]
B --> D[Backup & Migration]
B --> E[Page Builders]
B --> F[Caching Plugins]
Why WordPress Has No Built-In Forms
WordPress core is intentionally lean. Forms are not included because there are dozens of use cases and no single solution fits everyone. Some sites need a simple name-and-email form. Others need multi-page applications with file uploads, payments, and conditional logic. By leaving forms to plugins, WordPress gives you the freedom to choose the solution that matches your needs.
Contact Form 7 — The Free Standard
Contact Form 7 is the oldest and most widely used form plugin for WordPress. It's free, lightweight, and handles basic forms well.
Creating a Form
Contact Form 7 uses shortcodes to define form fields. You don't need a visual builder — you type the field definitions:
[contact-form-7 id="123" title="Contact Form"]
The form editor uses a simple markup language:
<label> Your Name (required)
[text* your-name] </label>
<label> Your Email (required)
[email* your-email] </label>
<label> Subject
[text your-subject] </label>
<label> Your Message
[textarea* your-message] </label>
[submit "Send Message"]
Each field type has its tag syntax:
[text* field-name]— required text field[email* field-name]— required email field[tel field-name]— telephone number field[textarea* field-name]— required text area[select* field-name "Option 1" "Option 2"]— dropdown menu[checkbox* field-name "Option 1" "Option 2"]— checkboxes[radio field-name "Option 1" "Option 2"]— radio buttons[file* field-name]— file upload[acceptance field-name]— acceptance checkbox (for terms)[submit "Button Text"]— submit button
Configuring Email Notifications
The Mail tab in Contact Form 7 settings lets you configure two emails:
To the site admin (notification of new submission):
To: admin@yoursite.com
From: [your-email]
Subject: [your-subject]
Body:
Name: [your-name]
Email: [your-email]
Message: [your-message]
Auto-reply to the user:
To: [your-email]
From: admin@yoursite.com
Subject: Thank you for contacting us
Body:
Dear [your-name],
Thank you for your message. We'll get back to you within 24 hours.
Best regards,
The Team
Contact Form 7 Limitations
- No visual form builder — you write field tags manually
- No conditional logic in the free version
- No form entry storage by default (use Flamingo plugin)
- Limited styling options without custom CSS
- Basic spam protection (needs reCAPTCHA or Akismet add-on)
WPForms — Drag and Drop Simplicity
WPForms is a drag-and-drop form builder with a generous free version.
Creating a Form with WPForms
- Go to WPForms > Add New
- Choose a template from the library (Blank Form, Simple Contact Form, Request a Quote, etc.)
- Drag fields from the left panel to the form preview
- Configure each field's options (label, placeholder, validation, size)
- Set form settings (notifications, confirmations, spam protection)
// WPForms form fields are stored as JSON in the database
// Each form is a custom post type entry
// Form entries are stored in wp_wpforms_entries table
Drag-and-Drop Interface
The WPForms builder shows a live preview of your form. You can:
- Add standard fields (Name, Email, Text, Textarea, Number, Dropdown, Checkboxes)
- Add fancy fields (Password, Phone, Date/Time, URL, File Upload, Hidden)
- Add layout fields (Section Divider, Page Break for multi-page forms)
- Reorder fields by dragging them up and down
- Clone fields to reuse configurations
- Set field size (Small, Medium, Large)
- Set CSS classes for custom styling
Spam Protection in WPForms
WPForms includes multiple spam protection options:
// Enable honeypot (default: on)
add_filter('wpforms_honeypot', '__return_true');
// Enable reCAPTCHA
// Go to WPForms > Settings > CAPTCHA
// Choose v2 Checkbox, v3 Invisible, or hCaptcha
- Honeypot: A hidden field that bots fill in but humans don't see
- reCAPTCHA: Google's "I'm not a robot" or invisible verification
- hCaptcha: Privacy-friendly alternative to reCAPTCHA
- Custom CAPTCHA: Math question or simple text verification
Gravity Forms — The Power User Option
Gravity Forms is a premium-only plugin that offers the most advanced form building capabilities.
Creating a Form with Gravity Forms
- Go to Forms > New Form
- Name your form
- Drag fields from the Standard, Advanced, and Pricing sections
- Configure field properties, validation, and appearance
- Set form settings, notifications, confirmations, and integrations
// Gravity Forms hooks into WordPress differently
// It creates custom database tables for form entries
// gf_entry, gf_entry_meta, gf_form, gf_form_meta
Advanced Features
Conditional Logic: Show or hide fields based on user input:
<!-- If "Do you have a question?" = Yes, show the question field -->
Field: Do you have a question? (Radio: Yes, No)
If Yes is selected, Show: Your Question (Textarea)
If No is selected, Hide: Your Question (Textarea)
Multi-Page Forms: Break long forms into steps:
Page 1: Personal Information
- Name, Email, Phone, Address
Page 2: Inquiry Details
- Subject, Message, File Upload
Page 3: Review and Submit
- Summary of all fields, Submit button
Payment Integration: Collect payments without leaving WordPress:
- Stripe: Credit card payments
- PayPal: Standard and Pro payments
- Square: In-person and online payments
- Authorize.Net: Credit card processing
Third-Party Integrations: Send form data to:
- Mailchimp, ConvertKit, Brevo for email marketing
- Slack for team notifications
- Zapier for 2,000+ app connections
- Salesforce, HubSpot for CRM entries
Form Notifications
Every form plugin supports email notifications. Here's how they work conceptually:
flowchart TD
A[User Submits Form] --> B[Plugin Validates Input]
B --> C{Spam check?}
C -->|Failed| D[Reject submission]
C -->|Passed| E[Send Admin Notification]
E --> F[Send Auto-Reply to User]
F --> G[Store entry in database]
G --> H[Show confirmation message]
Admin Notification
The admin notification goes to the site owner. It contains the form data so you can respond.
Auto-Reply to User
The auto-reply confirms receipt and sets expectations. Always include:
- Thank the user for contacting you
- State when they can expect a response
- Include any relevant information (hours, phone number)
Smart Tags
All three plugins use dynamic tags to insert form values into emails:
Contact Form 7: [your-name], [your-email], [your-message]
WPForms: {field_name}, {field_email}, {admin_email}
Gravity Forms: {Name:1}, {Email:2}, {admin_email}
Spam Protection
Spam is the biggest problem with web forms. Without protection, you'll receive fake submissions, phishing attempts, and advertisements.
Honeypot Technique
A honeypot is a hidden form field that humans don't see but bots fill in. If the hidden field has content, the submission is rejected:
// How a honeypot works conceptually
<input type="text" name="website" style="display:none;" autocomplete="off" />
// Real users never see or fill this field
// Bots auto-fill every field they find
// If this field has content, it's spam
All three form plugins include honeypot protection by default or with minimal setup.
reCAPTCHA
Google's reCAPTCHA comes in three versions:
- v2 Checkbox: Users click "I'm not a robot"
- v3 Invisible: Scores users based on behavior (0.0 to 1.0)
- Enterprise: Google's paid version with advanced signals
// reCAPTCHA v3 returns a score
// 0.0 = definitely a bot, 1.0 = definitely human
// Reject submissions below 0.5
Turnstile by Cloudflare
Turnstile is a privacy-focused alternative to reCAPTCHA. It doesn't require cookies and doesn't track users across sites. It's supported by WPForms and Gravity Forms.
Akismet
Akismet is the same anti-spam service used by WordPress.com comments. Contact Form 7 integrates with Akismet for spam checking of form submissions.
Conditional Logic
Conditional logic makes forms dynamic — fields appear or disappear based on user selections.
Use Cases for Conditional Logic
- Service inquiry: Show different fields based on which service the user selects
- Event registration: Show session selection only if the user is attending
- Order forms: Show shipping fields only if the user selects physical delivery
- Feedback forms: Show a "What went wrong?" field only if rating is below 3 stars
<!-- Example: Survey form with conditional logic -->
Question 1: How satisfied are you? (1-5)
→ If 1-2: Why were you unsatisfied? [textarea]
→ If 4-5: What did you like most? [textarea]
→ If 3: How can we improve? [textarea]
Question 2: Would you recommend us? (Yes/No)
Conditional Logic in Gravity Forms
Gravity Forms has the most advanced conditional logic:
// You can chain multiple conditions
// Show field IF (Field A = "Yes") AND (Field B > 5) OR (Field C = "Urgent")
- Multiple condition groups with AND/OR logic
- Support for all field types (text, numbers, selections, dates)
- Nested conditional logic for complex forms
Multi-Page Forms
Long forms overwhelm users. Multi-page forms break them into manageable steps.
When to Use Multi-Page Forms
- Job applications (multiple sections: personal, experience, education, references)
- Event registrations (attendee info, session selection, payment)
- Insurance quotes (personal details, property details, coverage selection)
- Surveys (long questionnaires broken into sections)
Progress Indicators
Multi-page forms should show users how much progress they've made:
Step 1: Personal Info Step 2: Experience Step 3: Review
[====================>-----------------------]
45% complete
File Uploads in Forms
Sometimes users need to upload files through forms — resumes, images, documents.
// Contact Form 7 file upload field
[file* resume filetypes:pdf|doc|docx limit:5mb]
// WPForms file upload field
// Set max file size, allowed file types, and max number of files
File Upload Best Practices
- Limit file types to what you actually need (PDF, JPG, PNG, DOC)
- Set a reasonable file size limit (5MB is standard)
- Store files in a non-public directory if they contain sensitive information
- Set up server-side file scanning for security
- Clean up old uploads regularly
Form Styling
Default form styling varies by theme. Most forms need custom styling to match your site's design.
CSS Classes
All three form plugins let you add custom CSS classes to individual fields:
<!-- Contact Form 7: Add class to a field -->
[text* your-name class:form-input class:required-field]
<!-- WPForms: Add class in the field settings -->
<!-- Field Options > Advanced > CSS Classes -->
Styling Tips
/* Style a WPForms input field */
.wpforms-field input[type="text"],
.wpforms-field input[type="email"],
.wpforms-field textarea {
border: 1px solid #ccc;
padding: 12px;
border-radius: 6px;
font-size: 16px;
width: 100%;
}
/* Style the submit button */
.wpforms-submit {
background-color: #0073aa;
color: white;
padding: 12px 24px;
border: none;
border-radius: 6px;
font-size: 16px;
cursor: pointer;
}
/* Style error messages */
.wpforms-error {
color: #dc3232;
font-size: 14px;
}
Form Styling Best Practices
- Make input fields large enough (min 44px height for touch targets)
- Use clear labels above fields (not placeholder text as labels)
- Show validation errors inline, next to the field
- Use high-contrast colors for readability
- Test forms on mobile — touch targets should be easy to tap
Storing Form Entries
When visitors submit forms, where does the data go?
Contact Form 7
By default, Contact Form 7 doesn't store entries. They're emailed and gone. Use the Flamingo plugin to store entries in the database.
WPForms
WPForms stores entries by default. You can view them at WPForms > Entries.
Gravity Forms
Gravity Forms stores every submission in custom database tables. View entries at Forms > Entries.
Connecting to Email Marketing
Forms often feed into email marketing systems. When someone fills out a "Subscribe" form, their email should go to your mailing list.
Mailchimp Integration
// Gravity Forms + Mailchimp integration
// Install the Mailchimp add-on
// Configure API key in Forms > Settings > Mailchimp
// Map form fields to Mailchimp fields:
// Email → Email Address
// Name → First Name
// Tags → "Website Lead"
ConvertKit and Brevo
- ConvertKit: Popular with creators and bloggers. Integrates with Gravity Forms and WPForms.
- Brevo (formerly Sendinblue): Affordable email marketing with SMTP. Integrates with all three form plugins.
Common Mistakes
Relying on placeholder text instead of labels. Placeholder text disappears when the user starts typing. Users can't verify what they entered. Use proper
<label>elements above input fields. This also improves Accessibility for screen readers.Not configuring the auto-reply. Most visitors expect a confirmation email after submitting a form. Without an auto-reply, they wonder if their submission went through. Always send an auto-reply that thanks them and sets response time expectations.
Using only CAPTCHA without a honeypot. CAPTCHA adds friction for users and doesn't stop all bots. A honeypot field catches most automated spam silently. Use both: honeypot for bot prevention, CAPTCHA as a second layer.
Forgetting to test form emails. Many WordPress sites have misconfigured email settings. Send a test submission and verify the admin receives the notification email. Use an SMTP plugin like WP Mail SMTP to ensure reliable email delivery.
Building complex multi-page forms without testing. Multi-page forms have more places where things can break: page transitions, data persistence between pages, validation on each step. Test every field combination and every path through the form before publishing.
Practice Questions
A client wants a form that shows a "Booking Date" field only when the user selects "Schedule a Consultation" from a dropdown. Which form plugin feature makes this possible without custom code?
You install Contact Form 7 and create a form, but the admin never receives submission emails. What's the most likely cause, and how do you fix it?
Why should you use a honeypot field in addition to reCAPTCHA? What type of spam does each catch?
Challenge: Build a complete multi-page job application form with WPForms or Gravity Forms. Include: Page 1 (Personal Info: name, email, phone, address), Page 2 (Experience: company, role, years, responsibilities), Page 3 (Skills: checkboxes for skill selection, file upload for resume), Page 4 (Review and Submit). Add conditional logic: if the user has less than 2 years of experience, show an "Education" page. Configure notifications to both the admin and the applicant.
FAQ
Mini Project
Build a complete inquiry form system for a service business.
- Create a main contact form with: Name, Email, Phone, Service Interest (dropdown with 4 options: Web Design, Development, Consulting, Other), Message, and File Upload.
- Use conditional logic: if "Other" is selected, show a text field for "Please specify."
- Configure two email notifications: one to the admin with all details, one auto-reply to the user.
- Add spam protection: honeypot and reCAPTCHA.
- Style the form to match the site's design using CSS.
- Store entries in the database.
- Connect the form to a Mailchimp list (if available) so all submissions are added to a mailing list.
- Test the form on desktop and mobile. Verify that all emails are delivered and entries are stored correctly.
What's Next
Now that you can collect leads through forms, learn to protect your site from attacks:
Continue to Lesson 30: Security Plugins — Harden WordPress with Wordfence, Sucuri, and iThemes Security.
Related lessons:
- SEO Plugins — Optimize your forms for search conversions
- Essential Plugins — Build your complete plugin stack
- PHP Basics — Custom form processing with custom code
Built by the developers of DodaTech
Doda Browser, DodaZIP & Durga Antivirus Pro