All Collections
EmbedReviews
FAQs and Troubleshooting
Custom CSS for EmbedReviews Widgets
Custom CSS for EmbedReviews Widgets

Frequently used CSS classes and attributes to fully customize your reviews widgets

Laze Trajkov avatar
Written by Laze Trajkov
Updated over a week ago

In this article, you will find the most used and needed CSS codes that you can manually apply to your EmbedReviews widgets.

Custom CSS can be applied, inside the widget settings, and on the bottom-left side, you will find the Custom CSS tab:

Find the Custom CSS tab

​Please find below, the Custom CSS codes.

Title stars, height and width:

.es-widget-rating-container .es-star {

height: 36px;

width: 36px;

}

Change the heigh and width of the title stars

Review box border radius and background color:

.es-box {

background-color: green;

padding: 10px;

}

Change the review box border

Review box stars height and width:

.es-stars .es-star {

height: 26px;

width: 26px;

}

Change the stars height and width

Reviewer profile photo/avatar size:


.esu-avatar.es-avatar {

height: 80px;

width: 80px;

}

Change the avatar size

Reviewer name size:


.esu-username.es-username {

font-size: 18px;

}

Change the Author name size

Reviews date size and color:
.esu-date.es-date {

font-size: 16px;

color: grey;

}

Change the date size and color

Reviews font size:
.esu-caption-text.es-text-full.es-text-short {font-size: 18px;}​

Change the font size

If you have any questions, click the bottom right chat icon to talk with our customer success team or send us an email at support@embedsocial.com

We're here for you 🙏​

Did this answer your question?