--- title: Form element slug: form description: How the Form element works in Personizely widgets: every field type and option, prefilled and hidden fields, phone and date inputs, and what a submit saves. docTags: createdAt: 2026-10-16T20:20:16.996Z --- The Form element collects information from visitors in a widget: email and SMS sign-ups, lead forms, birthday capture or quiz answers. Each submission is saved to the visitor's profile in Personizely, turns anonymous visitors into [Contacts and form submissions](docId\:r6fb_qyzgxzRzBTFzO5AX), and can be synced to your email or SMS platform with [Widget automations](docId\:J2UM-jhfDgQFopQlTvf_l). **Available on:** all platforms. ## How it works 1. **The visitor fills in the form.** In popups and callouts, the first field is focused automatically when the widget opens. 2. **The email is checked as they type.** If the form has an email field, Personizely checks that the address is well formed and that its domain can receive email (or checks it with [Integrations](docId\:YweYsNdyWfChY1Z9KMneN) if you've connected it). An invalid address is marked and the form can't be submitted. 3. **Required fields are checked** on submit. 4. **The submission is saved.** Values are written to the visitor's profile, one profile per visitor. A new value for a field replaces the old one. If the submission includes identifying data such as an email address, the visitor becomes a contact attributed to this widget. 5. **Automations and the action run.** The default action is **Close widget**. New forms also get **Track widget conversion**, so a submit counts as a conversion. If the action is **Open URL** in the same tab, the redirect waits until the submission has been saved. ## Fields Add fields from the **Fields** list in the **Settings** tab. You can use any default field (Email, First name, Phone, Birthdate, consent fields and more) or a [Custom fields](docId\:km7iOXZLplGl8qZlK582W), or create a custom field from the menu. Drag fields to reorder them. A new form contains **First name**, **Email address** and a marketing consent checkbox. ### Field types The input shown depends on the field's type: | Field type | Shown as | Notes | | ------------------- | ---------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------ | | Text, Email, Number | A single-line input | Email fields get the email check above | | Textarea | A multi-line input | | | Phone (tel) | A phone input, optionally with a country code picker | See [Phone numbers](docId:_32XhaAm6KMwlL3_ZIH25) | | Date | A calendar picker or a masked text input | See [Dates](docId:_32XhaAm6KMwlL3_ZIH25) | | Checkbox | One checkbox with the label as its text | Use it for consent fields such as **Marketing consent - Email and SMS**, **Email marketing consent**, **SMS marketing consent** or **Privacy consent** | | Select | A dropdown of the field's choices | The placeholder becomes the empty first option | | Radio | One radio button per choice | One answer | | Multiple | One checkbox per choice | Several answers | ### Field options Click a field to edit it: | Option | What it does | Available for | Values / default | | ------------------------ | --------------------------------------------------------- | ------------------------------------------------------- | ----------------------------------------------------------------------------------------------- | | **Label** | The field's label (also used as its accessible name) | All | Required | | **Placeholder** | Hint text inside the empty input | Text, Textarea, Email, Select, Phone, Date (text input) | Defaults to the label | | **Validation** | A regular expression the value must match | Text, Textarea | Empty (no check) | | **Error message** | Message shown when the value doesn't match **Validation** | Text, Textarea, when a pattern is set | — | | **Width** | Share of the form row the field takes | All | **1/3**, **1/2**, **1/1** (default) | | **Input type** | Calendar picker or typed text | Date | **Calendar** (default), **Text** | | **Format** | Order and separator of a typed date | Date with **Text** input | `MM/DD` by default; DD MM, MM DD, MM DD YYYY, DD MM YYYY, YYYY MM DD, each with `.`, `/` or `-` | | **Include country code** | Adds a country code picker | Phone | On by default | | **Required** | The form can't be submitted without it | All | On for new fields | ### Phone numbers With **Include country code**, the picker is preselected with the visitor's country and the number is saved as `+`, with leading zeros of the local number removed. For example, Moldova and `069 123 456` are saved as `+37369123456`. Without the picker, spaces, dashes and other characters are removed and a leading `+` is kept. ### Dates **Calendar** uses the browser's date picker. **Text** shows a masked input in the format you pick, which is faster on mobile for birthdays. `MM/DD` and `DD/MM` collect a day and month without a year. ## Other settings | Option | What it does | Values / default | | ----------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------- | | **Filled fields** (Advanced) | What to do with fields the visitor already has a value for | **Show empty** (default), **Show prefilled** (fills in the known value), **Hide** (removes the field) | | **Action**, **Conditional actions** | What happens after a successful submit | **Close widget** by default. See [Element actions](docId\:np4Mo44zMksOeF07p7Pw7). **Spin the wheel** is offered when a Wheel of Fortune is on the same step | | **Automation** | Side effects of the submit | **Track widget conversion** added by default | | **Layout** | Stack fields or put them in one row | **Vertical** (default), **Horizontal** | | Justify, Gap | Alignment and space between fields | — | | Components | **Field**, **Label** (hidden by default; still read by screen readers), **Input** (with hover, focus and checked states and a placeholder color), **Submit** (label "Submit") | — | ## Behavior details and limitations - **Submissions overwrite profile values.** A visitor who submits a new email replaces the old one. Personizely keeps one profile per visitor, not a history of submissions. Exports show the current values. See [Contacts and form submissions](docId\:r6fb_qyzgxzRzBTFzO5AX). - **Hidden and prefilled fields wait for visitor data.** With **Show prefilled** or **Hide**, the widget waits until the visitor's profile has loaded before it shows. If every field is hidden, only the submit button remains, so keep at least one field that's never prefilled or use a separate step for known visitors. - **Horizontal layout** puts inputs and the submit button in one row and moves checkboxes below it. **Width** applies to the vertical layout. - **Wheel of Fortune gating.** A form whose action is **Spin the wheel** records the lead on the first submit only. If the wheel lands on **Spin again**, the next spin doesn't create a second submission. - **Only the first email field is checked.** If a widget has several email inputs, the email check applies to the first one. - **Syncing to your ESP.** Submitting the form doesn't send data to Klaviyo, Mailchimp or another platform by itself. Add that platform's automation (for example "Add to list") to the form. See [Integrations](docId\:YweYsNdyWfChY1Z9KMneN). ## Spam protection Email addresses are validated automatically, and you can add Bouncer verification and Google reCAPTCHA v3. To use reCAPTCHA, connect it under **Settings → Integrations** with your reCAPTCHA **secret key** in **API Key** and your site key in **Site Key**, and make sure Google's reCAPTCHA v3 script is loaded on your site (Personizely doesn't load it for you). See [Form spam protection and email validation](docId\:KjsRVFmsQhMDvGZpG7MwY) for setup. ## Examples - **Email capture with consent:** fields **Email** (required) and **Email marketing consent** (checkbox, not required), automation "Add to list" for your ESP, action **Go to step** → a "Thank you" step with a [Coupon and discount codes](docId\:QXkBRk16fS8GFWjEqbW2q). - **Birthday club:** **First name** and **Birthdate** with input type **Text** and format `MM/DD`, **Filled fields: Hide** so known members only see the fields they haven't filled in. - **SMS sign-up:** **Phone** with **Include country code** and **SMS marketing consent**, horizontal layout in a [Bars (top and bottom banners)](docId\:K2SNDFc2Z_GxzUv0L9Ayo). ## Troubleshooting - **The submit button spins and nothing happens** → the email check marked the address invalid. Look for the red outline on the email field. - **Data doesn't reach Klaviyo (or another ESP)** → the form has no integration automation, or the integration isn't connected. Check the form's **Automation** section. - **reCAPTCHA has no effect** → Google's reCAPTCHA v3 script isn't loaded on the page. Add it to your theme. - **A field doesn't show for some visitors** → **Filled fields** is set to **Hide** and they already have a value. ## Related - [Contacts and form submissions](docId\:r6fb_qyzgxzRzBTFzO5AX) - [Form spam protection and email validation](docId\:KjsRVFmsQhMDvGZpG7MwY) - [Custom fields](docId\:km7iOXZLplGl8qZlK582W) - [Survey element](docId\:iW9bvN8cm1r6HwAPlrhSh) - [Widget automations](docId\:J2UM-jhfDgQFopQlTvf_l) - [Change field value automation](docId\:v_G7CVz9VK6VbUALbnYAG)