Do you want to add a rating field to your Gravity Form? For example to rate an experience, article or for another evaluation? With the Survey Add-On you can easily add a Rating field to your webform.
Survey Add-on
The Star Rating field is available after you install the Survey Add-on from Rocketgenius.
How to change the size of the Star Rating?
You can use this CSS code on the page to make the Stars in the Gravity Forms Survey field (much) bigger and make the text transparant or invisible.
.gsurvey-rating:not(:checked) > label, .gsurvey-rating:not(:checked) > label:hover,
.gsurvey-rating:not(:checked) > label:hover ~ label, .gsurvey-rating:not(:checked) > label,
.gsurvey-rating:not(:checked) > label:hover,
.gsurvey-rating:not(:checked) > label:hover ~ label,
.gsurvey-rating > input:checked ~ label {
width: 65px !important;
line-height: 50px !important;
background-size: 50px 50px !important;
color: rgba(221, 221, 221, 0) !important;
}
How to change the Stars in Gravity Forms Star Rating?
You can use this CSS code on the page to change the Gravity Forms Survey Stars images. This code is used in the example of this page. We changed the color of the default stars (and for the hover effect) to match our desired color. This way you can easily change even the image that is being used inside the rating field in Gravity Forms Survey.
.gsurvey-rating > input:checked ~ label {
background-image: url(https://YOURSITE/star1.svg);
}
.gsurvey-rating:not(:checked) > label {
background-image: url(https://YOURSITE/star0.svg);
}
.gsurvey-rating:not(:checked) > label:hover,
.gsurvey-rating:not(:checked) > label:hover ~ label {
background-image: url(https://YOURSITE/star2.svg);
}
Our Premium add-ons for Gravity Forms
JWT Prefill
Fill forms with data you can trust. Prefill Gravity Forms fields with a secure token instead of links with editable url parameters, so your data is accurate, tamper-proof, and ready to use.
DateTime Field
The GravityWP - DateTime Field add-on adds a dedicated Date/Time field to Gravity Forms so users can enter both a date and a time in a single input.
List Number Format
With this Gravity Forms Add-on you can change List Field columns into a number field, do calculations within a row or column. Extra merge tags are available with total counts of columns.
Entry to Database
Integrates Gravity Forms with internal or external databases, offering flexible mapping of form fields to database columns and real-time synchronization between entries and database rows.
Read tutorials about
Gravity Forms Discount Code Field: Apply Fixed or Percentage Discounts in a Form
Learn how to create a Gravity Forms discount code field that applies fixed or percentage discounts. This tutorial shows how to calculate subtotals, discount amounts, and final totals using tested form logic.
Gravity Forms Zoom Integration: Create Zoom Meetings From Booking Forms
Learn how to connect Gravity Forms to Zoom without Zapier using GravityWP API Connector. This step-by-step tutorial shows how to create Zoom meetings from booking form submissions and save the returned meeting details back to Gravity Forms.
Gravity Forms monday.com Integration: Create New Items From Form Submissions
Learn how to connect Gravity Forms to monday.com without Zapier using GravityWP API Connector. This step-by-step tutorial shows how to create new monday.com items from form submissions and save the returned monday.com item ID back to Gravity Forms.
Gravity Forms Pipedrive Integration: Send Form Contacts to Pipedrive Without Zapier
Learn how to connect Gravity Forms to Pipedrive without Zapier using GravityWP API Connector. This step-by-step tutorial shows how to send form contacts, custom fields, and the returned Pipedrive Person ID directly from WordPress to Pipedrive CRM.