Trying to develop a mobile site isn't too much fun... What would your ideal system be for changing up templates based on browser characteristics (user agent, screen size, etc.)? Trying to swap CSS alone isn't too effective.
That's a useful technique for sure, but what I really want is the ability to serve up alternative templates based on device characteristics, or even alternate pages. Some applications need to be completely reworked for mobile viewing and css styling alone won't get you there.
Still, I can't exactly envision how I'd like this to work within Umbraco. Maybe if you could attach host names to template groups, so that if you're coming from mobile.yoursite.com vs. www.yoursite.com, you use a different set of templates or something.
I would love to see better mobile support as well. I have also noticed that much isn't being said with how Umbraco handles responsive design particularly with data-heavy sites.
Umbraco doesn't handle "responsive design" natively, as there's no "front end" with Umbraco by default - you have to build it with your Templates, so you make it work how you want with your own markup, CSS, etc. If you want advanced responsive elements such as responsive images, you'll have to crack out your .NET skills or use a third party solution :)
You can use a third party solution such as 51 Degrees (free) to detect a mobile device based on the WURFL signature or screen size, you can then simply either do:
A) A page redirect, to redirect them to the mobile version of the site B) A URL rewrite, to switch to using a mobile version of the template
There's plenty of other methods too.
I'd be slightly against packing in a standard "automatic mobile device support" into the Umbraco base, as Umbraco is a framework for building a CMS - so you make it do what you need. Although, I guess someone could knock up a project that adds mobile detection...
I believe Robert is looking for something like the 51degrees solution and I would also be interested, thanks for your advice.
I would like to create my own mobile templates instead of using "MobileAndWeb" and just wondering if you have any idea of how to setup "51Degrees.mobi.config" to be able to use the umbraco alttemplate in a site with multiple templates, I have already readed the 51 documentation and some other posts here and can't fine a clear explanation.
Ideally woul like something like www.website.com/category/page.aspx?m=1 then somehow usign that "?m=1" to change to alternative templates with the prefix "Mobile", the user will have the option to switch between full desktot and mobile version with a link to the current page with "?m= 1 for mobile or ?m=0 for desktop.
So I have some questions and hope I can find help here.
How would I use the "m=1 or m=0" to change the templates?
If the user changes to desktop version how would the website remember the setting if the user click on a link on the page? would it be ok just add the string "?m=x" to all the links on the page and how?
Edit:
Forgot to ask, how would the "51Degrees.mobi.config" setup would be to add the string "?m=1"? to all the pages?
Need Better Mobile Support / Template Switching
Trying to develop a mobile site isn't too much fun... What would your ideal system be for changing up templates based on browser characteristics (user agent, screen size, etc.)? Trying to swap CSS alone isn't too effective.
This is a really elegant solution -> http://www.alistapart.com/articles/responsive-web-design/
and check the demo at http://www.alistapart.com/d/responsive-web-design/ex/ex-site-FINAL.html
(only suitable for newer smartphones)
That's a useful technique for sure, but what I really want is the ability to serve up alternative templates based on device characteristics, or even alternate pages. Some applications need to be completely reworked for mobile viewing and css styling alone won't get you there.
Still, I can't exactly envision how I'd like this to work within Umbraco. Maybe if you could attach host names to template groups, so that if you're coming from mobile.yoursite.com vs. www.yoursite.com, you use a different set of templates or something.
I would love to see better mobile support as well. I have also noticed that much isn't being said with how Umbraco handles responsive design particularly with data-heavy sites.
Umbraco doesn't handle "responsive design" natively, as there's no "front end" with Umbraco by default - you have to build it with your Templates, so you make it work how you want with your own markup, CSS, etc.
If you want advanced responsive elements such as responsive images, you'll have to crack out your .NET skills or use a third party solution :)
You can use a third party solution such as 51 Degrees (free) to detect a mobile device based on the WURFL signature or screen size, you can then simply either do:
A) A page redirect, to redirect them to the mobile version of the site
B) A URL rewrite, to switch to using a mobile version of the template
There's plenty of other methods too.
I'd be slightly against packing in a standard "automatic mobile device support" into the Umbraco base, as Umbraco is a framework for building a CMS - so you make it do what you need.
Although, I guess someone could knock up a project that adds mobile detection...
http://our.umbraco.org/projects/starter-kits/mobileandweb
http://our.umbraco.org/projects/website-utilities/51degreesmobi-mobile-device-detection-and-redirection
Hello Drew,
I believe Robert is looking for something like the 51degrees solution and I would also be interested, thanks for your advice.
I would like to create my own mobile templates instead of using "MobileAndWeb" and just wondering if you have any idea of how to setup "51Degrees.mobi.config" to be able to use the umbraco alttemplate in a site with multiple templates, I have already readed the 51 documentation and some other posts here and can't fine a clear explanation.
Ideally woul like something like www.website.com/category/page.aspx?m=1 then somehow usign that "?m=1" to change to alternative templates with the prefix "Mobile", the user will have the option to switch between full desktot and mobile version with a link to the current page with "?m= 1 for mobile or ?m=0 for desktop.
So I have some questions and hope I can find help here.
is working on a reply...