Replace the Chat widget buttonUpdated 9 months ago

You can replace our Chat widget button with your own by providing some custom code - the following custom script would replace the original widget button with a custom button element.

1<script>
2var initGorgiasChatPromise = (window.GorgiasChat) ? window.GorgiasChat.init() : new Promise(function (resolve) { window.addEventListener('gorgias-widget-loaded', function () { resolve();})});
3
4initGorgiasChatPromise.then(function () { 
5    var timer = setInterval(function () { 
6        var chatButtonHead = document.querySelector('#gorgias-chat-container')?.querySelector('#chat-button')?.contentWindow.document.querySelector('head'); 
7        if (!chatButtonHead?.children.length) { 
8            return; 
9        } 
10        clearInterval(timer); 
11
12        var chatButtonIframe = document.querySelector('#chat-button'); 
13        chatButtonIframe.style = "display:none;" 
14        var myButton = document.createElement('button');
15        myButton.style = ` 
16            position: fixed; 
17            right: 100px; bottom: 10px; 
18            z-index: 2147483000; 
19            width: 50px; 
20            height: 50px; 
21            border-radius: 10px; 
22            background-color: blue;
23            ` 
24
25        // onClick, behave like a chat opener 
26        myButton.onclick = function () { 
27            if (GorgiasChat.isOpen()) { 
28                GorgiasChat.close(); 
29            } else { 
30                GorgiasChat.open(); 
31            } 
32        } 
33        document.body.appendChild(myButton); 
34    }, 50); 
35});
36</script>