Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at


  • manwood 87 posts 109 karma points
    Jan 17, 2010 @ 10:28
    manwood
    0

    Umbraco and mobile devices?

    I need a cut down version of my site to work on mobile devices - does Umbraco have any provision for this? Or is it simply a case of intercepting the request and routing it to a page prepared specifically for mobile browsers?

    How would you guys suggest I achieve this?

    Thanks

  • rasb 162 posts 218 karma points
    Jan 17, 2010 @ 11:29
    rasb
    0

    Check out the iPhone Alt Page package in the repository.

    Dead easy! You just install the package, and add a javascript to your header. Then it automatically generates a mobile site for you. That's all there is to it.

    /RasB

  • manwood 87 posts 109 karma points
    Jan 17, 2010 @ 11:37
    manwood
    0

    Hi Rasb

    I have seen that, but does it only work with iPhones? What about other devices?

     

    Thanks

  • rasb 162 posts 218 karma points
    Jan 17, 2010 @ 11:50
    rasb
    0

    Hi Manwood,

    That's pretty easy. Just add a check for Android in the javascript, like I have done here:

    <script language=javascript> 
        if((navigator.userAgent.match(/iPhone/i)) || 
            (navigator.userAgent.match(/Android/i)) ||
            (navigator.userAgent.match(/iPod/i))) 
                document.location.href='/potential-aps/iphone.aspx'; 
        } 
    </script> 

    It should be possible to find a list of userAgents for mobile browsers, but with these two, you should be getting close.

    /RasB

  • rasb 162 posts 218 karma points
    Jan 17, 2010 @ 12:26
    rasb
    0

    A quick search gave me these additional User Agents to look for...

    (navigator.userAgent.match(/Opera Mobi/i))||
    (navigator.userAgent.match(/Opera Mini/i))||
    (navigator.userAgent.match(/BlackBerry/i))||
    (navigator.userAgent.match(/Nokia/i))||
    (navigator.userAgent.match(/SymbianOS/i))||
    (navigator.userAgent.match(/Windows CE/i))||
    (navigator.userAgent.match(/BenQ/i))||

    http://www.zytrax.com/tech/web/mobile_ids.html

    /RasB

  • Frederik Vig 29 posts 61 karma points
    Jan 17, 2010 @ 12:31
    Frederik Vig
    0

    There are a couple of ways. Basically you need a way to find out if the device is a mobile device, what it supports (resolution, JavaScript, Flash support etc), and then do the proper action (redirect, switch master page, switch theme etc). I've written a blog post with a few links that you might find useful: Creating a mobile version of a web site

  • manwood 87 posts 109 karma points
    Jan 17, 2010 @ 13:15
    manwood
    0

    Thanks guys, that's really great stuff!

  • shruti 21 posts 42 karma points
    Jan 28, 2010 @ 03:12
    shruti
    0

    simple text in "bodyText" is working fine on iphone.But .net controls are not showing up in iphone.Could anyone advice that?My .NET control is in "bodyText" , if iphonealpage is showing simple text.. it should show .NET control too there.Is there is anything to be added in "DisplayField"?

  • Sebastiaan Janssen 5045 posts 15477 karma points MVP admin hq
    Jan 28, 2010 @ 09:22
    Sebastiaan Janssen
    0

    For detection, also have a look at the Mobile Browser Definition File as discussed in Scott Hanselman's blog post.

  • Giacomo Cosenza 16 posts 36 karma points
    Apr 20, 2011 @ 18:35
    Giacomo Cosenza
    0

    Hello, I take this discussion because I'm trying to view my site on mobile devices (iPhone, Android, BlackBerry, etc etc) .. I tried the package "Page Iphone Alt. I followed the video demonstration. So I installed the package and copied the script tag in the masterpage for my site. Unfortunately when I tried to connect me with the iPhone came into the loop and not load the page. I have to make other changes to be able to render on mobile devices? Is there any step that is omitted in the video?

    Thank you all.

    Regards,

    G.

  • Mike 1 post 21 karma points
    Jul 19, 2011 @ 16:02
    Mike
    0

    Hey Everyone,

    I've installed the iPhone Alt Page package, but can't get it to work.

    I'm having the same issue as Giacomo. The package is installed and script is installed on my Master Page, but it just loops like crazy when it's viewed on an iPhone.

    Details:

    - iPhone Simulator being used
    - When I view the source it displays this (see below)
    - Umbraco 4.7

     
    <script>      
    if((navigator.userAgent.match(/iPhone/i))|| (navigator.userAgent.match(/iPod/i))) {
    document.location.href='';  

    </script>  
    Help is much appreciated.

    Thanks
    Mike 

  • Kevin Obee 3 posts 23 karma points
    Jul 22, 2011 @ 14:18
    Kevin Obee
    0

    Hi Everyone,

    It's well worth taking a look at the iUI framework:

    http://www.iui-js.org/ 

    or

    http://code.google.com/p/iui/

    iUI makes it possible to create mobile sites using familiar ASP.NET technologies and currently supports iOS, Android, Rim OS6, MeeGo, Bada, WebOS, smartphones and tablets.

    Regards,

    Kevin

  • Connie DeCinko 931 posts 1160 karma points
    Jul 29, 2011 @ 17:28
    Connie DeCinko
    0

    iUI looks nice but I think it won't be able to survive the 300lb gorilla entering the room...  jQuery Mobile.  jQuery Mobile just entered it's first beta, with beta 2 in the next couple weeks.  Since it runs on top of the core jQuery, it looks pretty stable.  And it supports all the major platforms.

    www.jquerymobile.com

     

  • herman fraley 3 posts 23 karma points
    Apr 18, 2012 @ 13:03
    herman fraley
    0

    What a great blog post! Thanks for sharing it on your site.

    mobile

  • Eric Siebeneck 26 posts 46 karma points
    Aug 23, 2012 @ 16:25
    Eric Siebeneck
    0

    Hi we're using this JavaScript to detect screen resolution/device and then present the iphone.aspx version. Question, we noticed the menu is converted into touch friendly buttons, but all links within the content do not work well. You have to press and hold and then select Open in New Page in order for them to open an external link. Internal links to pagename.aspx do not work at all because the iphone.aspx version uses #_1234. Is there a way to fix these issues?

     

     

     

  • Eric Siebeneck 26 posts 46 karma points
    Aug 23, 2012 @ 16:44
    Eric Siebeneck
    0

    The following is my second question regarding mobile versions (please see the post above as well).


    Is there a solution available that uses the current content and menu built in Umbraco, and then displays a tablet version and a mobile version? What we'd like to do is select a template that we can apply custom graphics to (logo, header and color scheme) without having to create separate CSS sheets for a tablet and mobile site. Please note: we like to custom design our client websites (in Photoshop) and our clients would like attractive mobile and tablet versions as well. However, we can not double/triple our time creating these.

Please Sign in or register to post replies

Write your reply to:

Draft