Star Rating Field For Contact Form 7

Star Rating Field For Contact Form 7 is a free WordPress plugin that adds a fully interactive star rating input field to any Contact Form 7 form. Give your visitors a fast, intuitive way to rate your products, services, content, or experiences — directly inside your existing CF7 forms, with no extra tools or third-party services required.

From product reviews and restaurant feedback to customer satisfaction surveys and event ratings, star ratings are one of the most universally understood UI patterns on the web. This plugin brings that experience natively into Contact Form 7 with multiple icon style choices, required field support, and seamless email integration.

Requires Contact Form 7 to be installed and activated on your WordPress site.

📄 Documentation | 🔴 Live Demo | ⭐ Get Pro Version

Why Use Star Rating Field For Contact Form 7?

Collecting feedback through a plain text field is limiting — most users won’t bother writing a detailed response. A star rating field removes that friction entirely, letting visitors express their satisfaction with a single click.

This plugin makes adding a star rating input to any Contact Form 7 form quick, flexible, and completely free. With 12 different rating icon styles available, you can match the visual look of the rating field to your site’s design — without writing a single line of CSS.

Whether you run an eCommerce store, a restaurant, a SaaS platform, or a personal blog, collecting star-based feedback helps you understand your audience and improve your offerings.

Free Version Features

• Interactive Star Rating Field — Add a fully functional, click-to-rate star input to any Contact Form 7 form using the built-in tag generator. No coding required.

• 12 Rating Icon Styles — Choose from 12 distinct visual icon styles for the star rating field, including stars, medals, faces, and bulb icons — both “on” and “off” states — so you can match the field’s look and feel to your site’s branding.

• Required Field Support — Make the star rating field mandatory. If a user tries to submit the form without selecting a rating, submission is blocked and a validation error is shown — just like any other required CF7 field.

• Email Integration via Mail Tag — Include the submitted star rating value directly in your Contact Form 7 email notifications by inserting the corresponding mail tag into the Mail tab of your form — same as any other CF7 field.

• Unlimited Rating Fields Per Form — Add multiple independent star rating fields to a single CF7 form. Each field works separately with its own name, validation, and email output.

• Default Star Value (Pre-selected Score) — Set a default score so a star is pre-selected when the form loads. Useful for guiding users or suggesting a starting point before they interact.

• Custom Field ID — Assign a custom HTML ID attribute to the rating field for targeting with custom CSS or JavaScript.

• Custom CSS Class — Add one or more CSS class names to the rating field wrapper for flexible front-end customisation without modifying plugin files.

• Mobile Friendly & Touch Compatible — The rating field is fully responsive and works smoothly with touch input on smartphones and tablets.

• Works with All Recent CF7 Versions — Tested and compatible with Contact Form 7 up to version 7.0.

• Lightweight & Fast — Uses the jQuery Raty library for rendering, keeping the added page weight minimal.

Pro Version Features

The Pro version unlocks advanced customisation options for users who need more control over the star rating experience. All options below are available exclusively in the Pro version.

Upgrade to Pro →

• Custom Maximum Rating (Number of Stars) — Change the maximum number of selectable stars. Instead of the default 5-star scale, you can set any number — for example, rate out of 3, 7, or 10. Ideal for scoring systems, NPS-style surveys, or any use case where a custom scale makes more sense.

• Cancel / Reset Button — Add a dedicated cancel button alongside the stars so users can deselect or reset their rating to zero. Useful when you want to give users a clear way to undo an accidental click or change their mind before submitting.

• Cancel Button Icon — “On” State — Choose the icon image displayed for the cancel button when the user hovers over it or it is in its active (highlighted) state. Multiple icon options are available including standard, alternate, and custom cancel icons.

• Cancel Button Icon — “Off” State — Choose the icon image displayed for the cancel button in its default (unhovered) resting state. Keeps the cancel button visually consistent with the rest of your rating field design.

• Cancel Button Placement — Control where the cancel button appears relative to the stars — either to the Left or Right of the rating icons. Helps ensure the layout aligns with your form’s visual flow.

• Custom Star “On” Icon — Select the icon displayed for selected or hovered stars (the filled/active state). Available icon options include star styles 1 and 2, medal, standard star-on, star-off, smiley face, and bulb icons — giving you full control over the active star appearance.

• Custom Star “Off” Icon — Select the icon displayed for unselected stars (the inactive/empty state). Same set of icon options as the “on” state so you can create consistent or contrasting icon pairings.

• Single Star Selection Mode — Enable a mode where only the single star currently being hovered or clicked lights up, rather than all stars up to that point. Useful when you want a distinct single-choice rating experience rather than the standard cumulative highlight.

Get the Pro Version →

Perfect For

• Product review and customer feedback forms
• Restaurant, hotel, or service experience rating forms
• Customer satisfaction (CSAT) surveys
• Event and workshop post-attendance feedback forms
• Online course or content quality rating forms
• Employee, vendor, or supplier evaluation forms
• App or software feature feedback forms
• Any form where quick, visual, one-click feedback collection matters

How It Works

1. Install and activate the plugin (Contact Form 7 must already be active).
2. Open any Contact Form 7 form in the editor.
3. Click Add Form Tag and select Star Rating from the list.
4. In the tag generator panel, configure your field:
   • Tick Required if the rating must be selected before submission
   • Enter a Name for the field (used in the email mail tag)
   • Optionally set an ID, Class, or Default Value (Score)
5. Click Insert Tag to add the shortcode to your form.
6. Go to the Mail tab and insert the mail tag (e.g. [your-rating]) wherever you want the rating value to appear in the notification email.
7. Save the form. The interactive star rating field is now live on your site.