Tidio Custom Chat Button Not Showing Chat Widget

Question

I have been going round and round on this. I can't seem to get the button to open the chat widget on my website. It works fine in the codepen I have.

<button class="chat-button">Live Chat</button>


<script src="//code.tidio.co/ryhpmtzyn1r8xzyyzpxo9a4d4tg8lkvl.js" async></script>

<script>document.querySelector(".chat-button").addEventListener("click", function() {
console.log("Button clicked");
window.tidioChatApi.show();
window.tidioChatApi.open(); });
</script>

Here is the codepen: https://codepen.io/tetonhiker/pen/oNVMrNQ

Here is my dev website: https://driftmediawebsite.com/

I am using a wordpress website and nothing seems to be working.

I'm using the same code on my website as in the codepen example. The button is within Rev Slider. Maybe that has something to do with it?

Answer 1

Try this code. Just change the custom button class to revolution slider button class.

 <script>
    document.querySelector(".rev-btn").addEventListener("click", function() {
        console.log("Button clicked");
        window.tidioChatApi.show();
        window.tidioChatApi.open(); 
    });
</script>