Customize the Smartsupp chat button with an animated character
Swap the plain Smartsupp bubble for a character in your brand colors. Opens your Smartsupp chat box.
Can you change the Smartsupp chat icon?
Partly. Smartsupp lets you set the chat box color (a gradient), put it on the left or right with pixel offsets, and hide it on mobile. Its docs don't describe a custom launcher icon or animation.
What Smartsupp lets you change
- Set the color (_smartsupp.color or Appearance settings)
- Choose left or right with pixel offsets (orientation, offsetX, offsetY)
- Hide it on mobile (hideMobileWidget)
- Hide it and open the chat from code (smartsupp('chat:hide') and smartsupp('chat:open'))
What it doesn't
- Use a custom launcher icon (not documented)
- Animate the launcher (not documented)
Source: Smartsupp: JavaScript API, checked 2026-10-18. More tools compared in how to customize your website's chat button.
Add an animated character to Smartsupp, step by step
- Create a free Chatmello account and enter your website address.
- Pick a character (or upload your own mascot), your brand colors, a personality and a greeting.
- Publish, then paste your snippet before
</body>on every page, next to your Smartsupp code. It looks like this:<script src="https://www.chatmello.com/chatmello.js" data-site="YOUR-SITE-ID" async></script> - Open your website. Your pet finds Smartsupp on the page by itself and takes over its button. The dashboard shows "Found Smartsupp on your site".
- Keep your Smartsupp code (smartsuppchat.com) on the page.
How the pet works with Smartsupp
- Chatmello hides the Smartsupp chat box while the pet is showing and brings it back if the pet can't work.
- Clicking the pet opens the Smartsupp chat.
- Chatmello counts your team's messages that arrive while the chat is closed and shows them on the pet.
What stays the same
- Your Smartsupp account, inbox, team and routing
- Your bots, automations and office hours
- The Smartsupp chat window your visitors see
- If Smartsupp fails to load or open, the pet steps aside and the normal Smartsupp button comes back
Performance and accessibility
- The Chatmello script is about 12 KB (gzipped), loads after your page and downloads only the character you use.
- No cookies, and it never records what visitors type.
- The pet is a real button with a label, works with the keyboard, and keeps still for visitors who ask for reduced motion.
Troubleshooting
- The Smartsupp button still shows
- Check that the Smartsupp code loads on the same pages as Chatmello, then hard-refresh. If Smartsupp takes more than about 15 seconds to start, the pet steps aside and leaves Smartsupp's button.
- I set hideMobileWidget in Smartsupp
- Then Smartsupp doesn't show on phones. Turn on "Hide on phones" in Chatmello's settings too, so the pet matches.
- The pet doesn't appear
- Check the website address in your Chatmello settings and that your design is published.
What visitors get
- A friendly character instead of a plain bubble
- A greeting bubble with your message
- The Smartsupp chat opens when they click the pet
- Unread messages shown on the pet while the chat is closed
Questions
Does it work with Smartsupp's free plan?
Yes. Chatmello uses Smartsupp's standard JavaScript API.
Can I change the Smartsupp button icon without Chatmello?
Smartsupp's docs describe the color, side, offsets and mobile hiding, but not your own launcher icon.
Do Smartsupp's chatbot and video recordings still work?
Yes. Chatmello only replaces the button; everything inside Smartsupp stays the same.
Will visitors see unread messages?
Yes. Chatmello counts messages from your team that arrive while the chat is closed.
Can I show the pet on some pages only?
Yes. In Chatmello's settings, show it only on pages you list, or everywhere except some.
Does it work on Shopify or WordPress?
Yes. Add Chatmello's one line next to your Smartsupp code; the install guides show where.
Will it slow down my website?
No. The script is about 12 KB, loads in the background, and only fetches the files your pet needs.
Is there a free plan?
Yes: one website, every character and every chat tool, free forever.
Give Smartsupp a face
Free for one website. Pick a character, choose your colors, paste one line of code.
Create your pet free