Mobile detection addon

Hi guys,

I am loving REVO more and more as I use it... one thing I have noticed that is not included in the new core build is any form of device (mobile/handheld) detection... When using MODx to build out sites for my clients I am constantly needing this and I was wondering if anyone had any plans or had already built out some form of Mobile detection addon that sniffed the users device and then served up a page with a designated page template - this way the same site content could be served across all versions of a site, with specifically designed page templates to house this content in a way that best suits the device that is rendering the page... An EVO version was created here - http://modxcms.com/extras/package/591 I was wondering if anyone knew of anything similar that was built out for REVO as yet?


Cheers,

dubbs.

Same here, can anyone point us in the right direction?


Thanks!

I think your better off using conditional css and just style the site with your mobile theme.

I have been trying to get jqtouch to play nice with MODx for a while but have stopped since I have been busy with other paying projects :-/.

Now jquerymobile has been released which is a nice framework but I think in the end your better off probably using some of these frameworks animations with your own layout or making your own.

Thanks for the tip, benmarte, will check it out!


Any additional advice or links on how to leverage conditional CSS specifically for mobile would also be much appreciated.

Quote from: nerfherder at Nov 17, 2010, 11:56 AM

Thanks for the tip, benmarte, will check it out!


Any additional advice or links on how to leverage conditional CSS specifically for mobile would also be much appreciated.

HTML5Boilerplate has a css that is setup so you can have your mobile layout and your site layout in 1 css file, you just have to style each accordingly.

http://html5boilerplate.com/

Here’s a tutorial that might help you out.

http://www.davidrcole.com/2010/11/make-your-website-mobile-friendly-in-one-night/

Good luck.

Using different CSS files for different devices can work, but relies on the site using identical markup for both the desktop and mobile version... The great thing about the mobile template switcher is that it reads the users device and then serves up a bespoke template from MODx to suit the device - within this template you can then of course create your own bespoke CSS to suit the device it is to be rendered on.

Quote from: dubbs at Nov 17, 2010, 01:05 PM

Using different CSS files for different devices can work, but relies on the site using identical markup for both the desktop and mobile version... The great thing about the mobile template switcher is that it reads the users device and then serves up a bespoke template from MODx to suit the device - within this template you can then of course create your own bespoke CSS to suit the device it is to be rendered on.

You can use conditional css to have it forward the user to a hidden page with your mobile layout and theme also, which is why I think it’s not worth it for someone to invest time making a mobile template switcher.

Another thing to keep in mind is with conditional css you can give the user the option of viewing your mobile site or your regular site, with the mobile theme switcher from evo that was not possible.

You can use conditional css to have it forward the user to a hidden page with your mobile layout and theme also, which is why I think it’s not worth it for someone to invest time making a mobile template switcher.

Another thing to keep in mind is with conditional css you can give the user the option of viewing your mobile site or your regular site, with the mobile theme switcher from evo that was not possible.

I am not a fan of having multiple versions - hence the idea of using the template switcher which keeps the content the same across all devices. Forwarding to hidden pages is not good practice really. You suggestion can work, but it is not a ’pure’ solution to the MODx mobile issue I raised. With reference not being able to view the mobile version of a site using the mobile template switcher in evo - this was possible, simply by passing the variable in the URL string - e.g. http://www.mysite.com/index.html?browser=mobile - this would load the index page with the mobile template with the mobile CSS etx...

P.S. Check out http://www.neonplay.com/ and http://www.neonplay.com/?browser=mobile for an example of the EVO template switcher working - this is the same site with the template switcher analysing the users device, then serving up an appropriate MODx template to clad the page, user can override this if they want by hitting the relevant buttons on the page - a 100% solution to the mobile MODx issue.

This is the kind of solution I seek for REVO.

Quote from: dubbs at Nov 17, 2010, 01:40 PM

P.S. Check out http://www.neonplay.com/ and http://www.neonplay.com/?browser=mobile for an example of the EVO template switcher working - this is the same site with the template switcher analysing the users device, then serving up an appropriate MODx template to clad the page, user can override this if they want by hitting the relevant buttons on the page - a 100% solution to the mobile MODx issue.

This is the kind of solution I seek for REVO.

Cool I was unaware that could be done, that really is the best way to accomplish what you want but until someone ports that plugin to Revo there’s pretty much nothing else you can do besides what I mentioned if you need something that will work while we wait for a Revo version of the plugin :-/