Form Blocks

Checkout Champ allows you to build custom forms or use premade form templates. The form templates available are dependent on the page type you are creating.

 


Form

The form element will add a basic form to your page which you can add more inputs to and style to your needs and preferences.

This form includes the following fields:

  • Name - Input Field for First Name

  • Email - Input Field for Email address

  • Gender - Radio Buttons with Male/Female options

  • Save/Submit Button - Button element which can be configured to perform specific actions based on your preference.


Input

A form input field which can be used to collect custom data.

After selecting an Input element, use the Settings inside the Style Manager to determine which field that the input represents.

Additional instructions for Custom Fields: Applying custom fields to inputs

Additional instructions for Placeholder formats: Placeholders and Input Formats


Label

Use labels to define form elements.


Radio Button

Add a radio button element to your page when you want your visitors to make a selection. A radio button can also perform an action which will expand a page section when selected. This can be configured by specifying an Open Id for your radio button.


Checkbox

Add a checkbox element to your page when you want your visitors to select or acknowledge something on your page. A checkbox can also perform an action which will expand a page section when selected. This can be configured by specifying an Open Id for your checkbox.


Select

This element can be used to provide a drop down menu of different options.

After dropping the Select element to your page, click on the element and view it’s settings under the Style Manager.

Set the Name of the element from the dropdown options. If you choose Card Month, Card Year, Ship Profile, State, Ship State, Country or Ship Country, the options for the customer will automatically appear on the live page.


Select Month & Select Year

These are premade versions of the Select element which are preset to be a month/year selector.


Shopping Cart

Please view this article for more information about the Shopping Cart element.