Customize chatbox

Customizing the chat box via JavaScript

You can easily configure a set of options via JavaScript. On the /LCSK/chat.js file there is a call to a config function that can accept a configuration object.

$(function () {
    ...
    LCSKChat.config();
    LCSKChat.init();
});

You can change the config method and supply some configuration values, here is an example changing the header title and width of the chat box:

LCSKChat.config({
  headerBackgroundColor: '#FF0000',
  width: 850
});

Here is the available option as of v. 1.5.2:

Name	Description	Default Value
position	CSS position of the chat box	fixed
placement	Where the chat box should appears	bottom-right
headerPaddings	CSS padding for the header element	3px 10px 3px 10px
headerBackgroundColor	Background color for the header	#0376ee
headerTextColor	Color for the header text	white
headerBorderColor	Border color around the header element	#0354cb
headerGradientStart	Starting color for the gradient	#058bf5
headerGradientEnd	Ending color for the gradient	#015ee6
headerFontSize	Size for the header font	small
boxBorderColor	Color for the chat box border	#0376ee
boxBackgroundColor	Background color for the chat box	white
width	Width for the chat box	350
offlineTitle	Title when no operator are online	Chat is offline, contact us
onlineTitle	Title when at least one operator is online	Chat with us, we'reonline
waitingForOperator	Text when waiting for chat operator	Thanks, give us 1min to accept the chat...
emailSent	Confirmation of email sent	Your email was sent, thanks we'll get back to you asap.
emailFailed	Text if email failed	Doh! The email could not be sent at the moment. Sorry about that.