0

I was looking for an answer and have tried many options but nothing worked.

So, I'm trying to disable Pure Chat if on mobile.

Pure Chat Code:

<script type='text/javascript' 
     data-cfasync='false'>

    window.purechatApi = {
      l: [],
      t: [],
      on: function() {
        this.l.push(arguments);
      }
    };
    (function() {
      var done = false;
      var script = document.createElement('script');
      script.async = true;
      script.type = 'text/javascript';
      script.src = 'https://app.purechat.com/VisitorWidget/WidgetScript';
      document.getElementsByTagName('HEAD').item(0).appendChild(script);
      script.onreadystatechange = script.onload = function(e) {
        if (!done && (!this.readyState || this.readyState == 'loaded' || this.readyState == 'complete')) {
          var w = new PCWidget({
            c: 'b935f3c9-9b39-4746-8080-c4b0ac74963d',
            f: true
          });
          done = true;
        }
      };
    })();

</script>

Do you have any idea how to solve that?

nem035
  • 31,501
  • 5
  • 73
  • 88

2 Answers2

0

Detecting if the page is running on mobile device is a tricky thing to do. You can read up more about it in a related question here

If you choose to most upvoted solution, you can achieve what you want the following way:

if(/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) === false) {
    // not mobile device, 
    // initialise pure chat here
}

Disclaimer: This solution depends on the user-agent string, which is not the most reliable, since it can be changed easily by user. But in this particular case, it's a reasonable enough solution.

Community
  • 1
  • 1
Hafiz Ismail
  • 3,098
  • 1
  • 23
  • 21
0

Just add the following line in theme.liquid or styles.scss.liquid

@media (max-width: 799px){.purechat{display:none !important;}}

Adjust max-width as required. This will load the script but will hide it on any screen with less than 800px width.

HymnZzy
  • 2,357
  • 1
  • 12
  • 23