How to hide Digg Digg on mobile devices?

I am using Digg Digg as a social sharing plugin for my WordPress blog and never had any issues so far until today. I received a comment from one of the readers on Reddit that the side bar apparently takes up all the space on mobile device.

Here’s a tip for you as a customer: that damn sidebar makes my experience terrible on mobile. I couldn’t even read it.

This is one of the last things that a blogger would like that the reader is not able to read what you have written.

I use another plugin from JetPack which enables the mobile theme on phones and tablets. It displays content in a clean, uncluttered interface, making it easy for mobile visitors to scan your site. Furthermore, it takes special care to make the mobile theme as lightweight as possible to ensure faster loading times.

It turned out the combination of JetPack and Digg Digg (and perhaps any other plugin which I am using) caused the issue. Anyhow, I wanted to solve the issue ASAP.

The easiest fix according to me was to prevent loading of Digg Digg if the device is a mobile. I went to the Digg Digg plugin directory and added a new function to detect if the user agent is a Mobile device. Not the best piece of code, but it works for the time being. If time permits, I would personally like to do it using jQuery and just hide or unload the Digg Digg div element.


function isMobile()
{
    return reg_match("/(android|avantgo|blackberry|bolt|boost|cricket|docomo|fone|hiptop|mini|mobi|palm|phone|pie|tablet|up\.browser|up\.link|webos|wos)/i";, $_SERVER["HTTP_USER_AGENT"]);
}

Call the isMobile function from dd_hook_wp_content and if it is, just return the content and prevent loading Digg Digg further.


if(isMobile())
{
    return $content;
}

Hope this helps if you let into this situation. And of course, if there is a better solutions, I would like to hear that as well.