Skip to content

Kirby 3.7.5

Search
    Search by Algolia

    Email

    An email input field with validation

    The email field provides the most comfortable way to insert email addresses and has built-in validation for entered addresses.

    Example

    fields:
  email:
    label: Email
    type: email

    Field properties

    Name Type Default Description
    after – Optional text that will be shown after the input
    autocomplete string email Sets the HTML5 autocomplete mode for the input
    autofocus bool – Sets the focus on this field when the form loads. Only the first field with this label gets
    before – Optional text that will be shown before the input
    default – Default value for the field, which will be used when a page/file/user is created
    disabled bool – If true, the field is no longer editable and will not be saved
    help – Optional help text below the field
    icon string email Changes the email icon to something custom
    label – The field label can be set as string or associative array with translations
    maxlength int – Maximum number of allowed characters
    minlength int – Minimum number of required characters
    pattern string – A regular expression, which will be used to validate the input
    placeholder – Custom placeholder text, when the field is empty.
    required bool – If true, the field has to be filled in correctly to be saved.
    spellcheck bool false If false, spellcheck will be switched off
    translate bool true If false, the field will be disabled in non-default languages and cannot be translated. This is only relevant in multi-language setups.
    when – Conditions when the field will be shown (since 3.1.0)
    width string 1/1 The width of the field in the field grid. Available widths: 1/1, 1/2, 1/3, 1/4, 2/3, 3/4

    Use in templates: Encode email field output

    Unlike the email KirbyTag, the email field does not encode your email addresses to prevent misuse by spam bots. If you want to make use of Kirby's built-in email obfuscation, you have several options:

    Using Html::email()

    <?= Html::email($page->email()) ?>

    Using Str::encode()

    <a href="mailto:<?= Str::encode($page->email()) ?>">
    <?= Str::encode($page->email()) ?>
</a>

    Using kirbytag()

    <?= kirbytag([
      'email' => $page->email(),
      'text'  => 'Contact us'
    ]);
?>