Home > Hide the Chat Button, then Reveal the Chat Button after X seconds.

Categories: |


(Last Updated On: November 10, 2020)

Some users may want to hide the Chat Button initially, then reveal it after X seconds. Here is a little copy-and-paste Javascript snippet you can use to do this. This snippet utilizes the functions: SnapEngage.hideButton() and SnapEngage.showButton().


Basic Implementation

This is a simple, bare-bones approach to hiding and un-hiding the Chat Button.

This code is usable as-is, but you can change the duration of the wait-time by changing the amount for “secondsToWait.”


// start showButtonTimeout
var secondsToWait = 10; // How many seconds to wait until reveal.

SnapEngage.hideButton(); // Hide the button immediately.
setTimeout( 'SnapEngage.showButton()', secondsToWait*1000 ); // .showButton() after a timeout.
// end showButtonTimeout



Where to place the code

The default Code Snippet looks like this…

2015-01-29_1538

 

Your custom Javascript goes right here…

2015-01-29_1538

 


Example full code snippet

If this were the only modification you were using with your Code Snippet, your full SnapEngage code would look like this.

*Important: If you copy-and-paste this code, you must replace the WidgetID  placeholder (xxx-xxxxxx-xxxx-xxxx), with your own WidgetID.



  (function() {
    var se = document.createElement('script'); se.type = 'text/javascript'; se.async = true;
    se.src = '//commondatastorage.googleapis.com/code.snapengage.com/js/xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx.js';
    var done = false;
    se.onload = se.onreadystatechange = function() {
      if (!done&&(!this.readyState||this.readyState==='loaded'||this.readyState==='complete')) {
        done = true;

        // start showButtonTimeout
        var secondsToWait = 5; // How many seconds to wait until reveal.

        SnapEngage.hideButton(); // Hide the button immediately.
        setTimeout( 'SnapEngage.showButton()', secondsToWait*1000 ); // .showButton() after a timeout.
        // end showButtonTimeout

      }
    };
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(se, s);
  })();




Let us know if you have any problems with this code snippet.

Happy chatting.

Did you find this article helpful?

Not HelpfulNeeds WorkSo-soHelpfulVery Helpful (8 votes, average: 3.38 out of 5)
Loading ... Loading ...

Published March 29, 2013