Categorías
Prestashop

¿Cómo detectar si es un móvil en Prestashop con .tpl?

Descubre cómo utilizar las clases de Prestashop para detectar el dispositivo utilizado y poder mostrar o no textos, imágenes, funciones adicionales de forma correcta y eficaz

Descubre cómo utilizar las clases de Prestashop para detectar el dispositivo utilizado y poder mostrar o no textos, imágenes, funciones adicionales de forma correcta y eficaz

Además de utilizar un tema responsive, que se adapta según el tamaño del dispositivo que utilice el usuario, puede ser útil para detectar si el dispositivo es un smartphone, una tablet o un ordenador.

En un tema receptivo, generalmente, usamos la técnica de no mostrar ciertas partes de la página en algunos dispositivos simplemente escondiéndolas a través de algunas reglas de hojas de estilo (css): esta solución no aligera el peso de las páginas porque el código oculto será de todos modos presente en la página y tan cargado por el navegador.

En cambio, mediante la detección del dispositivo utilizado, es posible que se muestren o no textos, imágenes, funciones adicionales, etc. de forma correcta y eficaz.

Prestashop 1.7.x y Prestashop 1.6.1.x

Estas versiones de Prestashop ya utilizan una clase para detectar el dispositivo utilizado (/classes/Context.php), gracias a la cual podemos consultar directamente en los archivos .tpl de nuestro tema.

Detectar un teléfono inteligente

{if Context::getContext()->isMobile() && !Context::getContext()->isTablet()}
  tu contenido
{/if}

o

{if Context::getContext()->getDevice() == 4}
  tu contenido
{/if}

Detectar una tableta

{if Context::getContext()->isTablet()}
  tu contenido
{/if}

o

{if Context::getContext()->getDevice() == 2}
  tu contenido
{/if}

Detectar una computadora

{if !Context::getContext()->isMobile() && !Context::getContext()->isTablet()}
  tu contenido
{/if}

o

{if Context::getContext()->getDevice() == 1}
  tu contenido
{/if}

Prestashop 1.6

Detectar un dispositivo móvil

{if isset($mobile_device) && $mobile_device}
  tu contenido
{/if}