---
title: Example: Create an email sign up form
slug: cms-12/docs/example-create-an-email-sign-up-form
docTags: 
createdAt: 2026-08-10T15:55:54.000Z
---

The following example shows how to create a single form to collect contact information from a visitor (name, email, and additional optional information). It uses the following form elements: [Text](docId\:dGqSQKV0mgM33Efyrw9v5), [Number](docId\:dGqSQKV0mgM33Efyrw9v5), [Text area](docId\:dGqSQKV0mgM33Efyrw9v5), [Hidden visitor profiling](docId\:dGqSQKV0mgM33Efyrw9v5), [Hidden predefined value](docId\:dGqSQKV0mgM33Efyrw9v5), [Reset button](docId\:dGqSQKV0mgM33Efyrw9v5), and [Submit button](docId\:dGqSQKV0mgM33Efyrw9v5). See [Form element types](docId\:iuBeFWU1XVa80qHBgxw9i) for information.

![video icon](https://api.archbee.com/api/optimize/BrbvVORKJ5iIeSMZye5kI/10jtM2V8VQojRBlOM-ZFo-20260720-145557.svg)

Video tutorial: [Demo of an email form](https://optimizely.wistia.com/medias/zvogmr54sw) (5:20 minutes)

1. From the assets panel, select the **Forms** tab.
2. Go to a folder where you want to save the form, or create a folder by clicking the plus icon **+**.
3. From the folder's context menu, select **New Form** and give it a name such as *Email sign up*.
4. Drag form elements onto the form container. The following image shows unedited elements for your new form.

   ![Initial form container before editing](https://api.archbee.com/api/optimize/BrbvVORKJ5iIeSMZye5kI/9J18bKs1DLXQRyyTtDpLU-20260720-145557.png "Initial form container before editing")
5. Hover over a form element to see the element's context menu. Select **Edit** from the context menu.
6. Change the elements as follows (add your own **Placeholder** text) and publish each element:
   - [Text](docId\:dGqSQKV0mgM33Efyrw9v5) – Label the field *First Name* and select the **Required** check box.
   - [Text](docId\:dGqSQKV0mgM33Efyrw9v5) – Label the field *Last Name* and select the **Required** check box.
   - [Text](docId\:dGqSQKV0mgM33Efyrw9v5) – Label the field *Email Address* and select the **Required** and **Email** checkboxes.
   - [Number](docId\:dGqSQKV0mgM33Efyrw9v5) – Label the field *Phone number* and select the **Positive Integer** check box.
   - [Text area](docId\:dGqSQKV0mgM33Efyrw9v5) – Label the field *Comments*.
   - [Hidden visitor profiling](docId\:dGqSQKV0mgM33Efyrw9v5) – Select **Geo: Region Code**. This field is used for internal purposes only and is not displayed to the visitor. Optimizely will log where each visitor (who fills in the form) is located.
   - [Hidden predefined value](docId\:dGqSQKV0mgM33Efyrw9v5) – Enter *Campaign-123* in **Predefined value**. This field is used for internal purposes only and is not displayed to the visitor. You can associate the form with a specific campaign with the predefined value.
   - [Reset button](docId\:dGqSQKV0mgM33Efyrw9v5) – Label the button *Clear*.
   - [Submit button](docId\:dGqSQKV0mgM33Efyrw9v5) – Label the button *Submit form*.

:::Paragraph{indent="1"}
The *Email sign-up* form should look something like the following image.
:::

::Image[]{src="https://api.archbee.com/api/optimize/BrbvVORKJ5iIeSMZye5kI/E7Nvu-eQdw6rLMOU8gh-y-20260720-145557.png" size="100" caption="Form container after editing" alt="Form container after editing" isUploading="false" showCaption="true" indent="2"}

7. Publish the form container. It displays in your Forms list.

   ![Forms list](https://api.archbee.com/api/optimize/BrbvVORKJ5iIeSMZye5kI/4TqkG1UBV2SSiENf5qQNA-20260720-145557.png "Forms list")
8. Drag and drop the form onto a web page and publish the page.

## Test your form

To test your form, enter data into the form on the page in View mode and click **Submit form**. When you submit the data, it is stored in Optimizely.

![Sample email form on a page](https://api.archbee.com/api/optimize/BrbvVORKJ5iIeSMZye5kI/3YA1kMkmvlzzysJU4nWEk-20260720-145557.png "Sample email form on a page")

## View your form submission

To view your test results, go to your *Email sign-up* form in the Forms gadget and select **Form submissions** from the context menu.

![Form submissions menu item](https://api.archbee.com/api/optimize/BrbvVORKJ5iIeSMZye5kI/1X5rJzG0cbJR0PXdbLEln-20260720-145557.png "Form submissions menu item")