How To Redirect Users to Mobile Website

It is important to redirect mobile users to mobile version of your website, unless your site is responsive. In this article, we will look at how to redirect users to mobile website.

How To Redirect Users to Mobile Website

Here are the steps to redirect users to mobile website. There are various ways to redirect users to mobile site. We will look at each of them one by one.

1. Redirect to mobile site using Javascript

Let us say you want to redirect users to mobile website http://m.example.com. Here’s a simple JS snippet that you need to add to all your web pages, in order to redirect them to mobile site using javascript.

if( /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) ) {
   window.location = "http://m.example.com/";
}

The above code checks the user agent of client to see if it is any of Android, iPhone, iPad, etc. and detects those requests to mobile site.

You can modify the following test criteria as per your requirement.

/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/

Here is another simple yet elegant way to redirect users to mobile site.

if (screen.width <= 720) {
        window.location = "http://m.example.com";
    }

The above code basically redirect all requests to mobile website, if the user’s screen width is less than 720px, which is the case with most mobile devices.

Also read : How to Fix Too Many Redirects Error in Website

2. Redirect to Mobile site using htaccess

If your website runs on Apache, then you can add the following code to your htaccess file to redirect to mobile website using htaccess file. Replace m.example.com below with your mobile site’s URL.

    RewriteBase /
    RewriteEngine On

    # Check if mobile=1 is set and set cookie 'mobile' equal to 1
    RewriteCond %{QUERY_STRING} (^|&)mobile=1(&|$)
    RewriteRule ^ - [CO=mobile:1:%{HTTP_HOST}]

    # Check if mobile=0 is set and set cookie 'mobile' equal to 0
    RewriteCond %{QUERY_STRING} (^|&)mobile=0(&|$)
    RewriteRule ^ - [CO=mobile:0:%{HTTP_HOST}]

    # cookie can't be set and read in the same request so check
    RewriteCond %{QUERY_STRING} (^|&)mobile=0(&|$)
    RewriteRule ^ - [S=1]

    # Check if this looks like a mobile device
    RewriteCond %{HTTP:x-wap-profile} !^$ [OR]
    RewriteCond %{HTTP_USER_AGENT} "android|blackberry|ipad|iphone|ipod|iemobile|opera mobile|palmos|webos|googlebot-mobile" [NC,OR]
    RewriteCond %{HTTP:Profile}       !^$

    # Check if we're not already on the mobile site
    RewriteCond %{HTTP_HOST}          !^m\.
    # Check to make sure we haven't set the cookie before
    RewriteCond %{HTTP:Cookie}        !\mobile=0(;|$)
    # Now redirect to the mobile site
    RewriteRule ^ http://m.example.com%{REQUEST_URI} [R,L]

Also Read : How to Fix 403 Forbidden Error on Website

3. Redirect to Mobile Site using PHP

If your website runs on PHP, then add the following code to redirect users to mobile site using PHP.

<?php
 $iphone = strpos($_SERVER[‘HTTP_USER_AGENT’],”iPhone”);
 $android = strpos($_SERVER[‘HTTP_USER_AGENT’],”Android”);
 $palmpre = strpos($_SERVER[‘HTTP_USER_AGENT’],”webOS”);
 $berry = strpos($_SERVER[‘HTTP_USER_AGENT’],”BlackBerry”);
 $ipad = strpos($_SERVER[‘HTTP_USER_AGENT’],”iPad”);

 if ($iphone || $android || $palmpre || $ipad || $berry == true) 
 {
     echo “](http://m.example.com”;
  }
 ?>

The above code checks the user agent of each request, and redirects that match any of the strings like iPhone, Android, webOS, BlackBerry and iPad.