Home Coding & Programming How to Make a Website Detect Mobile Device OS and Redirect to...

How to Make a Website Detect Mobile Device OS and Redirect to Mobile Page

Basically 80% of people across the world access the internet with mobile devices. This means that if you are building any webpage, you have to make sure it is very responsive and mobile friendly. Another way to make users using mobile devices enjoy your website is to create an app for the website which users can just tap on to access your page.

It is important to note that just building a webpage that is very mobile friendly and an app for it doesn’t do the trick because the webpage may appear differently in the various mobile OS available today. The solution i believe to this is to create a landing page for each of the available mobile OS and then redirect users to such page when they visit the webpage with the device.

To achieve this, we shall be making use of a JavaScript code to detect mobile device or browser and redirect visitors to the specific landing page meant for that device OS. Below is a guide on how to add the JavaScript code to your website;

  • First, open index.html file in any text editor.
  • Search for the <head> tag in the header section of the index.html file.
  • Copy the JavaScript code below and paste just after/below the <head> tag
<script language="javascript"> 
  if(!window.location.search.substring(1) == "full=true") {  
    if (navigator.userAgent.match(/iPhone/i) || navigator.userAgent.match(/iPad/i) || navigator.userAgent.match(/Android/i)) { // detect mobile browser
  • Finally save your file and you are done.

How the JavaScript Code Works:

Once a user visits your webpage with a mobile device, the code helps the webpage detect the type of mobile device OS and thus redirects the user to the landing page you have created for that mobile device OS.


Please enter your comment!
Please enter your name here

Most Popular

List of All JavaScript Arithmetic Operators With Examples

JavaScript offers several operators to help us work with numbers. All these operators are binary operators, which means they operate on two operands. The operands...

How to Find a Website’s RSS Feed’s URL

Having access to the RSS feed of a website gives you the opportunity to stay up-to-date on everything that website publishes. Whether that’s a...

Laravel: String data, right truncated: 1406 Data too long for column (SOLVED)

I was working on a project today when i ran into the error message "String data, right truncated: 1406 Data too long for column...

How to Enable or Disable Chrome’s Autofill on Android Devices

Storing your login details and other information in Chrome and/or your Google Account isn’t as secure as using an encrypted password manager, but it’s...

Recent Comments