AWS Connect - Communication Widget Window Styling

Question

Hi, hoping for a little help.

I would like to change the styling of the AWS Connect widget on the customer side. I have found this article, but not sure how to adapt the script from the widget to alter the way window shows. 
https://docs.aws.amazon.com/connect/latest/adminguide/pass-custom-styles.html#chat-widget-preview

`amazon_connect('customStyles', {
 global: {
     frameWidth: '400px',
     frameHeight: '700px',
     textColor: '#fe3251',
     fontSize: '20px',
     footerHeight: '120px',
     typeface: 'Times New Roman', 
 },`

Is there a way I can load this in to the chat widget?

James_M · Answer

Hello,

Yes you can be able to load it to a custom chat widget

1.  Create a communication widget as described here https://docs.aws.amazon.com/connect/latest/adminguide/add-chat-to-website.html
2. copy the widget script into your html page or a blank html page
3. add the customStyles code block  below into the html page https://docs.aws.amazon.com/connect/latest/adminguide/pass-custom-styles.html
4. Use browser developer tools to identify the cause if any attribute causes "unexpected token" or any other error

AWS Connect - Communication Widget Window Styling

Add your answer

Relevant content