Change the initial button design


I am not sure if it’s possible, but the hackathon said to try creating an app before modifying the core code.
I want to change the initial chat button to include some text and the image of an (available) agent. Is this possible by creating an app and if so, is there any documentation that might help me achieve this?



While creating a Rocket.Chat App, you will be able to register slashcommands, register APIs and some UI elements on certain context (action for a channel, or message, for example)

if you are talking about the UI of the livechat widget (the one you install on a webpage, for example), you will need to change it’s code directly in order to perform this.

This code lives here:


Yes it is the livechat widget I am talking about (sorry for not being clear enough). I was hoping to not have to modify the widget code as we already have a version of that and it’s a nightmare to update with changes that Rocket.Chat implement after we have modified our code. If there was a way to keep the code separate that wouldn’t interfere with the original code, or at the very least, make it easy to update, that would be ideal.

Thanks for your reply.

Unfortunately there is not :frowning:

You can only change some bits of the livechat widget. For any other major change, it needs to be done directly in the code.