Forms Overview

Video Tutorial:

Article:

Adding forms to your Convertri pages is easy, and fully customisable.

There are two elements to every form: Form Inputs, which are the elements you drag onto your page for your prospects to enter their details, and the behind the scenes Forms configuration.

Form Configuration

There are two ways to configure your form before you add inputs to your page: API, or HTML. Form API’s let you connect to popular services for easy integration, and HTML lets you embed your own form code.

To connect your service via API:

  1. Click the Forms button in the top toolbar.
  2. In the Configure Forms dialog, click the type of service you want to integrate: Autoresponder, or Webinar. Then, choose your service from the menu.
  3. If you haven’t integrated your service already, you’ll be prompted to open Integrations in a new tab. You can integrate your services (or remove them) at any time by heading to the Dashboard, and clicking Integrations in the left hand menu.
  4. Depending on the service you connect, you’ll be prompted to choose the list you want your form to add prospects to.
  5. Connect the form fields in your service to the form inputs you’ll add to your Convertri page. When you select a field type here, that’s the field the information will be entered into in the autoresponder or webinar service. If you want to collect information that doesn’t have a corresponding field type, you can use any one that isn’t already mapped and match it using the Properties panel when your Form Input elements are selected. Some form fields are fixed, so they cannot be changed.
  6. When you’re done, click Post-Submission Redirect to enter the URL of the page you want your prospects taken to after they click Submit.
  7. Click Done.

You can connect both autoresponder and webinar services to one form, to sign up prospects to both lists at once: simply repeat steps 2-5 to add another service.

Your form is connected to your page, and you can now add form inputs.

To connect your service via HTML:

  1. Click the Forms button in the top toolbar.
  2. In the Configure Forms dialog, click Forms, New Form, and then Form from HTML Code.
  3. Give your form a name, and enter the HTML code for your form. Click Create.
  4. Click the small arrow to the right of your form name to connect it to the page.

Your form is connected to your page, and you can now add form inputs.

When a  form is successfully connected to your page, a red check will appear on the Forms button in the top toolbar.

Form Inputs

Once you’ve connected a form service or HTML form, it’s time to add the form inputs. These are the elements your prospects will interact with on the page.

  1. In the Page Builder, click the Form Elements button in the Elements tray. Choose the input you want to add first, and drag it onto your page.
  2. In the Properties panel, click Form Field settings to map your form fields to the values you assigned when you configured your form service. Assigned field types will be shown in bold on the dropdown. Choose your field type to make sure the input is sent to the form service correctly. If you want to collect information that doesn’t have a corresponding field type, you can use any one that isn’t already mapped and match it using the Forms dialog.
  3. Choose whether this field is Required, and whether you want the field validated, i.e. as a real email address.

Credit card input form elements are already mapped to your payment processor’s settings, so they don’t need to be configured. Likewise, Submit buttons have only one function - to send any data entered - but you can change the text by clicking General Properties.

Bump Sales

Add a Bump Sale by first assigning a product to the page (find out how to do that here), and dragging over a Bump Sale element to create a checkbox which, when selected, will add an additional purchase to a customer’s order.