Как определить мобильное устройство на сайте (PHP)?

Очень часто вебмастеры сталкиваются с необходимостью адаптировать дизайн и функциональность своего сайта для просмотра на мобильных устройствах. И если ранее было достаточно проверить один из HTTP заголовков (User-agent) для того, чтобы узнать, что человек заходит с мобильного телефона, то на сегодняшний день существует множество устройств с доступом в интернет, функциональность которых сильно отличается. Это мобильные телефоны, смартфоны различных ОС, планшетные компьютеры на платформах Windows CE, Android, Apple iOS, Windows 8 (список чрезвычайно большой), телевизоры Smart-TV и прочие. И вот, как раз, с задачей точно определить тип устройства, производителя (марку), операционную систему, версию прошивки, программное обеспечение, — прекрасно справляется PHP-класс под названием MobileDetect.

Сайт проекта: http://mobiledetect.net/.
Демо: http://demo.mobiledetect.net/.
Скачать PHP-класс MobileDetect: https://github.com/serbanghita/Mobile-Detect/.

Как подключить скрипт на сайт

Для того, чтобы заставить класс MobileDetect работать на Вас, достаточно сделать две вещи:

1. Распаковать файл Mobile_Detect.php на сервер;

2. Подключить php файл Mobile_Detect.php с помощью директивы require_once и инициализировать экземпляр класса;

3. Использовать переменные класса для определения типа устройства, марки, версии прошивки, браузера и т.п.

Каждый из этих этапов заключен в примере ниже. Читайте комменты в скрипте для подробной информации.

require_once('путь_к_файлу_на_сервере/Mobile_Detect.php');  // Подключаем скрипт Mobile_Detect.php

$detect = new Mobile_Detect; // Инициализируем копию класса

// Любое мобильное устройство (телефоны или планшеты).
if ( $detect->isMobile() ) {

}

// Планшетные компьютеры
if( $detect->isTablet() ){

}

// Исключаем планшеты
if( $detect->isMobile() && !$detect->isTablet() ){

}

// Выбираем специфические платформы
if( $detect->isiOS() ){

}

if( $detect->isAndroidOS() ){

}

// Альтернативный метод is() для проверки определенных параметров (БЕТА)
$detect->is('Chrome')
$detect->is('iOS')
$detect->is('UC Browser')

// Выборка устройств, отвечающих определенным условиям, используя setUserAgent():
$userAgents = array(
'Mozilla/5.0 (Linux; Android 4.0.4; Desire HD Build/IMM76D) AppleWebKit/535.19 (KHTML, like Gecko) Chrome/18.0.1025.166 Mobile Safari/535.19',
'BlackBerry7100i/4.1.0 Profile/MIDP-2.0 Configuration/CLDC-1.1 VendorID/103',
// и т.д.
);
foreach($userAgents as $userAgent){

  $detect->setUserAgent($userAgent);
  $isMobile = $detect->isMobile();
  $isTablet = $detect->isTablet();

}

// Получаем версии компонентов устройства (БЕТА)
$detect->version('iPad'); // 4.3 (float)
$detect->version('iPhone') // 3.1 (float)
$detect->version('Android'); // 2.1 (float)
$detect->version('Opera Mini'); // 5.0 (float)
// и т.д.

Вот так, друзья! Скажу напоследок, что уж очень удобная штука: за Вас хорошо постарались разработчики этого небольшого, но полезного класса Mobile_Detect. С помощью этой библиотеки Вы можете настроить отображение своего сайта с изысканной точностью! Если моя статья оказалась Вам полезной, просьба ставить лайки, а так же обращать внимание на сайты наших рекламодателей!

Понравилась запись? Ставь лайк!
  • Спартак Ян

    спасибо. полезно и очень вовремя

  • Андрей

    Спасибо буду пользоваться! И хотелось бы вопрос вам, почему нужно использовать этот php класс для определения, а не всеми любимый bootstrap?

  • мне нужен редирект на мобильную версию, но я не понял как это сделать)) если кто шарит подскажите!

    • VovaMaster99

      проверяешь isMobile | isTablet. Если правда, то header(«Location: mobile/bla_tipa_modilnya_stranica.php»);

  • Спасибо. Пригодилось

  • Fktrctq

    require_once ‘Mobile_Detect.php’;
    $detect = new Mobile_Detect;
    if ( $detect->isMobile()) {
    include ‘index-mobil.php’;
    }
    else if ( $detect->isTablet()) {
    include ‘index-tabl.php’;
    }
    else {include ‘index-pc.php’;
    }
    Подскажите пожалуйста как сделать подгрузку файла index-tabl.php если просматриваем сайт на планшете Пробую делать (код выше) но выводится файл index-mobil.php

    • Александр Малков

      Делайте проверку так

      if( $detect->isMobile() && !$detect->isTablet() ){
      include ‘Ваш файл’;
      } else if ($detect->isTablet()){
      include ‘Ваш файл’;
      } else {
      include ‘Ваш файл’;
      }
      и все у вас будет работать!

      • Fktrctq

        а есть ли еще способ проверки на горизонтальное расположение экрана мобильников и планшетов

        • Admin

          Для этого средства css неплохо подходят. Адаптивный дизайн в помощь. Просто средствами php нужно определять что то такое, что остаётся неизменным. А ориентация же меняется в просессе эксплуатации.

          • Fktrctq

            Все так и сделано на css только вот дело в том что стили для мобильного устройства отличаются от стилей для планшетов В горизонтальном положении мобильного устройства нужно сделать стили как для планшета Поэтому и нужно способ проверки на горизонтальное положение смартфона!

          • Admin

            Ну все ведь просто. С помощью php на стороне сервера подключаете нужные стили. А ориентацию определяете директивой css min-width. Или с помощью фишки css3, касаюащейся непосредственно вашего вопроса: @media all and (orientation: landscape), all and (min-width: 480px) { … }.

          • Fktrctq

            Спасибо что то наметил А нет ли способа чтобы определение вертикального положения было каким то другим способом У меня как бы не только стили меняются но еще и верстка немножко другая под мобильный вариант и планшет Одними стилями изменить не могу нужно чтобы под вертикальное положение еще подключался другой шаблон верстки как под планшет

          • Admin

            Тогда используйте Javascript с динамическим добавлением элементов.

            window.onorientationchange = function() {
            var orientation = window.orientation;
            switch(orientation) {…}
            }

            Вот тут описан еще какой-то метод с помощью JS, который записывает информацию об ориентации экрана в cookies, а на стороне сервера этот параметр считывается. Слабо представляю как это может быть полезно, но все-таки кину ссылочку: http://stackoverflow.com/questions/9364746/retrieve-landscape-portrait-mode-with-php

  • Fktrctq

    а можно ли как сделать определение в каком положении находится планшет в горизонтальном или вертикальном

    • Admin

      А зачем? Для этого средства css неплохо подходят.

Loading more content...