۸ تکنیک برای شناسایی موبایل و صفحه نمایش رتینا

<?php
    //Here is the known mobile user agents list
    $mobiles = array("iPhone","iPod");
    foreach( $mobiles as $mobile ) {
        if( preg_match( "#".$mobile."#i", $_SERVER['HTTP_USER_AGENT'] ) ) {
            //Ok, this is a mobile browser, let's redirect it!
            header('Location:http://mobile.mysite.com/'); 
            exit();
        }
    }
?>

<?php
    //let's check if we have a get or post or cookie set to nomobile
    if ( isset( $_REQUEST['nomobile'] ) && true == $_REQUEST['nomobile'] ) {
        //now we check if we have set the cookie, so we don't need the "get" in the URL all the time
        if ( ! isset($_COOKIE['nomobile']) ) {
            setcookie("nomobile", 1, (time()+60*60*24*30) );
        }
    } else {
        //nevermind, let's check if current browser is a mobile
        //Here is the known mobile user agents list
        $mobiles = array("iPhone","iPod");
        foreach( $mobiles as $mobile ) {
            if( preg_match( "#".$mobile."#i", $_SERVER['HTTP_USER_AGENT'] ) ) {
                //Ok, this is a mobile browser, let's redirect it!
                header('Location:http://mobile.mysite.com/'); 
                exit();
            }
        }
    }
?>

<script type="text/javascript">
    var mobiles = array["iPhone", "iPod"];//mobile devices
    var i;
    for(i=0;i< mobiles.lenght;i++){
        //testing if the RE matches the mobile agents
        var er = new RegExp(mobiles,"i");
        if( er.test( navigation.userAgent ) ) {
            window.location = "http://mobile.mysite.com/" ;
        }
    }
</script>

<?php
    function load_my_styles() {
        global $is_iphone; //loading global var here
        if( $is_iphone ) {
            wp_enqueue_style( 'iphone-style', get_stylesheet_directory_uri() . '/ iphone-style.css');
        } else {
            wp_enqueue_style('normal-style', get_stylesheet_directory_uri() . '/ style.css');
        }
    }
    add_action( "wp_enqueue_scripts", "load_my_styles" );
?>

• PHP Browser Detection
• Mobile Detector​
• Mobile Device Detection
• Equivalent Mobile Redirect

<link rel="stylesheet" type="text/css" src="assets/css/common_style.css" />
<link rel="stylesheet" type="text/css" src="assets/css/retina.css" media="only screen and (-webkit-min-device-pixel-ratio:2)" />

/* Smartphones (portrait and landscape) ----------- */
@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 480px) {
/* Styles */
}

/* Smartphones (landscape) ----------- */
@media only screen 
and (min-width : 321px) {
/* Styles */
}

/* Smartphones (portrait) ----------- */
@media only screen 
and (max-width : 320px) {
/* Styles */
}

/* iPads (portrait and landscape) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) {
/* Styles */
}

/* iPads (landscape) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) {
/* Styles */
}

/* iPads (portrait) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) {
/* Styles */
}

/* Desktops and laptops ----------- */
@media only screen 
and (min-width : 1224px) {
/* Styles */
}

/* Large screens ----------- */
@media only screen 
and (min-width : 1824px) {
/* Styles */
}

/* iPhone 4 ----------- */
@media
only screen and (-webkit-min-device-pixel-ratio : 1.5),
only screen and (min-device-pixel-ratio : 1.5) {
/* Styles */
}

@media only screen and (-webkit-min-device-pixel-ratio:2){
/* Styles */
}

<script type="text/javascript">
    //JS version for the retina query
    var modern_media_query = window.matchMedia( "screen and (-webkit-min-device-pixel-ratio:2)");

    if( modern_media_query.matches ){
        //DO ALL THE THINGS HERE
    }
</script>

RewriteCond %{HTTP_USER_AGENT} “ipod|iphone|ipad|blackberry”[NC]
RewriteCond %{REQUEST_URI} ^/$
RewriteRule ^ http://m.yoursite.com%{REQUEST_URI} [R,L]