Esa misma noche me puse a buscar información por internet y rápidamente di con la siguiente página donde encontré un artículo escrito por Ruadhán O'Donoghue. En el árticulo en cuestión encontré un código en php que realizaba esa tarea en cuestión.
Mi idea después de probarlo fue convertirlo en un shortcode que me permitiera introducirlo dentro de cualquier post así poder bloquear o mostrar contenido, de manera sencilla, teniendo en cuenta el dispositivo.
Así que manos a la obra me dispuse a crear un pequeño plugin para comprobar si esto me sería posible (Teniendo en cuenta que no soy un diestro en la materia)
Dentro de mi curiosidad empecé creando la carpeta de mi plugin al que decidí llamarle which_device. Después dentro de ella creé el archivo principal de mi plugin llamado "index.php". Dentro de el cree por así decirlo, o como yo lo entiendo, la cabecera de mi plugin, que quedó de la siguiente manera.
<?php
/*
Plugin Name: which_device
Plugin URI:www.voyaprendiendoytu.esy.es
Description:Adivina desde que dispositivo nos están visitando
Author:Jesús Hernández Paredes
Version:0.1
Author URI:www.voyaprendiendoytu.esy.es
*/
Dentro de lo que yo entiendo, es necesario introducir siempre esta cabecera dentro de cualquier plugin que uno quiera realizar, si no wordpress, después no detectará el plugin creado.
Lo siguiente fue coger el código encontrado en el artículo de Ruadhán O'Donoghue y convertirlo en una función escrita dentro del mismo archivo.
function is_device()
{
/*
* Adivina desde que dispositivo nos están visitando
* Fuente original de este código:https://mobiforge.com/design-development/tablet-and-mobile-device-detection-php
*/
$tablet_browser = 0;
$mobile_browser = 0;
if (preg_match('/(tablet|ipad|playbook)|(android(?!.*(mobi|opera mini)))/i', strtolower($_SERVER['HTTP_USER_AGENT']))) {
$tablet_browser++;
}
if (preg_match('/(up.browser|up.link|mmp|symbian|smartphone|midp|wap|phone|android|iemobile)/i', strtolower($_SERVER['HTTP_USER_AGENT']))) {
$mobile_browser++;
}
if ((strpos(strtolower($_SERVER['HTTP_ACCEPT']),'application/vnd.wap.xhtml+xml') > 0) or ((isset($_SERVER['HTTP_X_WAP_PROFILE']) or isset($_SERVER['HTTP_PROFILE'])))) {
$mobile_browser++;
}
$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','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))
{
$mobile_browser++;
}
if (strpos(strtolower($_SERVER['HTTP_USER_AGENT']),'opera mini') > 0)
{
$mobile_browser++;
$stock_ua = strtolower(isset($_SERVER['HTTP_X_OPERAMINI_PHONE_UA'])?$_SERVER['HTTP_X_OPERAMINI_PHONE_UA']:(isset($_SERVER['HTTP_DEVICE_STOCK_UA'])?$_SERVER['HTTP_DEVICE_STOCK_UA']:''));
}
if (preg_match('/(tablet|ipad|playbook)|(android(?!.*mobile))/i', $stock_ua))
{
$tablet_browser++;
}
if ($tablet_browser > 0)
{
//if tablet
return 2;
}
else if ($mobile_browser > 0)
{
//if mobile
return 1;
}
else
{
//if desktop
return 0;
}
}
Como se puede observar, aquí el código es idéntico al del artículo de Ruadhán.
En el código sólo cambio la parte final, donde yo retorno un número para identificar el dispositivo que visita la web:
- 0: Ordenador
- 1: Móvil
- 3: Tablet
Con esto ya creado, me dispuse a generar el código de la función que haría al shortcode funcionar. La función tendría la siguiente llamada:
function which_device($atts,$content)
Donde:
$atts: Contendría la lista de dispositivos que admitirán el contenido a mostrar
$content: Es el contenido a bloquear o a mostrar.
La función en cuestión, al final quedó de la siguiente manera:
function which_device($atts,$content)
{
//si $atts no contiene argumentos iniciamos device a desktop
extract( shortcode_atts(array(
'device'=>'desktop'
),$atts));
$listTotalDecives=array("desktop","mobile","tablet");
//Lista de dispositivos que soportarán el contenido a mostrar
$listDevice=split(",",$device);
$numberMaxDevice=count($listDevice);
$numberTotalDevice=count($listTotalDecives);
if($numberMaxDevice==0)
{
$numberMaxDevice=1;
$listDevice=array($device);
}
$resultDevice=is_device();
//En este doble for es donde de verdad compruebo el tipo de dispositivo
for ($c=0;$c<$numberMaxDevice;$c++)
{
for($i=0;$i<$numberTotalDevice;$i++)
{
if ((strcmp($listDevice[$c],$listTotalDecives[$i])==0)and($resultDevice==$i))
{
return $content;
}
}
}
return "";
}
//Esta función enlaza, la función escrita con el nombre que le queremos dar al shortcode y que en este caso es el mismo.
add_shortcode("which_device","which_device");
Después de todo esto, lo único que me quedó por hacer, fue comprimir la carpeta con mi código en un archivo comprimido .zip y subirlo y instalarlo en wordpress como cualquier otro plugin más.
Después de activarlo su uso quedo bastante sencillo. Dentro de cualquier post escribimos lo siguiente:
[which_device device='mobile,tablet']
Contenido para móviles y tablet.
[/which_device]
[which_device device='desktop']
Contenido para ordenadores.
[/which_device]
Como veis así de sencillo fue y de paso aprendí a crear un plugin y un shortcode que, aunque sencillos, ahora me son de grata utilidad.
dejo aquí un enlace al archivo .zip con el plugin, para al que le interese probarlo y para que el código quede más claro.
which_device.zip
¿Podríamos mejorarlo? ¿Qué crees?
