# How to add Rating Field in Elementor Form

You can easily add a Rating field inside your Elementor Pro form. Please just follow these steps:

* Firstly, make sure you have "**Turned on**" the Rating Field in the **WordPress Admin Panel > Elementor > Advanced Fields > Form Elements Tab.**

<figure><img src="https://657136784-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FbprsJ9yqkDnblQKMr24T%2Fuploads%2FgHlDHrv5iDv1UA1DOHf9%2Fimage.png?alt=media&#x26;token=63737f3e-6eec-4672-a19e-b83b5ce31b45" alt="" width="397"><figcaption></figcaption></figure>

* Search "**Form"** inside the Elementor widgets section.
* It will create a form with the default three fields.
* Select "**Rating**" field type.

<figure><img src="https://657136784-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FbprsJ9yqkDnblQKMr24T%2Fuploads%2FCNaY0JpHha3e9ADP2RRC%2Fimage.png?alt=media&#x26;token=3667954a-6a6f-4b2f-9d87-8466612f13bc" alt="" width="279"><figcaption></figcaption></figure>

* **Required**: Specifies whether providing a rating is mandatory for form submission.
* **Number of Stars**: Sets the total number of stars displayed for the rating.
* **Icon**: Defines the type of icon used for the rating.
* **Unmarked Style**: Specifies how unmarked (non-selected) icons are displayed.
* **Precision Modes**: Determines the precision for rating selection.
  * **Full** (default): Allows selection of whole stars only (e.g., 1, 2, 3 stars).&#x20;
  * **Half**: Allows selection of half-stars (e.g., 2.5 stars).&#x20;
  * **Quarter**: Allows selection of quarter-stars (e.g., 2.25, 2.75 stars).
  * **Exact**: Allows selection with precise fractions.
* **Show Value**: Toggles the display of the numeric value of the selected rating.
* **Quiet**: Controls whether the hover animation on stars is enabled.

***

* Now click on the "**Advanced**" tab.

<figure><img src="https://657136784-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FbprsJ9yqkDnblQKMr24T%2Fuploads%2FPWZG3LNSQlvE0D6aWobN%2Fimage.png?alt=media&#x26;token=0e368754-e502-46d7-a6ec-e53c9f6dc43c" alt="" width="251"><figcaption></figcaption></figure>

* **Default Value**: It lets you choose the default value of the Rating field.

***

* The style settings are inside the style tab of the form widget.

<figure><img src="https://657136784-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FbprsJ9yqkDnblQKMr24T%2Fuploads%2FDdQtwELr8coHdlDjSX0j%2Fimage.png?alt=media&#x26;token=2320b243-db7e-4881-a4b2-0f373e531d2e" alt="" width="307"><figcaption></figcaption></figure>

* **Size**: Adjusts the size of the rating icons.
* **Spacing**: Defines the spacing between the rating icons.
* **Marked Color**: Specifies the color of selected (marked) icons.
* **Unmarked Color**: Sets the color of unselected (unmarked) icons.

## Video Overview

{% embed url="https://files.gitbook.com/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FbprsJ9yqkDnblQKMr24T%2Fuploads%2FSghkZiU3WBgaPgZbtvSx%2Frating-field-demo.mp4?alt=media&token=8ec83a4b-7704-47df-ab98-c36b980aa7ac" %}
