Rating Field Element

27/10/2020
IMPORTANT NOTE: This is a Form Element – available only when using the Form Builder in Avada Forms.

The Rating Field Element is used to rate something between a set minimum and maximum number of stars (or other icon). You can see an example of this Element in use in the Survey Prebuilt Form.

View Element Demo Page!

How To Use The Rating Field Element

The Rating Field Element allows you to place checkboxes into your forms.

Step 1. Create a new, or edit and existing Form in the Avada Form Builder.

Step 2. Create, or choose the Column you wish to add the Element into. Click on Add New Element.

Step 3. Choose Rating Field from the Form Elements tab.

Step 4. Go through the options to populate and configure the Element. The Rating Limit can be between 1 and 10, and you can choose which icon and colors you wish to use, as well as the Icon Font Size.

Step 5. Once you have configured the Element, save your page.

Read below for a description of all element options.

Element Options

Location: The edit screen within each Element. You access the Form Builder Elements when adding an Element while editing a Form in the Avada Form Builder (Forms > Form Builder, from the Avada Dashboard).

You can deploy as many individual Elements in your forms as you need, there is no limit. Within each of the Elements, you will see a tab or tabs that house an array of options that make it possible for you to configure each instance of the Element independently, greatly enhancing your flexibility and creative options.

  • Field Label – Enter the label for the input field. This is how users will identify individual fields.

  • Field Name – Enter the field name. Should be single word without spaces. Underscores and dashes are allowed.

  • Required Field – Make a selection to ensure that this field is completed before allowing the user to submit the form.

  • Tooltip Text – The text to display as tooltip hint for the input.

  • Rating Limit – Set the maximum rating that can be given.
  • Rating Icon – Choose icon for rating.
  • Icon Color – Choose icon color for rating. Leave empty for default value.

  • Hover/Active Icon Color – Choose icon color for rating. Leave empty for default value.

  • Icon Font Size – Controls the size of the icon. Enter value including any valid CSS unit, ex: 20px.

  • CSS Class – Allows you to add a class to the wrapping HTML.

  • CSS ID – Allows you to add an ID to the wrapping HTML.

View The Options Screen

Global Options

There are no Global Options for Form Builder Elements.