Etiqueta: tablet

En la búsqueda de crear la mejor solución para que los usuarios que visiten nuestro sitio tenga la mejor experiencia sea cual sea el dispositivo quizás además de tener un tema responsive queramos mostrar u ocultar algo según el dispositivo.

Con las media queries podemos hacerlo con CSS pero si detectamos el dispositivo podemos directamente no servirlo o cambiar por ejemplo el tamaño de las imágenes a mostrar o decidir si mostrar o no más o menos anuncios de Adsense.

Los 2 problemas de wp_is_mobile()

En WordPress existe una función desde la versión 3.4 que podemos usar como condicional:

wp_is_mobile()

function wp_is_mobile() {
	static $is_mobile;

	if ( isset($is_mobile) )
		return $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;
}

Esta función detecta si la visita es de un dispositivo móvil o tablet. El problema surge precisamente de esto, lo que detectamos son los dispositivos, independientemente de la resolución, eso significa que da igual que sea un smartphone Android que una tablet, un iPhone que un iPad.

Ejemplo:

<?php if (wp_is_mobile() ) : ?>
Esto sólo se mostrará en smartphones y tablets
<?php endif ?>

Otro problema es que si utilizamos un cacheado y el usuario que nos cachea la página lo hace desde un móvil esa página cacheada se servirá también a los que nos visiten desde un equipo de sobremesa.

Otro plugin similar es WordPress Mobile Detect que en vez de funciones utiliza shortcodes que puedes usar directamente en tu editor.

Media solución alternativa, plugin mobble

El plugin mobble soluciona el primero de los problemas, nos permite ampliar el criterio y distinguir entre tablets y SO.

Nos proporciona nuevas funciones que podemos utilizar también de forma condicional:

is_handheld(); // cualquier dispositivo portátil (smartphone, tablet, Nintendo)

is_mobile(); // cualquier smartphone (iPhone, Android, etc)

is_tablet(); // cualquier tablet

is_ios(); // dispositivos Apple (iPhone, iPad, iPod)

Ejemplo:

<?php 
if (!is_mobile()) {
    get_sidebar();
}
?>

Pero el problema del cacheado seguirá existiendo.

Conclusión: No los uses

De hecho el tema por defecto Twenty Fourteen eliminó la función wp_is_mobile de su código. En este hilo verás cómo se aconseja sólo su uso para el backend a no ser que no utilices ningún sistema de cacheado.

Lo mejor es que utilices alguna solución Javascript, aquí tienes algunas:

• How to Detect Mobile Devices using jQuery
• WhichBrowser
• conditionizr