HXFE — Code-First Forms

HXFE — Code-First Forms

Details
View on WordPress

HXFE — Code-First Forms is a code-first WordPress form plugin. Instead of building forms in a GUI, you define them as PHP arrays and place a shortcode anywhere.

This means your forms live in your codebase — version-controlled with Git, automatically deployed, and free from database migration issues.

Why code-first?

  • Git history for free — Every change to your form shows up in git diff
  • Deploy without fear — Forms are code, so they deploy with your theme. No more “the form disappeared on production”
  • Dynamic options — Pull select options from get_posts(), taxonomies, or any PHP source. No manual updates
  • One schema, four UIs — Add step_mode: chatbot or one_by_one to transform the same fields into a completely different interface

Four UI modes from one schema

  • Normal form — Classic input confirm complete flow (default)
  • Step form — Multi-page with progress bar (steps array)
  • One-by-one — Question-at-a-time survey style (step_mode: 'one_by_one')
  • Chatbot — Chat bubble interface with typing animation, header, and timestamps (step_mode: 'chatbot')

Key features

  • 15 field types: text, email, tel, url, textarea, select, radio, checkbox, checkbox_group, number, date, file, honeypot, reCAPTCHA, privacy
  • Conditional logic: show_if, required_if, skip_if (hide_if deprecated) — works in chatbot mode too
  • Dynamic routing: to_rules, subject_rules, complete_redirect_rules, complete_html_rules based on submitted values
  • Diagnosis mode: use complete_html_rules without to — show results without sending email
  • Download after submit: download_url shows a download button on the complete screen (document request forms)
  • Form availability window: available_from / available_until with custom before/after HTML
  • Custom validation: pattern, minlength, maxlength, error_message schema keys + hxfe_validate_field and hxfe_validate_form filter hooks
  • Field HTML injection: before_html / after_html schema keys
  • Page slug tracking: subject auto-appended with [form-id@page-slug] for per-page aggregation
  • Webhook support: send to Zapier, Make, Slack, or any HTTP endpoint
  • SMTP built-in: Gmail, SendGrid, Mailgun, or custom SMTP
  • File upload: attached to email, auto-deleted after send
  • IP restriction and password-protected forms
  • iframe embedding with per-form CORS control (allowed_origins)
  • Zero cookies: GDPR/EU cookie-compliant by design
  • Clean default styles: CSS custom properties (design tokens) for easy theme integration, responsive at 768px
  • Schema examples panel in admin: 11 copy-paste samples to get started fast
  • AI-friendly: ships with llms.txt and ai-reference.md for agentic coding tools

Minimum example

add_filter( 'hxfe_schemas', function( $schemas ) {
    $schemas['contact'] = [
        'id'      => 'contact',
        'to'      => 'admin@example.com',
        'subject' => 'Contact: {name}',
        'fields'  => [
            [ 'key' => 'name',  'type' => 'text',     'label' => 'Name',    'required' => true ],
            [ 'key' => 'email', 'type' => 'email',    'label' => 'Email',   'required' => true ],
            [ 'key' => 'body',  'type' => 'textarea', 'label' => 'Message', 'required' => true ],
            [ 'key' => 'hp',    'type' => 'honeypot' ],
        ],
    ];
    return $schemas;
} );

Shortcode: [hxfe_form id="contact"]

Chatbot example

$schemas['support'] = [
    'id'        => 'support',
    'to'        => 'admin@example.com',
    'step_mode' => 'chatbot',
    'bot_name'  => 'Support Bot',
    'bot_icon'  => '🤖',
    'greeting'  => 'Hi! How can I help you today?',
    'fields'    => [
        [ 'key' => 'name',  'type' => 'text',  'label' => 'Name',
          'bot_message' => 'What is your name?' ],
        [ 'key' => 'email', 'type' => 'email', 'label' => 'Email',
          'bot_message' => 'Thanks {name}! What is your email?' ],
        [ 'key' => 'hp', 'type' => 'honeypot' ],
    ],
];

Diagnosis chatbot (no email)

$schemas['diagnosis'] = [
    'id'        => 'diagnosis',
    // No 'to' — result shown without sending email
    'step_mode' => 'chatbot',
    'complete_html_rules' => [
        [ 'when' => ['plan', '==', 'basic'],
          'html' => '<h3>Basic plan recommended</h3><p>Hi {name}!</p>' ],
        [ 'when' => 'default',
          'html' => '<p>Thank you, {name}. We will be in touch.</p>' ],
    ],
    'fields' => [ ... ],
];

Organize schemas in separate files

// functions.php — one line
require_once get_template_directory() . '/inc/hxfe-forms.php';

Or use HXFE as a standalone plugin with glob() auto-loading.

External Services

This plugin optionally connects to Google reCAPTCHA when the recaptcha field type is enabled in a form schema.

What the service is and what it is used for:
Google reCAPTCHA is a spam-prevention service. When enabled, it loads a script from Google’s servers and verifies the user’s response server-side to determine whether the form submission is from a human or a bot.

What data is sent and when:
When a page containing an HXFE form with reCAPTCHA is loaded, the visitor’s browser loads the reCAPTCHA script from google.com. On form submission, the reCAPTCHA token generated in the visitor’s browser is sent to Google’s verification endpoint (https://www.google.com/recaptcha/api/siteverify) along with your site key. No other form field data is transmitted to Google.

reCAPTCHA is disabled by default. It is only active when a site administrator adds a recaptcha field to a form schema and configures valid API keys in the plugin settings.

Links:
* Google reCAPTCHA Terms of Service: https://policies.google.com/terms
* Google Privacy Policy: https://policies.google.com/privacy

Details

Plugin code:
hxfe-code-first-forms
Plugin version:
1.3.7
Outdated:
No
WP version:
6.0 or higher
PHP version:
7.4 or higher
Test up to WP version:
7.0
Total installations:
0
Last updated:
2026-06-10
Rating:
Times rated:
0
chatbot
contact-form
form-builder
htmx
step-form