Detect users internet browser (firefox, safari, iphone, ipod, ipad, internet explorer, opera ) and redirect to different page specific to it

Some times we need to detect the browser of the user in order to redirect them to browser specific page, or to do any other cross-browser-compatibilitytask that is related to displaying that website for that particular user’s browser, e.g firefox, opera, internet explorer, safari, or are coming from an iphone or an ipod.

Edit: You can also use the code if your query includes detect ipad browser and detect user agent / browser

There are various ways to detect the browser that the visitor is using. Such as:

JavaScript

If you want to detect which browser the user is using, use the following code to get it done via javascript. Add this javascript code to detect the user browser in the head of the document to direct the user to particular page specific to that browser.

(Note: the code checks if the user is coming from and iphone/ ipod and redirects the user to a particular page specific to iphone/ipod browser, however you can modify the code to check for any other browser such as opera, safari, internet explorer etc.)

<script language=javascript>

<!--
if((navigator.userAgent.match(/iPhone/i)) || (navigator.userAgent.match(/iPod/i)))
{
location.replace("iphone-version.html");
}
-->
</script>

The above code when added/present in the head of the document / page will check through javascript that if the user is coming from an iphone/ipod internet browser, and if positive will load the specific page, and redirect the user to that page, for example mobile or iphone/ipod specific page. However the logic can be used for any other purpose too, such as showing , hiding, including a specific file, or part of page, or a css file specific to the current browser being used by the user.

php

If you want to do the same via php, you can use following code. The benefit of this is that the page does not need to load twice and also that it will not be apparent to the user, as the code will run on the server side.

So if you want to use php to detect the browser of the visitor and act accordingly, like if the user is coming from firefox, opera, internet explorer, safari or iphone/ipod browser, and after detecting them, you want to direct them to specific page, such as mobile page for your site etc, use the following code.

Please note, the example below uses the php code for detection of browsers to detect if the user is coming from the iphone/ipod interent browser , and redirects the user to iphone/ipod specific page. You can use the same logic for detection of other browsers and any other code implementation like loading certain file or part of code etc .

<?php

//setting the variables
$ipod = stripos($_SERVER['HTTP_USER_AGENT'],"iPod");
$iphone = stripos($_SERVER['HTTP_USER_AGENT'],"iPhone");

//detecting device
if ($ipod == true || $iphone == true){
header( 'Location: http://site-1/' ) ;
} else {
header( 'Location: http://site-2/' ) ;
}
?>

Conditional Comments

One more way to detect the user browser , if its safari, opera, firefox or internet explorer, and what is its version etc, is to use the conditional comments statements in the html of your page.

This works like this:

<!--[if expression]> HTML <![endif]-->

So if you want to check if the user is coming from specific browser such as internet explorer, then you can use this code:

<!--[if IE]>

some html, css code here

<![endif]-->

There is detail article on each of them seperately on the site. Check them in related articles or through search feature of the site.

We have separate tutorial if you’re looking for how to redirect user to iPhone / iPod version of site using PHP

23 comments on “Detect users internet browser (firefox, safari, iphone, ipod, ipad, internet explorer, opera ) and redirect to different page specific to it

  1. thank you so much for this info…i tried to search to look more into how to detect explorer browser users and create pop up window that tells them to user another browser, but i couldn’t find the article in the search. can anyone help with the code?

  2. @naya:
    you can do this easily in the current code.
    Are you using javascript or php to detect the browser of the user? which ever it is, just add the popup alert code in the script like this:

    For php:
    <?php

    //setting the variables
    $ipod = stripos($_SERVER['HTTP_USER_AGENT'],”iPod”);
    $iphone = stripos($_SERVER['HTTP_USER_AGENT'],”iPhone”);

    //detecting device
    if ($ipod == true || $iphone == true){

    //the user is using ipod or iphone, so you can add the code if you want here too, but i have added the javascript in the else part, so that he can know if he is not using iphone or ipod

    } else {
    ?>

    <script language="javascript">
    alert("you are using iphone browser");
    </script>

    <?php
    }
    ?>


    For Javascript

    If you are using javascript code for detection of the browser, then alter the javascript code like this:

    <script language="javascript">
    <!–
    if((navigator.userAgent.match(/iPhone/i)) || (navigator.userAgent.match(/iPod/i)))
    {
    alert("you are using iphone browser");
    }
    –>
    </script>

    Hope it helps! Let me know if you feel any problem with it.

  3. Hi, Many thanks for the code. I have added it to the top left of my webpage as follows but then the page does not load. Is there something else i need to do? I will be eternally grateful if someone can help me with this…

      1. Hi, i pasted the code before but the system deleted it. I’ll try again. BTW my site is not a dynamically driven php site. It is a html site which uses a .php extension because years ago i intended to build a php site. To run the browser sniffing code do i have to have a controlling php file on my site? You can see below how i positioned the code at the top of the page:

        Location of page with the sniffer code:
        http://www.abbyeagle.com/styles/index.php

        I want to direct it to:
        http://www.m.abbyeagle.com

        1. You can paste the code by adding [ code ] and [ /code ] (without spaces) and adding the code within them.

          Although right now you will not be able to see the code even after submitting it, but i will be able to see it from admin backend (theme has some issues in showing it, will fix it soon – sorry for the inconvenience caused)

    1. i am still unable to receive the code in comment. I am sending email to you on the email id associated with this comment. Please post the code in it.

  4. Hello!
    I hopefully have a pretty simple question. I’d like to use one set of javascripts for web browsers, and another set for mobile devices. What is the best way to do this? I’ve tried several with no luck.

    The code for web browsers I’m using is:

    
    
    
    
    

    For mobile, I’d like to use the same as above, but remove the ‘lazyLoad’ script.

    Thanks so much!
    Daniel

  5. Hello!
    I hopefully have a pretty simple question. I’d like to use one set of javascripts for web browsers, and another set for mobile devices. What is the best way to do this? I’ve tried several with no luck.

    The code for web browsers I’m using is:

    For mobile, I’d like to use the same as above, but remove the ‘lazyLoad’ script.

    Thanks so much!
    Daniel

    1. sorry i am unable to see the code in your comment. Maybe it’s come problem with the comment system, can you tell me which windows and which browser are you using for posting this comment please so that i can fix this issue?

      Other than that, you can try posting the comment form other browser or post it without script start and end tags.

  6. I love to learning more on this topic if possible, as you gain expertise, will you update your blog with more information?

  7. Your site looks great and reads even better! You share some great opinions and insight here. Always looking for motivating blogs to keep mine going!

  8. I just needed to say that I found your blog via Goolge and I am glad I did. Keep up the good work and I will make sure to bookmark you for when I have more free time away from the books. Thanks again!

  9. Anyway, I’m questioning whether or not you might be open for link exchange, as I hope that we are able to agree on a mutual link exchange agreement. Hope to hear a positive reply from you, and have a great day!

Leave a Reply

Your email address will not be published.