Text Input Field
Collect text with precision and flexibility. From simple names to complex patterns with built-in validation, smart formatting, and powerful customization – the Text Input field adapts to any use case with character limits, auto-formatting, and secure password modes.
The Foundation of Every WordPress Form
Perfect for:
Powerful Features for Every Use Case
📏 Smart Length Control
Minimum & Maximum Character Limits
Set the shortest and longest allowed text entries. Prevent submissions that are too short or too long with built-in browser validation.
Real-Time Validation
Users see instant feedback if their entry doesn’t meet length requirements – no surprises after submission.
Examples:
- Username: Min 3, Max 20 characters
- Postal code: Min 5, Max 10 characters
- Name: Min 2, Max 50 characters
- Comment: Max 500 characters
Why It Matters:
Control data quality, prevent spam, ensure database compatibility, and guide users to provide the right amount of information.
✅ Built-In Validation Patterns
6 Pre-Configured Validation Types:
- 1. None – Accept any text (default)
2. Email – Validates proper email format ([email protected])
3. URL – Requires valid web addresses (https://example.com)
4. Letters Only – Only alphabetic characters and spaces (John Doe)
5. Numbers Only – Only numeric digits (123456)
6. Alphanumeric – Letters and numbers, no special characters (User123)
Plus Custom Patterns:
- Define your own regex validation for specialized formats like:
- License plates: `^[A-Z]{3}[0-9]{4}$`
- Product codes: `^[A-Z]{2}[0-9]{6}$`
- Custom formats unique to your business
Instant Feedback:
Users see clear error messages if their input doesn’t match the required format.
✂️ Automatic Whitespace Trimming
Clean Data Automatically
Remove accidental spaces from the beginning and end of text entries. No more ” John ” when you want “John”.
Use Cases:
- Email addresses (no trailing spaces)
- Usernames (no leading spaces)
- Reference codes (exact matches)
- Any field where precision matters
Benefits:
Reduces user errors, improves data consistency, prevents validation issues, and simplifies matching and searching.
🔒 Password Mode
Secure Input Masking
Transform any text field into a password field. Characters appear as dots (•••) to protect sensitive information from shoulder surfers.
Perfect For:
- Password and PIN entries
- Security codes and tokens
- Confidential ID numbers
- Two-factor authentication codes
Smart Behavior:
Password mode automatically disables conflicting features like text transformation and special input types to ensure security.
📱 Smart Input Types
Optimized for Mobile & Desktop:
- Normal Text – Standard text input for general use
- Search – Includes built-in clear button (X) for quick reset
- Telephone – Triggers numeric keypad on mobile devices for easier phone number entry
- URL – Shows specialized mobile keyboard with .com, .org shortcuts
Why It Matters:
The right input type speeds up data entry on mobile, reduces errors, and improves user experience across all devices.
🎨 Automatic Text Transformation
Format Text As Users Type:
- No Transformation – Text stays exactly as entered
- UPPERCASE – Converts all text to capitals (JOHN DOE)
- lowercase – Converts all text to lowercase (john doe)
- Capitalize First Letter – Only first letter uppercase (John doe)
- Title Case – First Letter Of Each Word (John Doe)
Perfect For:
- UPPERCASE: License plates, state codes, product IDs
- lowercase: Email addresses, usernames
- Capitalize: Sentence starts, single names
- Title Case: Full names, addresses, titles
Smart Behavior:
Transformation happens automatically during submission while users see their original input.
🙈 Hidden Field Mode
Invisible Data Fields
Create fields that aren’t visible to users but submit data with the form. Perfect for tracking, referral codes, and system values.
Use Cases:
- UTM tracking parameters
- Referral source IDs
- Form version numbers
- Timestamp markers
- Hidden metadata
How It Works:
Set the “Hidden Value” and it’s automatically included in every form submission without cluttering your form’s UI.
🔀 Conditional Logic
Dynamic Field Visibility
Show or hide text fields based on other form values. Create intelligent forms that adapt to user input.
Advanced Logic Rules:
- AND Logic – All conditions must be met
- OR Logic – Any condition can trigger the action
- 8 Operators – Equals, Not equals, Greater than, Less than, Contains, Is empty, and more
Use Cases:
- Show “Company name” only when user type equals “Business”
- Display “Referral source” when “How did you hear about us?” contains “Referral”
- Hide “Other details” when primary option is not empty
- Reveal “Promo code” when order value is greater than $100
🎯 Enhanced User Experience
Smart Features Built-In:
- Default Values – Pre-fill fields to speed up completion
- Placeholder Text – Show helpful hints before users type
- Help Text – Add descriptions to clarify what to enter
- Required Validation – Make fields mandatory with clear indicators
- Custom CSS Classes – Apply custom styling to match your brand
- Accessibility Support – ARIA labels for screen readers
- Mobile Optimized – Touch-friendly inputs with appropriate keyboards
Simple Setup in 3 Steps
Get your Text Input Field ready in minutes
Add the Text Field
Drag and drop the Text Input field from the Basic Fields section into your form.
Set Validation & Limits
Choose validation type (email, URL, letters, etc.), set min/max character limits, and optionally enable password mode or whitespace trimming.
Configure Formatting
Select input type for mobile optimization, choose text transformation (uppercase, lowercase, etc.), and set default values or placeholders.
🎉 That's it! Your text field is ready with smart validation and formatting.
Real-World Applications
User Registration
* Username fields with length limits
* Password inputs with masking
* Name fields with title case formatting
* Email addresses with validation
Contact Forms
* Full name with title case
* Email validation
* Phone numbers with tel input
* Message/comment fields
E-Commerce
* Promo code entry (uppercase)
* Gift message fields
* Special instructions
* Shipping notes
Business Applications
* Employee ID numbers
* Department names
* Reference numbers
* Internal codes
Applications & Registration
* License numbers
* Certification codes
* Membership IDs
* Custom identifiers
Search & Filtering
* Search input with clear button
* Filter text fields
* Keyword entries
* Query inputs
Complete Field Options
Basic Configuration
- Field Label – The title shown above the text field
- Description/Help Text – Additional guidance for users
- Required Field – Make text entry mandatory
- Placeholder Text – Hint text before users type
Length Validation
- Minimum Length – Fewest characters allowed (validation)
- Maximum Length – Most characters allowed (hard limit)
Default Values
- Default Value – Pre-filled text when the form loads
- Hidden Value – Value for hidden fields (when hidden mode is enabled)
Security & Privacy
- Password Field – Mask input as password (shows dots •••)
Hidden Field – Make field invisible but include in submissions
Data Quality
Trim Whitespace – Remove extra spaces from beginning and end automatically
Validation Rules
- Validation Type
- None (any text)
- Email ([email protected])
- URL (https://example.com)
- Letters only (A-Z only)
- Numbers only (0-9 only)
- Alphanumeric (A-Z and 0-9)
- Custom Pattern (regex)
- Custom Pattern – Regular expression for custom validation (when “Custom” is selected)
Input Types
- Input Type
- Normal Text
- Search (with clear button)
- Telephone (numeric keypad on mobile)
- URL (specialized mobile keyboard)
Text Formatting
- Text Transform
- No transformation
- UPPERCASE
- lowercase
- Capitalize First Letter
- Title Case
Conditional Logic
- Enable Conditional Logic – Show/hide based on conditions
- Logic Type
- All conditions must be met (AND)
- Any condition can be met (OR)
- Condition Rules
- Show/Hide – Action to take
- Field – Which field to check
- Operator – Equals, Not equals, Contains, Greater than, Less than, Is empty, Is not empty
- Value – Comparison value
- Multiple Conditions – Add unlimited rules
Advanced Options
- Custom CSS Classes – Apply custom styling
- Accessibility Attributes – ARIA labels and descriptions
Why Choose Our Text Input Field?
✅ Versatile – Works for names, codes, passwords, and everything in between
✅ Smart Validation – 6+ validation patterns plus custom regex
✅ Mobile Optimized – Appropriate keyboards for each input type
✅ Auto-Formatting – Text transformation happens automatically
✅ Secure – Password mode protects sensitive information
✅ Clean Data – Whitespace trimming prevents common errors
✅ Flexible – Hidden fields, default values, conditional logic
✅ User-Friendly – Clear validation messages guide users
✅ Fully Integrated – Works seamlessly with all form features
Frequently Asked Questions
Q: What’s the difference between min/max length and validation?
Min/max length controls how many characters are allowed. Validation controls which characters are allowed, such as only letters, only numbers, or email format.
Q: Can I validate both length AND format?
Yes. Combine min/max length with validation rules. For example, set min 3, max 15, and alphanumeric validation for a username field.
Q: How does password mode work?
Password mode masks characters with dots, just like typical password fields on login screens.
Q: What does “trim whitespace” do?
It removes leading and trailing spaces before submission so accidental spaces don’t break validation.
Q: Can I create custom validation patterns?
Yes. Use “Custom Pattern” and add a regular expression to enforce any structure you need.
Q: How do text transformations work?
The user types normally, and the system transforms the text on submission, such as converting to Title Case or UPPERCASE.
Q: What’s the search input type for?
It adds a built-in clear (X) button so users can reset the field instantly while searching.
Q: Why use the “tel” input type?
On mobile, it opens a numeric keypad to make entering phone-style digits easier.
Q: Can I use conditional logic with text fields?
Yes. Conditions like “Contains,” “Equals,” or “Is empty” let you show or hide fields based on user input.
Q: What are hidden fields used for?
They store data without being visible to the user, useful for tracking metadata such as UTM tags or referral sources.
Q: Can text fields be used for numbers?
Yes, but use the Number field for calculation or numeric validation. Use Text with “Numbers only” when you need codes or IDs that shouldn’t be treated as numbers.
Q: How precise can regex patterns be?
Regex can enforce extremely specific patterns. Use a regex tester if you need to build or verify complex patterns.
