20%
20%

How to Change the Chat Widget Icon on the HighLevel Chat Widget

So want something different from the double chat bubble icon that comes default for the HighLevel chat widget?

Lucky for you there’s a simple bit of code that you can use to change the icon to anything you find in the FontAwesome Free library of icons!

Here’s the code you’ll add below the HighLevel Chat widget code:

<style>
.icon.widget-open-icon svg {
    display: none !important;}

.icon.widget-open-icon:before {
    content: "\f179"; 
    font-family: 'FontAwesome';}
</style>

In the line where it says “content” you’ll replace that with the corresponding Unicode found on the FontAwesome icon page.

That’s all it takes! Be sure to refresh your dashboard if you’re using the chat widget inside of the HighLevel backend and enjoy!

Do you want the HighLevel fast-track?

We bundled all the goodness we created for ourselves over the past 18 months into a complete training to sell more & retain clients longer with HighLevel®.

About HL Pro Tools

HL Pro Tools is the only white label HighLevel® support with a money back guarantee to help your agency sell more & retain clients longer.

Do you want the HighLevel fast-track?

We bundled all the goodness we created for ourselves over the past 18 months into a complete training to sell more & retain clients longer with HighLevel®.