Decimal Stars Field Formatter

Decimal Stars displays any number field as a row of stars, with support for fractional values. A rating of 3.7 shows three full stars and a fourth star that is 70% filled.

Features

Decimal Stars provides a single field formatter, Decimal Star Rating (SVG & Microdata), for the core Number (decimal), Number (float), and Number (integer) field types. There is no new field type to add and no data to migrate. If your site already stores ratings in a number field, you can switch its display to stars in a few clicks.

• Precise fractional ratings: stars are filled to the exact value stored, rather than being rounded to the nearest whole or half star.
• Scales to your field: the number of stars comes from the field's Maximum setting, so a 5-point, 10-point, or other scale works without extra configuration. Fields without a maximum use five stars.
• Lightweight output: the stars are drawn with a CSS mask on a single element. There are no image files, icon fonts, or JavaScript, and the stars stay sharp at any size or screen resolution.
• Structured data: each rating includes Schema.org Rating microdata (ratingValue, bestRating, and worstRating) that search engines can use for review rich results.
• Accessible: a visible text label, such as "Rated 3.7 out of 5 stars", accompanies the stars. The decorative stars themselves are hidden from screen readers.
• Easy to theme: colors and sizes can be overridden in your theme's CSS, and the markup is in a single Twig template you can override.

Typical use cases include editorial product or gear reviews, restaurant and venue reviews, aggregated scores imported from another system, and any content where an editor enters a rating such as 4.5 or 8.2 and wants it displayed visually.

Post-Installation

The module has no settings page and no permissions. Once it is enabled:

1. Add a Number (decimal), Number (float), or Number (integer) field to your content type or other entity bundle, or use an existing one.
2. In the field settings, set Maximum to the top of your rating scale (for example, 5 or 10). For decimal fields, choose a suitable Scale, such as 1 decimal place.
3. On the bundle's Manage display tab, change the field's format to Decimal Star Rating (SVG & Microdata) and save.

The rating microdata uses itemprop="reviewRating". For it to be valid structured data, place it inside markup for a Schema.org Review (or another type that accepts a review rating), typically in your node template.

Additional Requirements

None beyond Drupal core. The module requires Drupal 10.3 or later and the core Field module.

Similar projects

• Fivestar and Star Rating each provide their own field type for storing ratings, and are geared toward whole-number values. Decimal Stars works with the core number fields you may already be using, and displays decimal values precisely.

Decimal Stars only handles display. It does not provide a voting widget or collect ratings from visitors. If you need site visitors to submit ratings, one of the projects above is a better fit.

Community Documentation

See the README.md file included with the module for configuration and theming details, including the available CSS classes and template variables.