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.
- 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
Use one of the following methods to install & use tearoom1/uniform-contact-block:
composer require tearoom1/uniform-contact-block
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 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)
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
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.
Use the block by adding it to you blueprints fieldsets if they are defined:
fieldsets:
- uniform-contactAdd 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.
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',
],
];| 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'],
],
]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-paddingAlso 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.
This plugin is licensed under the MIT License
- Developed by Mathis Koblin
