Inline rating with reviewers

Customize your Google Reviews one line compact rating widget with CSS. Change colors, fonts, layout, arrows, and more to match your website design.

Remove widget elements

/* remove rating stars */
.reputon-google-reviews-widget .reputon-inline-reviews .reputon-rating-stars {display: none;}

/* remove rating counter */
.reputon-google-reviews-widget .reputon-inline-reviews .reputon-rating-count {display: none;}

/* remove reviews counter */
.reputon-google-reviews-widget .reputon-inline-reviews .reputon-reviews-text {display: none;}

/* remove Google logo */
.reputon-google-reviews-widget .reputon-inline-reviews .reputon-logo {display: none;}

/* remove 'from' */
.reputon-google-reviews-widget .reputon-inline-reviews .reputon-reviews-subtext {display: none;}

/* remove avatars */
.reputon-google-reviews-widget .reputon-inline-reviews .reputon-avatars {display: none;}

---

Change widget color

/* color background color */
.reputon-google-reviews-widget .reputon-inline-reviews .reputon-wrapper {background: pink;}

/* color rating stars */
.reputon-google-reviews-widget .reputon-inline-reviews .reputon-rating-stars {color: pink;}

/* color rating counter */
.reputon-google-reviews-widget .reputon-inline-reviews .reputon-rating-count {color: pink;}

/* color reviews counter */
.reputon-google-reviews-widget .reputon-inline-reviews .reputon-reviews-count {color: pink;}

/* color avatars border */
.reputon-google-reviews-widget .reputon-inline-reviews .reputon-avatar {border-color: pink;}

---

Move widget content

/* move to the start of the block */
.reputon-google-reviews-widget .reputon-inline-reviews .reputon-wrapper {justify-content: flex-start;}

/* move to the end of the block */
.reputon-google-reviews-widget .reputon-inline-reviews .reputon-wrapper {justify-content: flex-end;}

/* move to center of the block */
.reputon-google-reviews-widget .reputon-inline-reviews .reputon-wrapper {justify-content: center;}

---

Hide widget on mobile

@media (max-width: 460px) { 
	.reputon-google-reviews-widget .reputon-inline-reviews {display: none;}}

---

Apply black-and-white filter

.reputon-google-reviews-widget .reputon-inline-reviews {filter: grayscale(100%);}

---

Have questions or need help with CSS? We're here to help: [e-mail] or live chat