Compact rating/sticky compact rating widget

Remove some blocks

/* remove logo */
.reputon-ebay-reviews-widget .reputon-basic .reputon-info .reputon-image {display: none;}
	
/* remove reviews count block */
.reputon-ebay-reviews-widget .reputon-basic .reputon-info .reputon-reviews-count {display: none;}
	
/* remove rating */
.reputon-ebay-reviews-widget .reputon-basic .reputon-rating-stars {display: none;}
logo
reviews counter
rating

Change widget main color

/* Rating stars color */
.reputon-ebay-reviews-widget .reputon-basic .reputon-count-text {color: red;}

/* 'Positive feedback' color */
.reputon-ebay-reviews-widget .reputon-basic .reputon-reviews-marktext {color: red;}

/* Reviews count color */
.reputon-ebay-reviews-widget .reputon-basic .reputon-reviews-count {color: red;}

/* Rating counter color */
.reputon-ebay-reviews-widget .reputon-basic .reputon-count-number {color: red;}

/* change color of the top element */
.reputon-ebay-reviews-widget .reputon-basic .reputon-badge:before {background: skyblue;}
rating stars
positive feedback
reviews counter
rating counter
top border

Change background color

.reputon-ebay-reviews-widget .reputon-basic .reputon-container 	{background: #b8ddd1;}
.reputon-ebay-reviews-widget .reputon-basic .reputon-bt-close {
	background: #b8ddd1;}

/* change color when hover at element */
.reputon-ebay-reviews-widget .reputon-basic .reputon-container:hover {
   	background: #b8ddd1;}

/* Add this code to theme.liquid to change the widget section color. */
<style> 
	section:has(.reputon-ebay-reviews-widget .reputon-basic) {background: #b8ddd1;}}
</style> 

Change widget font

.reputon-ebay-reviews-widget .reputon-basic .reputon-badge {font-family: 'Comic Sans MS' !important;}

Center widget content

.reputon-ebay-reviews-widget .reputon-basic .reputon-content {align-items: center;}

Remove top border

.reputon-ebay-reviews-widget .reputon-basic .reputon-badge:before {content: none;}

Remove shadow and add border

.reputon-ebay-reviews-widget .reputon-basic .reputon-badge {
	box-shadow: none;
	border: 2px solid rgb(79, 206, 106);}

Change widget width

💡 *min width: 205px;*

.reputon-ebay-reviews-widget .reputon-basic .reputon-container {width: 470px !important;}

Add margin above widget

.reputon-ebay-reviews-widget .reputon-basic {margin-top: 100px !important;}

Add margin below widget

.reputon-ebay-reviews-widget .reputon-basic {margin-bottom: 100px !important;}

Move the widget

/* move to the left of the block */
.reputon-ebay-reviews-widget {justify-content: flex-start !important;}
.reputon-ebay-reviews-widget .reputon-basic {margin: 0 !important;}

/* move to the right of the block */
.reputon-ebay-reviews-widget {justify-content: flex-end !important;}
.reputon-ebay-reviews-widget .reputon-basic {margin: 0 !important;}

/* center on mobile devices */
@media (max-width: 640px) {
  .reputon-ebay-reviews-widget .reputon-basic .reputon-badge {transform-origin: center;}}

Apply black-and-white filter

.reputon-ebay-reviews-widget .reputon-basic {filter: grayscale(100%);}

Questions about CSS or need assistance? We're excited to help: support@reputon.com or live chat.

Last updated

Was this helpful?