INTRODUCTION
MOBILE DETECTION
Welcome to a tutorial on how to Detect Mobile or desktop in PHP. So you want to redirect the user to a mobile website, or maybe hide the “mobile only” features on a desktop? Well, we need to detect if the user has a mobile device or desktop first, and that is exactly what we will walk through in this guide – The various ways to do the detection, and which is the best method. Read on to find out!
I have included a zip file with all the example code at the end of this tutorial, so you don’t have to copy-paste everything… Or if you just want to dive straight in.
Related Articles
CONFESSION
AN HONEST DISCLOSURE
Quick, hide your wallets! I am an affiliate partner of Google, eBay, Adobe, Bluehost, Clickbank, and more. There are affiliate links and advertisements throughout this website. Whenever you buy things from the evil links that I recommend, I will make a commission. Nah. These are just things to keep the blog going, and allows me to give more good stuff to you guys - for free. So thank you if you decide to pick up my recommendations!
NAVIGATION
TABLE OF CONTENTS
Method 1 | Method 2 | Method 3 |
Extra | Extra | Closing |
METHOD 1
THE USER-AGENT
This first method that we will touch on involves reading information from the HTTP user-agent… Which is also pretty much the backbone behind all of the other methods.
WHAT IS THE USER AGENT?
Let me just do a quick quote from Mozilla developer:
The User-Agent request header contains a characteristic string that allows the network protocol peers to identify the application type, operating system, software vendor or software version of the requesting software user agent.
In the more layman terms, the HTTP user-agent is “invisible information” that a web browser sends to the web server when requesting for a web page – We, the web developers can then use this information to determine what kind of technology the user has, and serve our webpages accordingly.
WHAT INFORMATION IS IN THE USER AGENT?
Quoting from good old Mozilla again, here is how a typical user-agent is formatted:
User-Agent: Mozilla/ () () A more realistic example from my very own computer:
Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/72.0.3626.119 Safari/537.36If you are interested, you can also check your own user-agent at whatismybrowser.com, and here are the more relevant examples of mobile agents:
- Android user agents
- iOS user agents
Some of you sharp code ninja should have already figured out how we can determine if the user is on a mobile or desktop device now – The hardware type of mobile devices almost always reports as Mobile, Mobile – Phone, or Mobile – Tablet.
DETECTION WITH USER-AGENT
The user-agent can be accessed from the $_SERVER['HTTP_USER_AGENT'] global variable – PHP server variable, and we can use it to detect the platform.
It’s that simple – As long as the user-agent string contains the word “mobile”, we will consider that the user is on a mobile device.
METHOD 2
MOBILE, TABLET, OR DESKTOP
Now that you know the basics of HTTP user-agent, this second method is kind of an “alternative” and improvement – So what if you want to further differentiate between mobile, tablet, and desktop?
MORE CHECKS
Yep, we simply add another layer of check to our earlier function, and this will further filter out the tablets.
METHOD 3
MOBILE DETECTION LIBRARY
Finally, for you guys who are looking for very detailed checks, I will suggest using a library called Mobile Detect instead.
GETTING THE MOBILE DETECT LIBRARY
You can download the Mobile Detect library from their website, or pull it directly into your project folder using Composer with composer require mobiledetect/mobiledetectlib:
D:\http\test>composer require mobiledetect/mobiledetectlib
Using version ^2.8 for mobiledetect/mobiledetectlib
./composer.json has been updated
Loading composer repositories with package information
Updating dependencies (including require-dev)
Package operations: 1 install, 0 updates, 0 removals
- Installing mobiledetect/mobiledetectlib (2.8.33): Downloading (100%)
Writing lock file
Generating autoload filesTHE MOBILE DETECT SCRIPT
Once you have downloaded the mobile detect script, all that is left is to use it:
isMobile() || $detect->isTablet()) {
echo "MOBILE OR TABLET DEVICE";
if( $detect->isiOS() ){
echo "IOS";
}
if( $detect->isAndroidOS() ){
echo "ANDROID";
}
} else {
echo "DESKTOP";
}
// There are plenty more, and you check it out here -
// http://demo.mobiledetect.net/
?>EXTRA
LIMITATIONS & USEFUL BITS
That’s all for the code of this tutorial, and here is a small section on some extras that may be useful to you.
WHICH IS THE BEST?
Personally, I prefer the first lightweight solution – Clean, simple, fast, and it is good enough to cover most cases. But if you really have to dig in deep and separate your users down to the brand or browser… Then it is a good time to reconsider how you are approaching your project design.
THE LIMITATIONS
We can only get so much information out of the user agent. Please also take note that the detection is not going to be 100% accurate, as changes will occur over time – We literally have folding smartphones that are in-between a tablet and phone, also tablets that act as laptops… So which is which? You decide.
P.S. The advanced users can also choose to disable the user agent, and this detection feature is going to fail.
ALTERNATIVE – RESPONSIVE DESIGN
Sometimes, all it takes is to just adopt a responsive design and change the HTML/CSS. Yep, if the design is your only concern, then is it really worth the time and money to develop another dedicated mobile site? You decide.
EXTRA
DOWNLOAD
Finally, here is the download link to the example code as promised.
QUICK NOTE
The zip file below does not contain a copy of the Mobile Detect library. Please visit their website or use Composer to get the latest version instead.
SOURCE CODE DOWNLOAD
Click here to download all the example source code, I have released it under the MIT license, so feel free to build on top of it or use it in your own project.
CLOSING
WHAT’S NEXT?
Thank you for reading, and we have come to the end of this guide. I hope that it has helped you in your project, and if you want to share anything with this guide, please feel free to comment below. Good luck and happy coding!
The post 3 Ways to Detect Mobile or Desktop in PHP appeared first on Code Boxx.
