How to Detect iPad and Redirect to iPad Version Website

With all the buzz about the iPad, I wanted to post another useful snippet of code. It detects whether the person viewing your website is on a iPad. If they are on a iPad, you can redirect them to a iPad version website or just to another page, its up to you. If they are on a normal computer it doesn’t redirect them and they go on as normal. Its just some simple javascript, and if you want to use it just change the “document.location” value to the url you want them redirected. Here is the code, and its just the same as when you detect for the iPhone with an extra argument.

1
2
3
4
5
<script type="text/javascript"> // <![CDATA[
	if ((navigator.userAgent.indexOf('iPhone') != -1) || (navigator.userAgent.indexOf('iPod') != -1) || (navigator.userAgent.indexOf('iPad') != -1)) {
		document.location = "http://www.scottrockers.com/iphone.html";
	} // ]]>
</script>

Cya

55 thoughts on “How to Detect iPad and Redirect to iPad Version Website”

  1. Should the line containing “navigator.userAgent.indexOf(‘iPod’)” read “navigator.userAgent.indexOf(‘iPad’)” ???

    iPad not iPod as it were.

    Rod

  2. Hey Rod, The iPad redirection code is the exact same as a iphone or iPod redirection code, but it has another argument added to it that looks for “iPad” in the userAgent of the browser as well. The extra argument in the if statement looks like this “|| (navigator.userAgent.indexOf(‘iPad’) != -1)”

  3. Update: This Code works great, thanks Scott.

    This code does not work on the iPad. I just tested redirect with my website http://www.briankellogg.com in the Apple store and it does not work. The code still works for the iPhone. If someone does figure out a better code please post it here.

  4. Hey Brian,

    I went on a search to check to make sure this script was working and found out some things. The userAgent of the iPad is: “Mozilla/5.0(iPad; U; CPU iPhone OS 3_2 like Mac OS X; en-us) AppleWebKit/531.21.10 (KHTML, like Gecko) Version/4.0.4 Mobile/7B314 Safari/531.21.10”

    So the code should be working because it contains the words iPad in it. If anyone can actually test this out on the actual iPad, and not in the Apple Store, then please let me know and I will post a correction. Brian, I did update the code just to make sure, so please try it again.

    Thanks,
    Scott

  5. I tested this script on an ipad and worked smoothly.

    Scenerio: I have a website for web(PC) and a redirect for mobile: Iphones, blackberries etc. I found my redirect for iphone and ipod touch was also redirecting for the ipad. I did NOT want IPAD users to be redirected so I used the above script to detect ipad users and NOT redirect to the mobile site. It works well.

    The script above is indeed good!.

    Thanks,
    David Morgan
    Web Developer

  6. Thanks for this code! Is it possible to redirect ipods/iphones to one site while redirecting the ipad to another site? Thanks in advance…

  7. Hey Jason,

    Here is the code for just ipods and iphones.

    1
    2
    3
    4
    5
    
    <script type="text/javascript">
    	if ((navigator.userAgent.indexOf('iPhone') != -1) || (navigator.userAgent.indexOf('iPod') != -1)) {
    		document.location = "http://www.scottrockers.com/iphone.html";
    	}
    </script>

    And here is just for the ipad.

    1
    2
    3
    4
    5
    
    <script type="text/javascript">
    	if ( (navigator.userAgent.indexOf('iPad') != -1)) {
    		document.location = "http://www.scottrockers.com/iphone.html";
    	}
    </script>

    Scott

  8. Is there a way to sneak in a blackberry redirect to the same script?

    Thanks by the way. This works perfectly on ipod, ipad and iphone for me.

  9. I looked up the userAgent of the BlackBerry, so I think you can use this code. Could you test it out and let me know and leave a reply on this comment that would be great.

    1
    2
    3
    4
    5
    
    <script type="text/javascript">
    	if ((navigator.userAgent.indexOf('BlackBerry') != -1)  ) {
    		document.location = "http://www.yourwebsitename.com/yourwebpagename.html";
    	}
    </script>
  10. I rechecked the useragent and it should be right. I changed the blackberry to BlackBerry, could someone check my changes and see if this script works for the blackberry.

    Thanks
    Scott

  11. Great script, thanks! Side question: do you know how, on the iphone, to prevent an embedded QT (.mp4) file from automatically opening up full screen and, instead, playing within the webpage itself?

  12. Hi there, i tried the blackberry code and it works perfect !!! it´s definetely a good tip!! i just was wondering, if i want to have a web version for iphone, another one for blackberry, etc … do i have to copy in a row both textis (for example first the code for the iphone recognition followed by the blackberry code??????) thanks a lot.

  13. I think so, Estaban tried it and he said it works. Please let me know if it doesn’t.

    Thanks
    Scott

  14. Although I said it doesn’t work, does not mean that the code is incorrect. I just realized that the phone I tested with does not have JavaScript enabled, so it obviously would not redirect. Sorry about that ADMIN! The script does look good and does work for iphone/pad.

  15. Works great on my Blackberry. I combined all the code for the iPod, iPhone, iPad, and Blackberry, putting the Blackberry redirect code last. I haven’t yet tested it on any Apple devices, as I don’t own any, but I am confident it will work on those as well – since my Blackberry successfully redirected to it (and its browser must have made it past the Apple device redirect code without a hitch).

    Anyway, thanks so much for creating and distributing this script!

  16. Hey Allen, this code below should pick up any android device. If someone wants to test it and let me know that would be great.

    1
    2
    3
    4
    5
    
    <script type="text/javascript">
    	if ( (navigator.userAgent.indexOf('Android') != -1)) {
    		document.location = "http://www.scottrockers.com/yourwebpage.html";
    	}
    </script>
  17. What a great script! Really simple and elegant… and works like a charm! Thank you very much for sharing this with the community at large.

    Any suggestions for screen-reader devices? I’m planning on building a secondary (text-only) site for accessibility purposes, and would love a general redirect for those without flash / images.

    Thanks again!

  18. This is a great script – extremely simple but very effective!

    I found a few other options but none were as simple as this. I now have it working for iPad/iPhone/iPod/BlackBerry but not sure if there are other mobile devices that can be added to ensure all bases are covered. I see Scott says this should work for all android devices but haven’t been able to test aside from those above, has anyone else?

    Thanks a lot for sharing!

  19. THANK YOU! Finally, Ive been trying to get this working and couldnt find a working code. Thanks again!

  20. I cannot thank you enough for this wondrous piece of code.

    I spent more than 8 hours today trying to find a way to trap for iPads so that I could use a separate youtube video embed code…without the autoplay in it (I discovered that if autoplay is set to ‘1’ when the ipad goes to play it, it will not play and no play button will appear).

    Your code allowed me to trap for the ipad and redirect those users to a similar page on my own site, that has the very same youtube code embed, sans the autoplay.

    Again, job well done…and thank you!!

  21. Catherine,

    I would find the userAgent of the tablet you are trying to redirect for, and j insert some of the part of the useragent text into the part that says “ipad” instead. Hope that helps.

  22. Hi there, GREAT SCRIPT! Exactly what I’m looking for.
    Is it possible to also detect, whether the iPad is in Portrait or Landscape position?

  23. Very nice piece of code. but I have one concern. what about if the person wants to come back to the PC version of the site from his ipad ? it will always send him to the ipad version ? Thank you

  24. Make sure people clear their cache. took a couple of tries before it worked on my iPad.

    Thank you very much for bringing me up to the 21st century on this one.

  25. You legend! Just implemented this on my site! Worked first time! Used it to redirect uses to a site not using flash! Great stuff! Cheers bro!

Comments are closed.