• patrick clancey
  • NEWBIE
  • 0 Points
  • Member since 2017

  • Chatter
    Feed
  • 0
    Best Answers
  • 0
    Likes Received
  • 0
    Likes Given
  • 1
    Questions
  • 2
    Replies
I have a requiremnt to add a "Download chat" button to the Live Agent Post-chat form. Is this possible? 
Hello,

I am attempting to style the default "Chat Window", the one that displays automatically if a "Custom Chat Page" (visualforce page) is not defined. 

BEFORE
User-added image
Is there a way to customize the CSS for this default chat window to look like this:

AFTER
User-added image
I was able to copy the HTML code, then modify and reference the CSS from the default chat window to apply our branding style guidelines.  I do not want to create a custom chat window using visualforce, I just want to change the toolbar and button colors, that's it.

Alternatively, are there fully functional chat window visualforce templates available to customize?  How can I reverse engineer the rendered HTML  from the default chat window with all of the visualforce components in place, where I can create my own VF page:
<div style="top: 0; left: 0; right: 0; bottom: 0; position: absolute;">
        <liveAgent:clientChat>
        <liveAgent:clientChatSaveButton />
        <liveAgent:clientChatEndButton />
        <div style="top: 25px; left: 5px; right: 5px; bottom: 5px; position: absolute; z-index:0;">
                <liveAgent:clientChatAlertMessage />
                <liveAgent:clientChatStatusMessage />
        <table id="waitingMessage" cellpadding="0" cellspacing="0">
                <tr>
                        <td>Please wait while you are connected to an available agent.</td>
                </tr>
        </table>
        <div style="top: 0; right: 0; bottom: 41px; left: 0; padding: 0; position: absolute;word-wrap: break-word; z-index: 0;">
                <liveAgent:clientChatLog />
        </div>
        <div style="position: absolute; height: auto; right: 0; bottom: 0; left: 0; margin-right:67px;">
                <liveagent:clientChatInput /><liveAgent:clientChatSendButton />
        </div>
</div>
        </liveAgent:clientChat>
</div>
Please help.

Thanks...