YOOtheme Form Builder for Joomla and WordPress

The YOOtheme Form Builder by Tonino Gerns adds ten builder elements to YOOtheme Pro: the form itself and nine field types. Every field sits in the builder tree as an element, is configured in the customizer and inherits the styling of your theme. No iframe, no second backend, no styling things twice. Since version 1.6.0, all plugin settings also live in the YOOtheme customizer under Settings, panel [TG] Form Builder: captcha keys, file blocklist, debug log and submission management. Joomla and WordPress get the same feature set.

Fields and validation

The input field covers 13 types, from text and email through number, phone and URL to date, time and color. Per field you set required input with its own error message, min and max values, character lengths, a regex pattern and autocomplete. The email field can ask for a confirmation entry if you want, the text area grows with its content, and the range slider shows its value with prefix and suffix. Select, radio and checkbox take their options as child elements: stacked, inline, as chips or as cards with icon, title and description, in a grid of two to four columns.

Flow: steps, conditions and modal

Multi-step forms are built with step elements. For the progress indicator you choose tabs, pills, a step counter or a progress bar, plus position, alignment per breakpoint and a transition animation. Before submitting, a summary of all entries can be shown, and a choice can lead straight to the next step. If the form should not sit on the page permanently, a trigger button opens it as a modal: width from dialog to full screen, optional title, closing via Esc and backdrop click switchable separately, and automatic closing after a successful submission if you want it.

Any field can be shown or hidden depending on the value of another field. You pick the source field from a dropdown, plus one of five operators. Hidden fields are not validated, not submitted and appear neither in the email nor in the summary.

After submission: success message, redirect, tracking

The success message appears above the form, below it or in both places, and on long forms the browser can scroll smoothly to the message. It can be shown in four styles, get a close icon and hide the form after submission. Alternatively you redirect after a delay and send an event to Google Tag Manager or Google Analytics. With the math or invisible captcha, a form can be submitted several times on the same page load, because the server delivers a new challenge each time.

Email and submissions

Recipient, subject, sender and reply-to are set on the form. You build the email body freely: {name} inserts the value of a field, {all} the table of all fields, and a variable picker shows the available field names as clickable chips. Per field you can output text before or after it, normal or bold, on its own line or inline, or leave the field out of the table entirely. The recipient email and the auto-reply to the sender go out as HTML or plain text, for example for ticket systems.

Submissions can also be stored in a dedicated database table, enabled per form. Creating the table, counters per form, CSV export and deletion are all handled in the customizer panel [TG] Form Builder. The CSV export is generated only on click and downloaded directly - no retrievable file is left on the server. If a form was rebuilt in the meantime, the export combines every field that ever existed as columns.

Spam protection and file upload

The captcha element offers a honeypot, a math challenge with selectable notation, operation and maximum result, and an invisible proof-of-work with adjustable difficulty. All three run entirely on your server, without third parties and without a consent banner. If you prefer, you can enable the Joomla captcha or Google reCAPTCHA in three variants instead; reCAPTCHA can be set to contact Google only after explicit consent. On top of that come a minimum fill-in time with its own error message and an interaction check.

For file uploads you enter the allowed file extensions per field; if the field is left empty, the types configured in the Joomla media manager or in WordPress apply. Both extension and file content are checked, so a renamed file does not get through. Executable, scriptable and macro-enabled formats such as PHP, HTML, SVG, JavaScript or DOCM are blocked by a blocklist regardless of the field configuration. Attachments get a random file name, and the original name appears in the field value of the email. You set the maximum size per file and the number of files; the file is attached to the email and not stored on the server.

Styling and accessibility

Labels sit above or below the field in the classic way, or float animated inside the field. Add to that a stacked or horizontal layout, three field sizes, a borderless style and the submit button with its own text, style, size and width. Several forms on one page do not interfere with each other: field names and IDs stay unique across the page. The fields are real HTML form elements with associated labels, operable by keyboard and readable by screen readers. Success and error messages are live regions with focus, a validation error jumps to the first invalid field, step changes are announced, and the modal returns focus to the button when it closes. The German Accessibility Strengthening Act (BFSG), the German implementation of the European Accessibility Act, has been in force since 28 June 2025; the elements are built to WCAG 2.1 AA from the start.

Quick guide: a form in three steps

1. Insert the Form Builder element from the Tonino Gerns group. Below it you place the field elements - input, select, text area and whatever else you need.
2. Enter the recipient address under Settings. Without it the button stays in demo mode and nothing is sent.
3. Enter a mailbox on your own domain as the sender and choose the form's email field as the reply-to address. That way the email arrives, and you still reply directly to the person who sent it.

Quick guide: multi-step and conditional fields

1. Place a step element between the fields - each one marks the start of a new step.
2. Choose the progress indicator on the form and, if needed, enable the summary before submission.
3. For a conditional field, open its Condition group, pick the source field from the dropdown, and set operator and value.

If a field depends on a field that is itself hidden, it disappears too - you do not have to maintain the cascade by hand.

Quick guide: storing submissions

1. Once, in the YOOtheme customizer under Settings, [TG] Form Builder, create the database table with a click. This never happens automatically.
2. On the form, enable storage under Submissions and give the form a name.
3. Export and deletion run through the same panel in the customizer.

Uninstalling the plugin leaves stored submissions untouched; they are only removed via the delete button.

When something does not work

• The button shows demo mode: the recipient address is missing on the form.
• No email arrives: first check whether your system sends email at all, for example via a password reset. A sender address without a real mailbox behind it is regularly rejected by receiving servers.
• A placeholder stays in the email text: the field name does not match. The variable picker shows the available names as clickable chips.
• reCAPTCHA reports an error: each variant needs its own keys. A key for v2 does not work with v3.
• A file is rejected: the extension is missing from the field list or is on the blocklist. The blocklist can be switched off in the [TG] Form Builder panel; the risk then lies with the email recipient.
• A submission is rejected and you do not know why: switch on the debug log in the [TG] Form Builder panel. It records the reason without storing form values or IP addresses.

On WordPress

Same elements, same settings, same structure in the builder. There are three differences you should know about:

• Spam protection: honeypot, math challenge and invisible proof-of-work are identical. Instead of the Joomla captcha and Google reCAPTCHA you get Friendly Captcha, an EU provider without cookies and without fingerprinting.
• Where the settings are: as on Joomla, in the YOOtheme customizer under Settings, [TG] Form Builder. The WordPress settings page now only holds the download key, without which WordPress does not offer updates for the plugin.
• The debug log is currently only available on Joomla.

Your license key is valid for both platforms.

Requirements

• Joomla 5 or 6, PHP 8.1 or later, YOOtheme Pro 5 (form elements also work with YOOtheme Pro 4.x, the settings panel requires Pro 5)
• WordPress 6.5 or later, PHP 8.2 or later, YOOtheme Pro 5, PHP extension mbstring
• OpenSSL is used to encrypt the form configuration. If the extension is missing, the form keeps working and the configuration stays tamper-proof.