Skip to content

Badge Styles

Five layouts, all built from the same three pieces of information: the average rating, a star row, and the review count. They differ in how much of your branding they carry and how much space they take.

Every badge is a single clickable link to the listing it describes.

StyleShowsEmbed size
CompactLogo, brand name, rating, stars, "Based on N reviews"400 × 120
CardLogo and brand name stacked above a large rating, stars, count240 × 200
MinimalRating, stars, count in brackets, small logo250 × 60
DetailedLogo, brand name, oversized rating, stars, count350 × 320
ButtonLogo beside a coloured button reading "N reviews"200 × 60

Choosing which styles exist

Enabled Widget Styles in Settings controls which styles are available at all. A style you turn off disappears from the Elementor dropdown, from the Show All Enabled Styles output, and from the badges your listing owners can generate.

Turn off the ones you do not want owners using. Most sites settle on one or two.

Which style to use where

Compact is the default and the safest choice for a site badge — it carries your logo and name, reads clearly at a glance, and fits a sidebar.

Minimal suits an inline placement, like a line of text or a footer, where a full card would be too much.

Button is the only style that shows no rating at all — just the review count on a coloured button. Turn Show Review Count off and it shows "[Your Brand] Reviews" instead, making it the closest thing to a plain link badge.

Detailed is a landing-page badge. It is tall, and it will look out of place in a sidebar.

Card sits between Compact and Detailed.

Appearance

The badge takes its colours from the plugin's own settings, not from Elementor, so a badge looks the same on your site and on somebody else's — which is the point, since the embedded copy has no access to your theme.

  • Star Colour applies to filled and half stars. Empty stars are always grey.
  • Button Colour, Button Text Colour, Button Border Width and Button Border Colour apply to the Button style only.

Elementor's style tab adds alignment, typography, margin and padding for the badge on your own site. Those do not travel with the embed code.

Half stars

Star rows are drawn to the nearest half. A 4.6 average shows four full stars and one half; a 4.2 shows four full and one empty. The numeric rating beside it is always the real figure to one decimal place.

Built by Code Wattz.