Contact form extending

IMPORTANT NOTE: Our free support doesn't cover help with these customisations. Especially because PHP form processing is time-consuming to debug.

But, if you need help with the integration of complex forms, you can hire us to do that for you.

There are five files that rule the contact form:

1. site/plugins/zero-one/snippets/contact/form.php The frontend of the form

2. Controllers:

   • site/plugins/zero-one/controllers/contact.php Controller used for the Contact template page

   • site/plugins/zero-one/controllers/site.php Controller used for Page Builder contact form block.

3. Email templates:

   • site/plugins/zero-one/templates/emails/email.php Plain text email template

   • site/plugins/zero-one/templates/emails/email.html.php HTML email template

Basic knowledge needed

Before going further it is advisable that you have basic knowledge of how PHP contact forms work, and to read through these:

• https://getkirby.com/docs/cookbook/forms/basic-contact-form Basic Kirby contact form

• https://www.one.thezero.club/guide/theme-extending How to properly extend Zero One

New form field example

Let's say you want to add a new field "Company" to the form.

Form frontend

• Copy site/plugins/zero-one/snippets/contact/form.php

• to site/theme/snippets/contact/form.php and open it with your code editor

• also, open https://getuikit.com/docs/form page to see what frontend options are available

Every field must have these attributes:

• Unique

  • name

  • value

• Optional

  • alert

This new field won't be required, but we will create some rule for it.

// New company field
<label for="company">
Company
</label>
<input class="uk-input" type="text" id="company" name="company" value="<?= $data['company'] ?? '' ?>">
<?= isset($alert['company']) ? '<span class="uk-text-danger">' . html($alert['company']) . '</span>' : '' ?>

Controller

• Copy site/plugins/zero-one/controllers/contact.php

• To site/theme/controllers/contact.php

Import data

Now you must add new field data to that controller.

// Recieve data from form
$data = [
    'name'  => get('name'),
    'email' => get('email'),
    'text'  => get('text'),
    // New company field data
    'company'  => get('company')
];

Add rule

Add new rule for that field.

// Field rules
$rules = [
    'name'  => ['required', 'min' => 3],
    'email' => ['required', 'email'],
    'text'  => ['required', 'min' => 3, 'max' => 3000],
    // New company field rule
    'company'  => ['min' => 3, 'max' => 100]
];

Alert message for that rule

Add alert message for that new field.

// Alert messages for the rules
$messages = [
    'name'  => esc($site->labelAlertName()->or('Please enter a valid name')),
    'email' => esc($site->labelAlertEmail()->or('Please enter a valid email address')),
    'text'  => esc($site->labelAlertMessage()->or('Please enter a text between 3 and 3000 characters')),
    // New company field alert message
    'company'  => esc'Please enter a text between 3 and 100 characters'
];

Export data to email

And lastly, export that data to email.

// Export to email
$kirby->email([
    'template' => 'email',
    'from'     => esc($site->email()),
    'replyTo'  => $data['email'],
    'to'       => esc($site->email()),
    'subject'  => esc($data['name']) . ' ' . esc($site->labelEmailSubject()->or('sent you a message from your contact form')),
    'data'     => [
        'text'   => esc($data['text']),
        'sender' => esc($data['name']),
        // New company field data
        'company' => esc($data['company'])
    ]
]);

Now, your new field is ready, the only thing left to do is add that data to email content.

Email content

• Copy site/plugins/zero-one/templates/emails/email.php

• To site/theme/templates/emails/email.php

And

• Copy site/plugins/zero-one/templates/emails/email.html.php

• To site/theme/templates/emails/email.html.php

Now add new "Company" field content to emails.

// Plain text email (email.php)
Hello Company,

Company: <?= $company ?>

<?= $text ?>

Best regards,
<?= $sender ?>

// HTML email (email.html.php)
Hello Company,

<p>Company: <?= $company ?></p>

<p><?= $text ?></p>

<p>Best regards,</p>
<p><?= $sender ?></p>

And that's it!

Your new field is connected and ready to go. You can add as many fields as you like.