Best way to detect Mobile device : Magento2

Here We will know, how to detect mobile device in Magento2 by simple code

Suppose You have to open a listview by default in Mobile screen, Then this will work for you, let’s get started.

We have default code in app\design\frontend\theme_name\Magento_Catalog\templates\product\list.phtml as we defined just below.

[php]

if ($block->getMode() == ‘grid’) {
$viewMode = ‘grid’;
$showDescription = false;
$templateType = \Magento\Catalog\Block\Product\ReviewRendererInterface::SHORT_VIEW;
} else {
$viewMode = ‘list’;
$showDescription = true;
$templateType = \Magento\Catalog\Block\Product\ReviewRendererInterface::FULL_VIEW;
}
[/php]

You just have to make a simple function in Block file to detect Mobile and have to call in list.phtml
I have added this function in app/code/Magiccart/Shopbrand/Block/Product/Listproduct.php

[php]

public function isMobile()
{
$regex_match = “/(nokia|iphone|android|motorola|^mot\-|softbank|foma|docomo|kddi|up\.browser|up\.link|”
. “htc|dopod|blazer|netfront|helio|hosin|huawei|novarra|CoolPad|webos|techfaith|palmsource|”
. “blackberry|alcatel|amoi|ktouch|nexian|samsung|^sam\-|s[cg]h|^lge|ericsson|philips|sagem|wellcom|bunjalloo|maui|”
. “symbian|smartphone|mmp|midp|wap|phone|windows ce|iemobile|^spice|^bird|^zte\-|longcos|pantech|gionee|^sie\-|portalmmm|”
. “jig\s browser|hiptop|^ucweb|^benq|haier|^lct|opera\s*mobi|opera\*mini|320×320|240×320|176×220”
. “)/i”;

if (preg_match($regex_match, strtolower($_SERVER[‘HTTP_USER_AGENT’]))) {
return TRUE;
}

if ((strpos(strtolower($_SERVER[‘HTTP_ACCEPT’]),’application/vnd.wap.xhtml+xml’) > 0) or ((isset($_SERVER[‘HTTP_X_WAP_PROFILE’]) or isset($_SERVER[‘HTTP_PROFILE’])))) {
return TRUE;
}

$mobile_ua = strtolower(substr($_SERVER[‘HTTP_USER_AGENT’], 0, 4));
$mobile_agents = array(
‘w3c ‘,’acs-‘,’alav’,’alca’,’amoi’,’audi’,’avan’,’benq’,’bird’,’blac’,
‘blaz’,’brew’,’cell’,’cldc’,’cmd-‘,’dang’,’doco’,’eric’,’hipt’,’inno’,
‘ipaq’,’java’,’jigs’,’kddi’,’keji’,’leno’,’lg-c’,’lg-d’,’lg-g’,’lge-‘,
‘maui’,’maxo’,’midp’,’mits’,’mmef’,’mobi’,’mot-‘,’moto’,’mwbp’,’nec-‘,
‘newt’,’noki’,’oper’,’palm’,’pana’,’pant’,’phil’,’play’,’port’,’prox’,
‘qwap’,’sage’,’sams’,’sany’,’sch-‘,’sec-‘,’send’,’seri’,’sgh-‘,’shar’,
‘sie-‘,’siem’,’smal’,’smar’,’sony’,’sph-‘,’symb’,’t-mo’,’teli’,’tim-‘,
‘tosh’,’tsm-‘,’upg1′,’upsi’,’vk-v’,’voda’,’wap-‘,’wapa’,’wapi’,’wapp’,
‘wapr’,’webc’,’winw’,’winw’,’xda ‘,’xda-‘);

if (in_array($mobile_ua,$mobile_agents)) {
return TRUE;
}

if (isset($_SERVER[‘ALL_HTTP’]) && strpos(strtolower($_SERVER[‘ALL_HTTP’]),’OperaMini’) > 0) {
return TRUE;
}

return FALSE;
}

[/php]

Now later stage, You have to call this function and apply a simple condition to make it work in default list.phtml and this will look like below code.

[php]

$mobile = $block->getLayout()->createBlock(‘Magiccart\Shopbrand\Block\Product\ListProduct’);
$detectMobile = $mobile->isMobile();

if($block->getMode() == ‘grid’) {
if($detectMobile == 1){
$viewMode = ‘list’;
$showDescription = true;
$templateType = \Magento\Catalog\Block\Product\ReviewRendererInterface::FULL_VIEW;
} else {
$viewMode = ‘grid’;
$showDescription = false;
$templateType = \Magento\Catalog\Block\Product\ReviewRendererInterface::SHORT_VIEW;
}
} else {
$viewMode = ‘list’;
$showDescription = true;
$templateType = \Magento\Catalog\Block\Product\ReviewRendererInterface::FULL_VIEW;
}

[/php]

That’s how you can detect Mobile device in Magento 2.
I hope it helps you.