Building a form

A form is how visitors send you something: a contact request, a booking, a question. In ClickWhale a form is built once under Modules and then placed on as many pages as you like, so you can change a field without touching a single page.

The other item in that menu, Filled out forms, is covered in Reading what people sent you.

Turn the module on first. Under Manage → Settings → Enabled modules, switch on Enable forms module and save. Until you do, the Form component isn't in the editor's component list. The screens below still work, but there's nowhere to put the result.

Creating the form

Add form, top right. The dialog has two tabs.

Basic

Edit

Both accept HTML, which is how you get a link into a consent line: I agree to the <a href="/privacy">privacy statement</a>.

Where a submission goes

The Basic tab's two middle settings decide this:

A submission is never thrown away. If a form has no destination at all, ClickWhale stores it, and the Forms overview shows a notice saying so. A mail that can't be sent is handled the same way: if the message bounces at the server, the submission is stored instead, and the visitor still sees the thank-you.

Adding fields

Click the form's name to open its fields. Add field, top right.

Fields are dragged into order with the handle on the left, and the order you set is the order visitors see.

Field types

Reply To: tick it on the email field where the visitor types their own address, and replying to the notification email replies to them instead of to you. Without it you'll be copying addresses out of emails by hand.

Attachments accept .png, .jpg, .jpeg, .gif, .doc and .docx, and the file travels as an attachment on the notification email. It is not filed in your media library and it isn't kept with the stored submission, so a form that only stores to the database will record the file's name and not the file. If attachments matter, give the form an email address.

Fields and languages

A field belongs to one language. On a site with two languages you need the field twice, once in each, and the two halves have to be linked, or ClickWhale can't tell they're the same question.

Use the + on an existing field's row: pick the other language, type the translated name, comment and placeholder, and save. The type, the required setting and the dropdown values are copied for you, and the two rows stay grouped together on screen.

Don't build the second language with Add field. That creates an unrelated field, and visitors will see both versions on the same form.

On the live site only the fields matching the page's language are shown, so a bilingual form renders correctly on both.

Choosing which fields are on the form

Adding a field with Active ticked puts it on the form immediately. Afterwards, the lower half of the fields screen (Form: your form name) is where you turn fields on and off.

Pick a language from Choose language at the top of that block, tick the fields you want under Active, and press Save. Ticking a field ticks its counterparts in the other languages too.

A field you untick is still there, keeping its settings, ready to be put back. A field you delete is gone from the form for good, although submissions already collected keep their answers.

Tips for good forms

• Short forms get filled in; long ones get abandoned. Name, email, message answers most enquiries. Everything else you can ask in the reply.
• Mark as little as possible required. Every * is a reason to give up.
• Don't ask for anything you don't need. Date of birth, an ID number, health details: if you collect it, you're responsible for it, and a contact form is the wrong place. See Reading what people sent you.
• Use a Title field to break up anything longer than about six questions.

Common issues