Thank you for reaching out!
We just checked your website, and it seems everything is working fine at the moment. During our testing, we observed that style-2 was functioning properly, and no issues appeared.
If you’re experiencing this problem with another style, could you please provide some additional details:
• Which style number causes the issue?
• Could you share a screenshot of the issue? (we can upload the image easily at https://snipboard.io/ and share the link here.)
Usually, these types of visual glitches occur due to the theme’s CSS overriding. However, we’d be more than happy to investigate further and resolve this promptly. Your feedback will also help improve the plugin for everyone.
Thanks again! Looking forward to your response.
Hello, I have attached the screenshot and this is the link: https://snipboard.io/dhP8cw.jpg I am using Style 2 and you will note that the online icon when you click the WhatsApp button in my chat that’s where the issue arises from, below “WhatsApp Us” when clicked you will see that it shows much wider.
I am using LiteSpeed Cache so i made sure i Purge All to make sure it wasn’t the one interrupting and still to no avail.
Hi @phillipjotham,
Sorry that we didn’t identify the issue in the first message. When initially checked on one OS its worked; everything appeared to be working correctly. https://snipboard.io/iwzxLa.jpg.
But after the second message, we looked deeper and found that the issue exists on some systems.
The content added in the “Bottom Content” section under Click to Chat → Greetings is already well-formatted:
<p style="text-align: center"><span style="font-size: 12px">🟢 Online | Privacy policy</span></p>
On some systems, the browser doesn’t use the system font for emoji rendering. Instead, WordPress (or the browser itself) replaces the emoji with an image fallback (from the WordPress CDN like s.w.org), which results in something like this:
<img draggable="false" role="img" class="emoji" alt="🟢" src="https://s.w.org/images/core/emoji/16.0.1/svg/1f7e2.svg">
That image-based emoji may appear larger or misaligned.
To fix this:
Option 1: Add custom CSS
From Click to Chat → Other Settings → Custom CSS and add:
.ht-ctc-chat img.emoji {
width: 12px !important;
height: 12px !important;
vertical-align: middle !important;
}
Option 2: Use Emoji Unicode instead of direct symbol
Replace the symbol with its code: please remove the spaces in between &# 128994;
🟢 &# 128994; Online | Privacy policy
This method avoids browser-based image fallback.
More emoji codes are available here:
https://holithemes.com/plugins/click-to-chat/symbols/
Please try either approach—both should resolve the display issue across all systems.
Thanks again for helping us to identify the issue
Have a nice day!
-
This reply was modified 2 days, 18 hours ago by
bhvreddy.
Thank you soo much this greatly fixed it, i used option 1 of the Custom CSS you suggested, Thank you.


Leave a Reply