Hooks

Rather than maintaining a full form template, we recommend using Formie's default form template along with your own style using the existing classes and structure.

We provide many template hooks (opens new window) in the form template so that if needed, you can add additional functionality to the form while receiving bug fixes and improvements.

For a full list of available hooks, please refer to the list below.

Form

View this template (opens new window).

HookDescription
formie.form.startThe start of the form element, before the form title (if shown).
formie.form.endThe end of the form element.

Example

Craft::$app->view->hook('formie.form.start', function(array &$context) {
    // Add a variable to be accessible in the context object.
    $context['foo'] = 'bar';

    // Optionally return a string
    return '<p>Hey!</p>';
});

Page

View this template (opens new window).

HookDescription
formie.page.startThe start of the page, before the page legend (if shown).
formie.page.endThe end of the page.

Example

Craft::$app->view->hook('formie.page.start', function(array &$context) {
    // Add a variable to be accessible in the context object.
    $context['foo'] = 'bar';

    // Optionally return a string
    return '<p>Hey!</p>';
});

Buttons

View this template (opens new window).

HookDescription
formie.buttons.beforeBefore the buttons container.
formie.buttons.afterAfter the buttons container.
formie.buttons.startThe start of the buttons container.
formie.buttons.endThe end of the buttons container.
formie.buttons.submit-startThe start of the submit/next page button.
formie.buttons.submit-endThe end of the submit/next page button.
formie.buttons.prev-startThe start of the previous page button (if shown).
formie.buttons.prev-endThe end of the previous page button (if shown).

Example

Craft::$app->view->hook('formie.buttons.before', function(array &$context) {
    // Add a variable to be accessible in the context object.
    $context['foo'] = 'bar';

    // Optionally return a string
    return '<p>Hey!</p>';
});

Field

View this template (opens new window).

HookDescription
formie.field.field-beforeBefore the field container.
formie.field.field-afterAfter the field container.
formie.field.field-startThe start of the field container.
formie.field.input-beforeBefore the input container.
formie.field.input-afterAfter the input container.
formie.field.input-startThe start of the input container.
formie.field.input-endThe end of the input container.
formie.subfield.field-startThe start of the subfield field container.
formie.subfield.field-endThe end of the subfield field container.
formie.subfield.input-beforeBefore the subfield input container.
formie.subfield.input-afterAfter the subfield input container.
formie.subfield.input-startThe start of the subfield input container.
formie.subfield.input-endThe end of the subfield input container.

Example

Craft::$app->view->hook('formie.field.field-before', function(array &$context) {
    // Add a variable to be accessible in the context object.
    $context['foo'] = 'bar';

    // Optionally return a string
    return '<p>Hey!</p>';
});

Control Panel - Edit Submission

When editing a submissions in the control panel, you'll have access to the following hooks.

HookDescription
formie.cp.submissions.editBefore submission detail view’s template blocks.
formie.cp.submissions.edit.contentAfter submission detail view’s main content.
formie.cp.submissions.edit.detailsAfter submission detail view’s existing right sidebar details column.

Example

Craft::$app->view->hook('formie.cp.submissions.edit.content', function(array &$context) {
    // Add a variable to be accessible in the context object.
    $context['foo'] = 'bar';

    // Optionally return a string
    return '<p>Hey!</p>';
});

Control Panel - Edit Sent Notification

When viewing a sent notification in the control panel, you'll have access to the following hooks.

HookDescription
formie.cp.sentNotifications.editBefore submission detail view’s template blocks.
formie.cp.sentNotifications.edit.contentAfter submission detail view’s main content.
formie.cp.sentNotifications.edit.detailsAfter submission detail view’s existing right sidebar details column.

Example

Craft::$app->view->hook('formie.cp.sentNotifications.edit.content', function(array &$context) {
    // Add a variable to be accessible in the context object.
    $context['foo'] = 'bar';

    // Optionally return a string
    return '<p>Hey!</p>';
});

Previous ← Events Next Form →

Get started with Formie

Available for Craft 4. Get it from the plugin store.