Adding Your First Form

Add a Form

To put a form on your page drag the Form node from the Page Elements palette to where you want it on the page.

An Add Form modal will appear, where you can automatically create a new table to correspond with your form, or select an existing table. Choosing to create a new table will prompt you to choose your new table name and then insert the form where you dropped the node on the page, while selecting an existing table will simply insert the form where you dropped the node on the page.

The form will automatically add all the fields defined on your table for you. Once a form is inserted, new or existing, you’ll be able to delete or customize those fields in the table by going to the Tables tab at the top of the page, selecting the appropriate table.

Edit Form Fields

Once your form is created, click on the first input to edit it. The edit functionality is located in the Sidebar on the right hand side of the page.

In the Actions & Data tab, you can change what information your user will fill out in the form by clicking on the Associated Data Field dropdown and selecting an existing field or creating a new one. Creating a new field will launch a New Data Field modal, where you’ll be able to name your new field and select the type of field you’re creating. For example, date, phone number, or plain text field. You have the option to make a field required by clicking the Required box.

You can change a field’s title by clicking on the Appearance tab, then editing the Label text in the right hand column. Give your users an example of what information they should enter on your form by filling out placeholder text. For example, a commonly used placeholder text for a Name label is John Doe. You’ll be able to see the changes once you save your work.

Telling the Form What To Do

Selecting the button on the page will open the Sidebar where you can edit the button’s appearance and actions.

You can edit the button copy by clicking on the Appearance tab and changing the Label. Change the button’s style by clicking the dropdown and selecting from your primary, secondary, or danger colors. Learn more about customizing your page’s styles here.

You can add an icon to your button by clicking the Icon dropdown and selecting whichever suits your user’s action best. You can also customize the text color by clicking the Custom Text Color checkbox and selecting the color of your choosing. You can easily add new actions that are triggered when a user clicks the button by going to the Actions & Data tab and clicking on the add action dropdown:

  • Go To… - Send your customers to a confirmation or thank you page when you select either a Record Page or a separate URL.
  • Clear Form - Let your customers know that form submission was successful by simply clearing the form once they click the button. This is useful for forms designed for data entry.
  • Update Record - Automatically update your internal records with any value you set.
  • Send Email - Customize an email that sends to your customer.
  • Slack Notification - Get notified via Slack that a customer filled out your form.
  • Collect Payment - Set a fixed amount that will be collected via Stripe checkout.
1 Like