1

I have spent many hours testing several of the popular mobile detect plugins and get mostly errors.

When I look at their support options, they seem to have shut down many months ago. I'm starting to wonder if they aren't compatible with more recent versions of Expression Engine, and the developers gave up on them.

Are any of you having luck with them? If so, which plugins do you use and what version of EE are you using?

When I follow the documentation for MX Mobile Device Detect, I get the following:

{exp:mobile_detect:device}
{if "{exp:mobile_detect:device}" == "mobile"}
Greetings mobile visitor!
{/if}
{if "{exp:mobile_detect:device}" == "not_mobile"}
Greetings desktop/laptop visitor!
{/if}
{/exp:mobile_detect:device}

Produces the response "not mobile" on my desktop and a blank on my phone.

The following code produces a blank instead of Hello Bill.

{exp:mobile_detect}
    {if device == "ipad"}
        Hello Steve
    {/if}
    {if device == "android" }
        Hello Bender
    {/if}
    {if not_mobile}
        Hello ... Bill ???
    {/if}
{/exp:mobile_detect}

The following code also produces a blank:

{exp:mobile_detect:screen_detect}
{if {screen_width} > 1024}You have desktop{/if}
{/exp:mobile_detect:screen_detect}
  • 1
    What did you test and what problem you have? – Max Lazar Feb 28 '14 at 12:27
  • 3
    Many more designers are starting to use css3 and media queries for responsive design so detecting mobile devices is starting to fade out. – Johnathan Waters Feb 28 '14 at 14:10
  • Please specify which add-ons you're having issues with. FWIW, I really haven't needed an add-on for a mobile site in a long time, since we just use CSS media queries. – Jeremy Gimbel Feb 28 '14 at 14:57
  • Max, I sent an email to you directly. Johnathan and Jeremy, I have ads on my sites, so I need a mobile detect to produce different sized ads from Google and other sources. Google has a beta responsive ad program, but I have other design challenges that stop me from using it. – Scott S. Bateman Mar 3 '14 at 13:05
  • I have mainly focused on MX Mobile Device Detect and Detect Mobile. – Scott S. Bateman Mar 12 '14 at 12:56
0

EDIT: Even after I tried my method out, I still returned inconsistent results. I'd strongly recommend using Gareth Davies' Detect Mobile plugin, since it's CMS-agnostic and will likely not break simply because Expression Engine is updated.

https://github.com/garethtdavies/detect-mobile

After installing it and implementing the following logic, it worked flawlessly:

{if "{exp:detect_mobile:ismobile}"}
    <script type="text/javascript" src="{path="scripts/mobile"}"></script>
{if:else}
    <script type="text/javascript" src="{path="scripts/desktop"}"></script>
{/if}

I've been having trouble with MX Mobile Detect as well, running EE 2.8.

If you're fed up with that plugin, you might also try Gareth Davies's version:

https://github.com/garethtdavies/detect-mobile

I'll share my solution with you, as it's the best one I could figure out given poor documentation and upkeep. What they fail to emphasize is that the pair tags are specified using exp:mobile_detect:pair for server-side user agent detection and that the conditional variables are custom, not prebuilt. When I tried the {screen_width} specified in their example, it did not return a value. Therefore, it's probably safe to assume this was an example variable they created in their MX Mobile Detect settings.

enter image description here

I create a variable with the name "responsive" and specify the criteria for returning various string values. In my template, I create

{exp:mobile_detect:pair}
    {if "{responsive}" == "mobile"}
        <script type="text/javascript" src="{path="scripts/mobile"}"></script>
    {if:else}
        <script type="text/javascript" src="{path="scripts/desktop"}"></script>
    {/if}
{/exp:mobile_detect:pair}

Based on what my experience with the plugin, it seems like it detects device width, not browser/window width. If you're using a 1024px wide display, it'll still return the conditional value for 1024px, even if your browser window is less than that.

If you need more information on how to debug, try out this page for information. But you should test the output yourself.

http://www.eec.ms/user_guide/mobile-device-detect/tags.html#lv19

-2

You can always use a core php class for detecting a mobile device. I've worked with this class before (no EE site) http://www.phpclasses.org/package/7277-PHP-Detect-mobile-devices-from-request-headers.html.

You would also be able to use this inside a EE template by enabling php on input.

  • Risky. As a general rule of thumb, if you're having to enable PHP within a template you should consider writing an add-on instead. – Mutual Mar 2 '14 at 19:31
  • Timo002, that's good to know, but I'm not expert enough in PHP to use it on the template or write my own plugin. Thanks for the idea. – Scott S. Bateman Mar 3 '14 at 13:07

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.