Customer context: The customer wants to change the design of the satisfaction faces (Agent ranking).
Customer: How to change the design of emojis (faces) in LiveAgent?
Answer: You can use the following CSS codes to modify the satisfaction faces in LiveAgent (smiley face, frowny face, neutral face). Add these codes to Configuration > Chat > Chat buttons > Edit chat button > Chat window > Edit custom CSS > Add it and save the changes
.AgentRanking .PunishButton .buttonIcon {
background: url(source);
background-color: red;
order: 3;
}
.AgentRanking .OkButton .buttonIcon {
background: url(source);
background-color: white;
order: 2;
}
.AgentRanking .RewardButton .buttonIcon {
background: url(source);
background-color: green;
order: 1;
}
These CSS commands demonstrate how to change the background colors of the satisfaction faces. Replace "source" with the specific image source if needed. Furthermore, you can change also the order of them. You can further customize these classes to change other aspects of the faces based on your preferences.