How to customize HTML5 chat design ?
Many users do write to us asking if we can send them the CSS file so they can modify it.
An answer is NO: the CSS file is Global and stored on our servers. So people think they are unable to change the design of the chat, which of course is untrue.
The CSS allows to override the existing CSS. So instead of change the CSS, you need to ADD your own to OVERRIDE the exiting.
And here is how to do that:
- As usual go to your chatadmin and choose the config -> design tab:
- You will find the property : “Link to external CSS to customize your chat”
- you will insert the LINK to your OWN css : It must be http, like
http://myownsite.com/myCustomizedCss.css - in your myCustomizedCss you will override the existing CSS
If for instance you want the send Button to be red, you will create something like
#send-msg-btn {
background-color: red;
}
That will over ride the existing CSS for the #send-msg-btn
and as result, you will get a red send button.
But to do that, we need to know the names of the classes or id’s used . Where do we find them?
hello, if you go through google chrome and go to right mouse and go to inspect. you see the css files. veerbeeld, https://www.domein.com/css/greyChat4.css?rnd=1550908781 open in new tab save the file on pc and edit the css to your taste to colors etc. upload to sftp and link copy paste in your admin panel css desgin (Link to external CSS to customize your chat) and you will see after editing css changes visible on the chat. kind regards Geert
puedes poner ejemplo de hoja de style?