0

I have a slider, it shows 4 videos, I need to show the picture when I go through with mobile device, video when through a desktop , the slider is written in main.min.js, and includeed in the main.tpl(template), and i have a script that detect mobile device

require_once 'Mobile_Detect.php';
$detect = new Mobile_Detect;

// Any mobile device (phones or tablets).
if ( $detect->isMobile() ) {

}

// Any tablet device.
if( $detect->isTablet() ){

what should i do to show the picture when I go through with mobile device, video when through a desktop?

Arsen Ospanov
  • 3
  • 1
  • 12
  • did you tried this solution? https://stackoverflow.com/a/4117597/4459647 – MRustamzade Apr 10 '19 at 06:11
  • 4
    You should **not** use php to determine user device, since php is a server side language, it is not a good way to do that. you can easily use CSS and/or JS/jQuery to identify user device since they work on client side, – Vishwa Apr 10 '19 at 06:11
  • @Vishwa What's wrong with detecting the device at the server-side? Knowing the device you can offer a customized version of your page for specific devices. – Teemu Apr 10 '19 at 06:14
  • 1
    @vishwa so which way do you suggest? and what should i write – Arsen Ospanov Apr 10 '19 at 06:19

2 Answers2

1

I think the best way is to check by user agent. WordPress has a wp_is_mobile fucntion in it's core that might help (I've removed WP parts of it):

function is_mobile() {
    if ( empty( $_SERVER['HTTP_USER_AGENT'] ) ) {
        $is_mobile = false;
    } elseif ( strpos( $_SERVER['HTTP_USER_AGENT'], 'Mobile' ) !== false // many mobile devices (all iPhone, iPad, etc.)
        || strpos( $_SERVER['HTTP_USER_AGENT'], 'Android' ) !== false
        || strpos( $_SERVER['HTTP_USER_AGENT'], 'Silk/' ) !== false
        || strpos( $_SERVER['HTTP_USER_AGENT'], 'Kindle' ) !== false
        || strpos( $_SERVER['HTTP_USER_AGENT'], 'BlackBerry' ) !== false
        || strpos( $_SERVER['HTTP_USER_AGENT'], 'Opera Mini' ) !== false
        || strpos( $_SERVER['HTTP_USER_AGENT'], 'Opera Mobi' ) !== false ) {
            $is_mobile = true;
    } else {
        $is_mobile = false;
    }
    return $is_mobile;
}

For detecting if a mobile device is a tablet or a phone, I don't think user agent help much. here is a list of tablet user agents that I found: Tablet User Agents

Salar
  • 81
  • 4
0

Try this class http://mobiledetect.net, it's best for detecting different devices.

// Include and instantiate the class.
require_once 'Mobile_Detect.php';
$detect = new Mobile_Detect;

// Any mobile device (phones or tablets).
if ( $detect->isMobile() ) {
    // Show the image here for mobile
}

if ( !$detect->isMobile() ) {
    // Show the image here for computer
}
Vasant Hun
  • 51
  • 4