Go further in customising your forms

You can customise the input fields of your forms or your separators by modifying their size, color and adding different icons. You can also customise your lists in the choice element.

Customise your input fields.

• Go to the options of your field to be modified, Display tab.

• In the "Size of the item" drop-down list, select "Normal", "Greater" or "Smaller" to adjust the size of your field.

• To change the color of a field, click on the "Color" drop-down list:

• To add an icon, click on the "Icon" box and select the one that suits you.

Here is an example where 5 color fields have been configured with the smallest size and we added icons:

• In the "Help text" box, you can enter information needed to understand your field. It will be materialized by a Tooltip.

• Click on Confirm to save your configuration.

Customise your separators.

• Go to the options of your separator then in the Display tab.

• In the "Height" drop-down list select "Large", "Medium" or "Small" to set the size of your separator.
• To change the color of the separator, click on the "Background Color" drop-down list and select the color you want.
• To add an icon to your separator, click on the "Icon" box and select the one that suits you.
• Click on Confirm to save your settings.

Three different separators with different icon, color and size.

Customise your choice fields.

• Go to the Font Awesome Icons website which will allow you to choose your icon(s).
• Click on the desired icon and note the code corresponding to the icon. This code always starts with "fa-".

• In your form, go to the options of your choice field then in the Features tab.
• Fill in the "List items (Label or Code:Label)" field.
• Fill in the "Icons" field with the codes of the desired icons in the same order as the List items entered previously. As a reminder, the codes of the icons begin with "fa-".

• Then, click on Confirm.

Here is the result on your mobile/tablet: