User Guides for Freeform
Check out the user guides below to see solutions to common problems and questions:
Form Validation
Explore additional validation options for your forms.
Dynamic Data
Learn how to integrate external data dynamically.
Templating
A variety of commonly requested templating tips.
Fields
Implement custom validation or styles on regular field types.
Submission Data
Tips and tricks for handling submission data.
Specialty Forms
Guides for building specialty forms like user registration.
Best Practices
Guides that show best practices with Freeform.
Testing
Testing and troubleshooting guides for your forms.
Headless
Demos of common headless frameworks and GraphQL.
Developer
Guides for custom development and building modules.
Form Validation
Browser Validation with Required Attribute
Explains how to control Freeform's `required` field attributes for better accessibility, validation, and customization options.
Custom Form Validation
Shows how to integrate common client-side form validation frameworks such as Bootstrap, Parsley.js and Foundation Abide.
Preventing Certain Email Addresses
Shows how to prevent specific email addresses from being submitted in Freeform forms using the Blocked Emails integration.
Dynamic Data
Passing Dynamic Data to Forms Popular!
Explains how to pass dynamic data to Freeform forms using Twig variables, custom fields, and context-based data.
Passing a Custom Property to a Formatting Template
Explains how to pass custom properties to Freeform form formatting templates using Twig for flexible form rendering.
Fill Field Values from Query String
Describes how to populate Freeform form fields dynamically from URL query strings using Twig for pre-filling data.
Send Email Notifications only in Certain Scenarios
Explains how to configure email notifications in Freeform for specific scenarios, like conditional recipients and custom templates.
Populate Field Options at Template Level
Covers how to populate field options in Freeform forms dynamically at the template level using Twig variables.
Displaying Submission Data from Previous Pages
Explains how to display submission data from previous pages using Freeform's multi-page form functionality
Templating
AJAX Forms Popular!
Explains how to enable AJAX form submissions, customize success/error handling, and improve user experience without page reloads.
Caching Forms Popular!
Details how to cache forms properly to prevent issues with CSRF tokens, captchas, CDN's, and Stripe forms.
Creating a Custom Formatting Template Popular!
Shows how you can quickly get started with customizing your own formatting templates.
Rendering Form Data as JSON
Shows how to output form field data as JSON for use in JavaScript, APIs, or dynamic front-end behaviors.
Line Breaks in Textarea Fields
Covers preserving or converting line breaks in textarea fields for correct display in emails and templates.
Multiple Instances of the Same Form
Explains how to render the same form multiple times on a page without conflicts, using unique IDs and methods.
Returning Submit to Same Page
Shows how to make form submissions reload the same page, maintaining query strings and anchor tags if needed.
Success Return on Forms
Outlines how to redirect users to another page, section, or custom URL after successful form submission.
Fields
Allow Additional File Extensions Popular!
Describes how to allow custom file types for file upload fields beyond the default permitted extensions.
Range Slider on Number field
Explains how to render number fields as HTML range sliders for better user input control.
Toggle Switch on Checkbox field
Shows how to style checkbox fields as modern toggle switches for enhanced user interface design.
Color Picker on Text field
Demonstrates turning text fields into HTML color pickers to allow users to select colors visually.
TinyMCE Rich Text Editor on Textarea field
Covers how to embed a TinyMCE rich text editor inside textarea fields for better content formatting.
Include an "Other" Option for Fields
Explains how to add an "Other" option to dropdowns, radios, or checkboxes with a custom text input.
Parsing HTML in Field Options
Covers enabling HTML parsing inside field options, allowing advanced customization like icons or inline styling.
Submission Data
Customizing Submission Columns View in Control Panel
Details how to adjust visible field columns for submissions inside the Freeform control panel.
Submission Data on Success Page
Explains how to access newly created submission data after successful form submissions, especially for redirects or AJAX.
Display Total Number of Submissions for a Form
Shows how to display the total count of submissions a form has received using a simple template snippet.
Storing URL Tracking Parameters
Shows how to capture and save marketing or referral URL query parameters into form submissions automatically.
Specialty Forms
Stripe Donation Payment Forms Popular!
Guide to setting up Stripe payments for donation-based forms, allowing dynamic, user-defined payment amounts.
User Registration Forms Popular!
Explains creating a front-end user registration form that saves new users directly into the Craft CMS user system.
Best Practices
How to Stay Informed about Freeform
Outlines options for staying updated on Freeform news, releases, tips, and important plugin announcements.
Form Submitter's Email Address as the Reply-to Email
Shows how to set up admin email notifications so replies go directly to the original form submitter.
Spam Protection Popular!
Covers built-in spam protection methods like honeypots, reCAPTCHA, hCaptcha, and Turnstile, and best practices to reduce spam.
Testing
Troubleshooting Form Issues Popular!
Guide for diagnosing common Freeform issues like AJAX errors, template conflicts, and server misconfigurations.
Email Testing with Mailtrap
Instructions for setting up Mailtrap to safely capture and test outgoing form email notifications without sending real emails.
How to Remove Demo Templates
Quick guide on how to delete Freeform's demo templates to keep your project clean and organized.
Headless
How to Render a Form Popular!
Guide to fetching and displaying Freeform forms using GraphQL queries in headless CMS setups.
Submitting a File using NextJS + AJAX
Instructions for handling file uploads to Freeform forms using a custom API route in a Next.js app.
Vue.js demo
Guides for fetching and submitting Freeform forms through GraphQL and AJAX in Vue.js apps.
React JS demo
Guides for fetching and submitting Freeform forms through GraphQL and AJAX in React JS projects.
Next.js demo
Guides for fetching and submitting Freeform forms through GraphQL and AJAX in Next.js apps.
Developer
Can I make my own integrations or fields? Popular!
Introduction to building custom integrations that connect Freeform forms to third-party APIs and services.
Building a custom Module
Step-by-step guide for creating a custom Freeform module with its own integration logic.
Building a custom Field Type
Instructions for building custom field types to expand Freeform's form field capabilities.
Building a custom CRM integration
How to create custom CRM integrations that push form submission data into customer management platforms.
Building a custom Email Marketing integration
Guide for creating email marketing integrations that push form submission data into email campaign tools.
Building a custom Webhook integration
How to set up custom webhook integrations that send form data to external URLs automatically.
Building a custom Predefined Option
Manage reusable field options globally and apply them across different forms.
Building a custom Export Type
Instructions for creating custom data export types for Freeform submission data.