Plain contactform example for Kirby 2

blueprints--contact.yml

title: Contact
pages: false
fields:
  title:
    label: Page
    type:  text
    width: 1/4
  subtitle:
    label: Title
    type:  text
    width: 3/4
    help: If you want a different title from the page name.
  mailto:
    label: Form To
    type:  text
    width: 1/2
  sender:
    label: Form Sender
    type:  text
    width: 1/2

controllers--contact.php

<?php

return function($site, $pages, $page) {

  $alert    = null;
  $messages = null;

  if(r::is('post') && get('submit')) {

    if(!empty(get('website'))) {
      go($page->url());
      exit;
    }

    $data = array(
      'name'    => get('name'),
      'email'   => get('email'),
      'text'    => get('text')
    );

    $rules = array(
      'name'    => array('required'),
      'email'   => array('required', 'email'),
      'text'    => array('required', 'min' => 3, 'max' => 3000),
    );

    $messages = array(
      'name'  => 'Please enter a valid name',
      'email' => 'Please enter a valid email address',
      'text'  => 'Please enter a text between 3 and 3000 characters'
    );

    if($invalid = invalid($data, $rules, $messages)) {
      $alert = $invalid;
    } else {

      $mailto = $page->mailto();
      $sender = $page->sender();

      $email = email(array(
        'to'      => $mailto,
        'from'    => $sender,
        'subject' => $data['name'] . ' contacted you from your website',
        'replyTo' => $data['name'] . '<'.$data['email'].'>',
        'body'    => $data['text']
      ));

      if(v::email($mailto) and v::email($sender) and $email->send()) {
        $success = 'Your message has been sent';
        $data = array();
      } else {
        $failed = 'Something went wrong and your message was not sent.';
      }

    }

  }

  return compact('alert', 'messages', 'data', 'success', 'failed');

};

styles--contact.css

/* Alerts messages
-------------------------------------------------- */
.alert {
  padding: .7rem 1rem;
  font-size: 16px;
  color: #fff;
  background: #111;
  position: relative;
  border-radius: 3px;
}
.alert p {
  margin-bottom: .5rem;
}
.alert p:last-of-type {
  margin-bottom: 0;
}
.alert a {
  color: inherit;
  font-weight: bold;
}
.alert.error {
  background: #f40000;
}
.alert.success {
  background: #5ccc79;
}


/* Forms
-------------------------------------------------- */
form {
  font-size: 1rem;
  padding-top: 1.5em;
}
form .field {
  width: 100%;
  display: inline-block;
  margin-bottom: 1.5rem;
}
form .honeypot {
  position: absolute;
  overflow: hidden;
  width: 0;
  height: 0;
  pointer-events: none;
}
form .alert {
  padding: 0 .5em;
  margin: 0 0 .5em;
  font-size: .86em;
  display: inline-block;
}
form label {
  display: block;
  margin-bottom: .5rem;
  font-weight: 600;
  cursor: pointer;
}
form .field.error label {
  color: #f40000;
}
form input:not([type="button"]):not([type="submit"]),
form textarea {
  width: 100%;
  border: 2px solid #ddd;
  padding: .5rem;
  font-family: inherit;
  font-size: inherit;
  line-height: 1.5em;
}
form input:not([type="button"]):not([type="submit"]):focus,
form textarea:focus {
  border-color: #000;
}
form textarea {
  height: 10em;
  resize: vertical;
}
form button,
form input[type="button"],
form input[type="submit"] {
  padding: .5rem 1.5rem;
  line-height: 1.5em;
  font-family: inherit;
  font-size: inherit;
  border: 0;
  font-weight: 600;
  /*width: 100%;*/
  cursor: pointer;
  background: rgba(0, 0, 0, 0.8);
  color: rgba(255, 255, 255, 0.9);
  box-shadow: 0 2px 3px rgba(0, 0, 0, 0.3);
  transition: color .15s ease-out, background-color .15s ease-out;
  border-radius: 2px;
}
form button::-moz-focus-inner,
form input[type="button"]::-moz-focus-inner,
form input[type="submit"]::-moz-focus-inner {
  border: 0;
  padding: 0;
}
form button:hover,
form input[type="button"]:hover,
form input[type="submit"]:hover {
  background: #000;
  color: #fff
}

templates--contact.php

<?php snippet('header') ?>

  <main class="main" role="main">

    <h1><?= $page->subtitle()->or($page->title()) ?></h1>

    <?php if(isset($success)): ?>
    <div class="alert success">
      <p><?= $success ?></p>
    </div>
    <?php else: ?>

    <?php if(isset($failed)): ?>
    <div class="alert error">
      <p><?= $failed ?></p>
    </div>
    <?php endif ?>

    <form method="post">

      <div class="honeypot">
        <label for="website">Website <abbr title="required">*</abbr></label>
        <input type="website" id="website" name="website" value="<?= isset($data['website']) ? $data['website'] : '' ?>">
      </div>

      <div class="field<?php e(isset($alert['name']), ' error'); ?>">
        <label for="name">Name <abbr title="required">*</abbr></label>
        <?php e(isset($alert['name']), '<span class="alert error">' . html($messages['name']) . '</span>'); ?>
        <input type="text" id="name" name="name" value="<?= isset($data['name']) ? $data['name'] : '' ?>">
      </div>

      <div class="field<?php e(isset($alert['email']), ' error'); ?>">
        <label for="email">Email <abbr title="required">*</abbr></label>
        <?php e(isset($alert['email']), '<span class="alert error">' . html($messages['email']) . '</span>'); ?>
        <input type="email" id="email" name="email" value="<?= isset($data['email']) ? $data['email'] : '' ?>">
      </div>

      <div class="field<?php e(isset($alert['text']), ' error'); ?>">
        <label for="text">Message <abbr title="required">*</abbr></label>
        <?php e(isset($alert['text']), '<span class="alert error">' . html($messages['text']) . '</span>'); ?>
        <textarea id="text" name="text" ><?= isset($data['text']) ? $data['text'] : '' ?></textarea>
      </div>

      <div class="field"><input type="submit" name="submit" value="Submit"></div>

    </form>

    <?php endif ?>

  </main>

<?php snippet('footer') ?>

To use the CSS style, put it in: assets/css/templates/contact.css

And use this code in the header:

<?php echo css(array(
    'assets/css/main.css',
    '@auto',
)) ?>

Enjoy !