Custom button with hideable section

If you wish to design your own button from scratch and you'd like it to include a section (bubble) which should be hidden when an X element is clicked you can extend this simple example with your design:

<div style="bottom: 30px; left: 10%; z-index: 999997; position: fixed;">
    <div style="background:red; padding:30px; position:relative;">
        This is bubble with close button.
        <div onclick="(event.target || event.srcElement).parentNode.parentNode.style.display = 'none'; if (event.stopPropagation) {event.stopPropagation();} else {event.cancelBubble = true;} if (event.preventDefault) {event.preventDefault();} LiveAgentTracker.closeBubbleButton('{$buttonid}');" style="position:absolute; top:10px; right:10px;">
            X
        </div>
    </div>
</div>
<div style="bottom: 0; left: 10%; z-index: 999997; position: fixed;">
    <div style="background:gray;">
        This is chat button bottom, which stay displayed.
    </div>
</div>

To create a custom HTML button you'd go in your agent panel to Configuration->Chat->Chat buttons->Create and at the top you'd go to the Custom section where you'd select the option By writing your own HTML code.

Ready to try LiveAgent?

It's free for the first 14 days! No credit card required.

Get Started
We work well with others...
Magento Joomla Wordpress Mailchimp
Contact us

support@ladesk.com

+1-800-811-6590 (Toll Free in USA & Canada)

+421 2 33 456 826 (European Union & Worldwide)

Quality Unit, LLC 616 Corporate Way, Suite 2-3278 Valley Cottage, NY 10989

Stay in touch
Blog Google+
© 2004-2015 QualityUnit.com, All rights reserved