Formtopia Overview

Formtopia is a complete forms solution that let’s your team build powerful forms more quickly than ever. A modular design creates a high-degree of flexibility in how it can be integrated into your projects. Formtopia consists of:

  • FormML - A markup-style syntax for form definitions

  • Form Store - A cloud-hosted database for all of your form responses

  • FormML-JS - a Javascript module to transform FormML into a web form

Throughout this documentation, you will also find references to these terms:

  • Fields - a label and input displayed on a form

  • Inputs - the element that accepts data from the user

  • Validations - rules used to ensure that data entered into a field is in the correct format

  • Behaviors - advanced functions that may be applied to improve the quality of form entries

  • Theme Flavors - form post-rendering step that enables makes form markup compatible with your theme

  • Entries / Responses - data submitted by completing a form


FormML is a markup-style language used to create form definitions. FormML will be transformed into the rendered form when a web page is constructed or when the browser renders the page contents. A FormML block must contain one or more fields and can optionally include comments, special blocks and front-matter properties.

Field Syntax

Simplest Field Definition

A Field can be defined as simply as specifying the name of the data you would like to collect. For example, name or email or phone. Each field must be seperated by a comma or new-line character.


Simplest form - collecting just a single email.
Collect 3 fields - comma delimited
name, email, phone
Collect 3 fields - new-line delimited
By default, all fields will be 'required'. Forms will not be able to be submitted by a user unless they are completed and in the correct format.

Complete Field Syntax

A field may also include several optional elements for more control.

Full Field Syntax
field_name?:input_type<label | placeholder>
  • field_name - data collected from this field will have this label in the Form Store

  • optional flag - a question mark ? after the field_name makes the field optional. Fields are all required by default.

  • input type - Fields are single-line text inputs by default. If they field name is recognized it may be automatically assigned to a specific type. For example, a field named company_email will automatically be assigned an email input type. To specify the field type, set the input_type name after a colon :

  • label - by default the field label will be a titleized version of the field name. Add angle brackets to specify a different field label.

  • Placeholder - for inputs that support placeholders, you can specify the placeholder after bar | character inside the label brackets. You can specify a lable, or a placeholder or both.


If you would like to add comments to your FormML code, you can use // characters at the beginning of any line

Special Blocks


:fieldset<Label> will group all the inputs below into an HTML Fieldset container with the label provided.


:submit<Label> will change the default label of the Submit button for the form.

Next Steps

Use the index at the left to explore the inputs, behaviors and other details of integrating forms into your site.