Flexible Forms

Addon by AddonFoundry

Flexible Forms Main Screenshot

Effortlessly build and manage forms with an intuitive drag-and-drop form builder and revamped Statamic forms user interface.

Flexible Forms simplifies Statamic form management for you and your users. It offers a drag-and-drop form builder and a user-friendly interface tailored for non-developers as well as a pre-built TailwindCSS form template to speed up your form development.

Users can now easily create and manage forms without touching site blueprints, eliminating confusion and saving time.

Features

  • Easily create custom drag-and-drop forms directly in the Statamic control panel.
  • Manage forms without the need to edit site blueprints, perfect for non-developers.
  • Streamlined form navigation between the form builder, submissions, and form settings.
  • Simplified forms user-interface and form field options to simply form management.
  • A prebuilt form template that you can drop straight into your project.
  • Exclude form fields from the form builder to simplify form editing even further.

Flexible Forms integrates seamlessly with existing Statamic forms.

Form Template

To get your forms up and running fast Flexible Forms comes with a pre-built opinionated TailwindCSS form partial that handles all the available form field types, field width and more for you automatically.

This will be published to resources/views/partials in your project on install. Update the form handle in the partial:

{{ form handle="your_form_handle" }} <!-- Add or pass in the form handle here -->

Then include the partial as you would like into your templates as below:

{{ partial:partials/form-builder }}

Note: you will also need to run npm install and npm run build (assuming you are using Vite) to build the TailwindCSS assets for the form partial.

How to Install

You can search for this addon in the Tools > Addons section of the Statamic control panel and click install, or run the following command from your project root:

composer require addonfoundry/flexible-forms

That's it! Flexible Forms will now be available in the Statamic control panel.

How to Use

Once installed Flexible Forms will be available in the control panel.

This addon leverages Statamic's underlying form functionality so any existing forms will already be available in Flexible Forms. Any forms created in Flexible Forms are also available in your site blueprints and Statamic forms.

Click on a form to use the drag and drop form builder, use the sub-navigation to jump to submissions or form settings for your form.

The form field settings available in the form builder are intentionally simplified to make managing forms easier for non-developers and users. Form blueprints can still be edited under blueprints if required for more customization.

Configuration

You can exclude form fields from all flexible forms by uncommenting the fields that you want to hide under config/flexible_forms.php.

<?php

return [
  /**
  * Fields to exclude from all Flexible Forms
  * Note: this won't remove fields already added to a form
  */
  'exclude_fields' => [
    // 'text',
    // 'textarea',
    // 'select',
    // 'checkboxes',
    // 'radio',
    'toggle',
    'integer',
    // 'assets',
    // 'spacer',
  ],
];

Note: Statamic Pro is required to create more than one form.