Optimizely Apps & IntegrationsExample: Creating an email sign up form

The following example shows how to create a single form to collect contact information from a visitor Someone who visits a website using a web browser. In most cases, a visitor can use public functions and services but cannot create content and has limited access to community content. In an SEO context, visitor means the number of visits to a URL through channels (external referrers), direct arrivals, and internal links. (See also visitor groups.) (name, email, and additional optional information). It uses the following form elements: Text, Number, Text area, Hidden visitor profiling, Hidden predefined value, Reset button, and Submit button. See Form element types for more information.

  1. From the assets pane, select the Forms tab.
  2. Browse to a folder where you want to save the form, or create a new 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 new form container. The following image shows unedited elements for your new form.

    Image: 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:
    TextLabel the field First Name and select the Required check box.
    TextLabel the field Last Name and select the Required check box.
    TextLabel the field Email Address and select the Required and Email check boxes.
    NumberLabel the field Phone number and select the Positive Integer check box.
    Text areaLabel the field Comments.
    Hidden visitor profilingSelect 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 valueEnter Campaign-123 in Predefined value. This field is used for internal purposes only and is not displayed to the visitor. You can use the predefined value to associate the form with a specific campaign.
    Reset buttonLabel the button Clear.
    Submit buttonLabel the button Submit form.

    The Email sign up form should look something like the following image.

    Image: Form container after editing

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

    Image: 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.

Image: Sample email form on a page

View your form submission

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

Image: Form submissions menu item