README

This plugin implements a contact form block using Martin Zurowietz' kirby-uniform plugin for Kirby. The block can be easly added to your blueprints and is fully configurable.

It comes with a simple captcha guard and a spam word guard to prevent spam submissions. It also has the uniform honeypot and honeytime guards enabled by default.

The panel block allows adjustments of the labels of the form.

Features

Works out of the box with minimal setup
Comes with an optional basic theme
Choose from 3 layout styles
Optional labels and placeholders
Works with and without JS
Multiple guards already included and mostly ready to go

Getting started

Use one of the following methods to install & use tearoom1/uniform-contact-block:

Composer

composer require tearoom1/uniform-contact-block

Git submodule

If you know your way around Git, you can download this plugin as a submodule:

git submodule add https://github.com/tearoom1/uniform-contact-block.git site/plugins/uniform-contact-block

Clone or download

Clone or download this repository from github: https://github.com/tearoom1/uniform-contact-block.git
Unzip / Move the folder to site/plugins.

If you install the plugin without composer, you have to manually install the dependencies (see below)

Dependencies

Note: Check the corresponding documentation for further information and required configuration. Specifically the uniform.honeytime guard from kirby-uniform is used and needs configuration in your config.php

Multi language requirement

This plugin requires a Kirby multi-language setup. It uses routes that expect the language code as the first segment of the URL. It can easily be stripped down to a single language setup by removing the language code from the routes and a few adjustments.

Usage

Use the block by adding it to you blueprints fieldsets if they are defined:

fieldsets:
  - uniform-contact

Add the javascript to all pages that use this block. E.g. before the closing body tag in the footer.php

<?php snippet('uniform-contact/js'); ?>

And in the <head> if you want to use the default css:

<?php snippet('uniform-contact/css'); ?>

Note: By default, the snippets always load the assets. See below for more details.

Configuration

You may change certain options from your config.php globally:

return [
    'tearoom1.uniform-contact-block' => [
        'enabled' => true, // default true
        'alwaysIncludeAssets' => true, // default true
        'fromEmail' => 'mail@example.org',
        'toEmail' => 'mail@example.org',
        'fromName' => 'My Name',
        'formBrowserValidate' => 'validate',
        'formNameRequired' => true,
        'formEmailRequired' => true,
        'formMessageRequired' => true,
        'formNamePattern' => '[^\s]{3,}',
        'formEmailPattern' => '[^\s@]+@[^\s@]+\.[^\s@]+',
        'theme' => 'basic', // default no theme, use 'basic' for a default theme
    ],
    'uniform.honeytime' => [
        'key' => 'base64:your-key-here',
    ],

];

Options

Option	Default	Description
`enabled`	`true`	Enable the plugin
`alwaysIncludeAssets`	`true`	Always include the assets, even if the block is not present on the page
`fromEmail`		From email address for the contact form
`toEmail`		To email address for the contact form
`fromName`		From name for the contact form
`formBrowserValidate`	`validate`	Browser validate the form, either `validate` or `novalidate`
`formNameRequired`	`true`	Require the name field
`formEmailRequired`	`true`	Require the email field
`formMessageRequired`	`true`	Require the message field
`formNamePattern`	`[^\s]{3,}`	Pattern for the name field
`formEmailPattern`	`[^\s@]+@[^\s@]+\.[^\s@]+`	Pattern for the email field
`theme`		Set to 'basic' for some basic styling

The option alwaysIncludeAssets determines whether the uniform-contact/js and uniform-contact/css snippets are always printing the assets or only if the block is present on the page. Determining the presence of the block is a little expensive logic and may want to be avoided, depending on the setup.

For the honeytime encryption key: You can generate one with the command head -c 32 /dev/urandom | base64 and then append a base64: prefix. See also https://kirby-uniform.readthedocs.io/en/latest/guards/honeytime/

And optional additional configuration for the included plugins. For example:

    'simple-captcha' => [ // https://codeberg.org/refbw/uniform-simple-captcha
        'distort' => false,
        'interpolate' => false,
        'applyEffects' => false,
        'applyNoise' => false,
        'applyPostEffects' => false,
        'applyScatterEffect' => false,
        'textColor' => '#57a514',
        'bgColor' => '#fff',
        'width' => 200,
        'height' => 50,
    ],
    'tearoom1.uniform-spam-words' => [
        'spamThreshold' => 8,
        'spamWords' => [
            10 => ['my important spam word'],
        ],
    ]

Styling

In case you are using the default stylesheet, you can adjust the styling. It uses the following css variables that can be overwritten in your own stylesheet.

--cf-color-success
--cf-color-warning
--cf-color-error
--cf-color-accent
--cf-color-background
--cf-color-spinner
--cf-border-radius
--cf-gap
--cf-padding

Also see the css file for the default styling.

You can use the 'basic' theme for a basic styling if you do not have your own form styling.

License

This plugin is licensed under the MIT License

Credits

Developed by Mathis Koblin

tearoom1 / uniform-contact-block

Maintainers

Details