Jump to content

TUTO - Affichage différent selon Mobile, Tablette ou PC


Recommended Posts

Bonjour

 

Sur la version 1.6.1.1 j'ai rencontré des pb avec les ipad pro et ipad du à leurs grosses résolutions 

alors pour pallier au problème je devais réussir à détecter les tablettes via l’entête et non plus que via les media query

dans  /classes/controller/FrontController.php (ligne 428 environ) sous la ligne 

 $this->context->smarty->assign(array(
            // Useful for layout.tpl

'mobile_device'       => $this->context->getMobileDevice(),

ajouter


'tablet_device'       => $this->context->isTablet(),

ce qui donne 

 

     $this->context->smarty->assign(array(
            // Useful for layout.tpl
 'mobile_device'       => $this->context->getMobileDevice(),
 'tablet_device'       => $this->context->isTablet(),

Ensuite dans vos .tpl il vous suffit de conditionner de la manière suivante :

 

 {if isset($tablet_device) && $tablet_device} 
<!--  TABLETTE -->
{elseif isset($mobile_device) && $mobile_device}
<!--  MOBILE -->
{else} 
<!--  ORDINATEUR -->
</if>

Coupler avec ce module  http://addons.prestashop.com/fr/17310-menu-pour-mobile.html et quelques modifications on arrive à un résultat plutôt satisfaisant.

 

Démo sur le site d'une cliente : http://www.little-kids.fr

 

 (attention ne pas juste redimensionner la fenêtre sinon vous n'aurai que le comportement responsive sans la détection,  

Alors tester avec un mobile et une tablette )

 

Thomas

Edited by webconcept76 (see edit history)
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...