Chatbox CSS Style

Can anyone Help Me For This Code !! I Want To Change My Chatbox Style Look Like This !! With English Lunguege And Black Version Of Template Please I need The Code Thanks
https://i.imgur.com/IxAUnxU.png

matonskie23 wrote:[quotelink="/t2596-chatbox-css-style#p24136"]Can anyone Help Me For This Code !! I Want To Change My Chatbox Style Look Like This !! With English Lunguege And Black Version Of Template Please I need The Code Thanks
https://i.imgur.com/IxAUnxU.png

Hello @Matonskie23,

I'm not sure what you're looking for here. I'm looking at a white chatbox in that screenshot (not an AWC chatbox) and you want it black? Are you looking for help on styling some of the elements or do you want us to style your entire chatbox? Have you got the basic AWC chatbox installed already?

Anyway, we've got a new template for asking AWC support. You can find it here: AvacWeb Chat > AWC Support ( https://avacweb.forumotion.co.uk/t2539-avacweb-chat-support-request-form#23853 ). If you'd make a copy of the code you find in the template, and would be so kind to fill it out for us and be specific on what you want, we can further investigate. Please, don't forget to mention your website link in your profile.

I'll be locking and archiving this topic soon, as it's in the wrong section.

i just want the chatbox style and make it black but i dont know how !! ma`am Samantha Can u help me for that?

matonskie23 wrote:[quotelink="/t2596-chatbox-css-style#p24143"]i just want the chatbox style and make it black but i dont know how !! ma`am Samantha Can u help me for that?

I can help you with that alright. If you would just fill out the template at AvacWeb Chat > AWC Support ( https://avacweb.forumotion.co.uk/t2539-avacweb-chat-support-request-form#23853 ) for me and be specific on what you want elements you want to see black, we can get you there. Please, don't forget to mention your website link in your profile.

As for styling the AWC chatbox: AWC comes with its own CSS: http://chat.avacweb.net/awc_2-0.css as you can see on the AWC installation page ( http://chat.avacweb.net/install , Step 3). The elements you find in that CSS can be changed to your liking. All you need to do is to find the element you want to change and override it with the !important declaration.

To give you a couple of examples:

Change the header and footer in AWC to black and have the title being displayed in white

Code:

#awc_header, #awc_footer {background: #000!important;}
#chatbox_header {color: #FFF!important;}

To add a background picture to the chatbox

Code:

#awc_rightbox {background-position: center!important;background-image:url('YOUR_URL_HERE')!important;background-repeat:no-repeat!important;}

To remove a background image from let's say the Online User list box:

Code:

#awc_userlist {background-image:none!important;}