WordPress.org

Ready to get started?Download WordPress

Forums

Zopim Live Chat
Hide for mobile devices (9 posts)

  1. Please Help
    Member
    Posted 1 year ago #

    Zopim live chat takes up the whole screen on mobile devices and small screens.

    What CSS can I use to hide it when a screen size is below say 600px wide?

    Thanks.

    http://wordpress.org/extend/plugins/zopim-live-chat/

  2. milawei
    Member
    Posted 1 year ago #

    I think it can't work with CSS but with javascript. I put the content of the zopim-script in a separate file and call the script now only if the screen-size is bigger than 900. Not sure if this is an elegant version, but it seems to work for me. The following code must go in the the head section of your site :

    <script type="text/javascript">
    if (screen && screen.width > 900)
      document.write('<script type="text/javascript" src="http://path-here/js/zopim.js"><\/script>');
    </script>
  3. gdatri
    Member
    Posted 12 months ago #

    I tryed but do not work...

  4. gogenich
    Member
    Posted 11 months ago #

    Hi. I have this problem too. I think it is popular addon. Can you do it, like otions?

  5. bencxr
    Member
    Plugin Author

    Posted 11 months ago #

    Hi there,

    This is a support staff from Zopim.

    Sorry for the delayed reply =(

    Here's the code to hide Zopim if the screen widget is less than 600px.
    Just paste the code within the footer file of your current theme - paste it before the </body> tag =)

    $zopim(function() {
    zopim_elements = document.getElementsByClassName('zopim');
    if (Math.min(document.documentElement.clientHeight, document.documentElement.clientWidth) <= 600) {
    for (var i =0; i<zopim_elements.length ; i++) {
    zopim_elements[i].style.display = 'none';
    zopim_elements[i].style.visibility = 'hidden';
    }
    }
    });

    Hope this helps. Please feel free to let us know if you need anything further. Come chat with us live from our website at http://www.zopim.com to get fast assistance. We are available 24 hours everyday, all work week days =)

    Regards,
    Israel
    Team Zopim

  6. gogenich
    Member
    Posted 11 months ago #

    It is working only if it is on < script tag (Java). And its not working on iphone. See http://www.happy33.ru

  7. bencxr
    Member
    Plugin Author

    Posted 11 months ago #

    Hi gogenich,

    Thanks for the update.

    It'll take a bit of coding to hide the widget via mobile. First, you've disable / delete the Zopim plugin and install it manually. It's relatively easy =)

    Here's how you can install Zopim chat widget at WordPress, manually.
    1. Log on to WP-admin page.
    2. Find "Appearance" located in the side bar.
    3. Hover your cursor over at "Editor" and click it
    4. Find "Footer (footer.php)" and click it
    5. Paste your Zopim code right before the </body> tag inside footer template.
    6. Click at "Update File" below and done!

    Now you have the widget on your website, next step is to hide it. Add the code that follows and put your widget code within the if statement.

    <script type="text/javascript">
    var ua = navigator.userAgent.toLowerCase(),
    platform = navigator.platform.toLowerCase();
    platformName = ua.match(/ip(?:ad|od|hone)/) ? 'ios' : (ua.match(/(?:webos|android)/) || platform.match(/mac|win|linux/) || ['other'])[0],
    isMobile = /ios|android|webos/.test(platformName);

    if (!isMobile) {

    //your widget code here.

    }

  8. gogenich
    Member
    Posted 11 months ago #

    It is good) Thanks
    P.S. you forgot </script> at the end of the code.

  9. bencxr
    Member
    Plugin Author

    Posted 11 months ago #

    Woops! Forgot that part :D
    Thanks for pointing that out!

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic