In earlier post about wp_is_mobile() I explain that we can use wp_is_mobile() WordPress function to design theme by adding wp-is-mobile body class and use it in CSS and Javascript/jQuery.
But @samikeijonen mention that similar method was removed from twenty fourteen theme because if we use page cache/html cache the result will also be cached.
So I think the best way to use wp_is_mobile() is to also detect mobile browser via javascript/jQuery using this simple code:
/* Detect mobile browser */
if( navigator.userAgent.match(/Mobile/i)
|| navigator.userAgent.match(/Android/i)
|| navigator.userAgent.match(/Silk/i)
|| navigator.userAgent.match(/Kindle/i)
|| navigator.userAgent.match(/BlackBerry/i)
|| navigator.userAgent.match(/Opera Mini/i)
|| navigator.userAgent.match(/Opera Mobi/i) ){
$("body").removeClass("wp-is-not-mobile").addClass("wp-is-mobile");
}
else {
$("body").removeClass("wp-is-mobile").addClass("wp-is-not-mobile");
}The code above check the same user agent string used in wp_is_mobile().
