Prestashop la version mobile un retour concret

La version Prestashop mobile ? Oui j’en ai déjà causé mais j’avais pas eu l’occasion de la déployer en production sur une véritable boutique. Je l’ai finalement fait pour Autodingo… et je suis arrivé à une première conclusion.

Le template Prestashop mobile
Pour mon projet j’ai décidé de prendre le thème mobile Prestashop qui est gratuit et je l’ai mis en place… Pour réussir cette prouesse j’ai déjà splitté mon environnement de travail local sous GIT en 2 parties… « production » et « développement » qui contenait le thème mobile (+ son module)… L’installation ne cause pas trop de problèmes on a vite un truc « standard » qui est opérationnel et ça c’est cool.

Prise de conscience
Si j’ai choisi de faire un thème mobile c’est parce que rendre responsive mon site principal c’était bien trop « long »… mais finalement customiser un thème « mobile » l’est tout autant… D’ailleurs je l’ai déjà pas mal adapté… mais j’ai passé quand même beaucoup moins de temps que sur la version « classique » (ouai y’a pas toutes les fonctions). En plus il a fallu refaire les traductions du thème… car les traductions sont sauvées « par template »…. clair c’est bien lourdingue.

Et ça donne quoi ?
Voilà un exemple de ce que ça donne… bon est en mode navigateur sous Firefox… sur un mobile vous aurez pas le scroll sale à droite…

1) sur le haut à droite on a accès à une recherche personnalisée sur mesure
2) les offres du jour au centre
3) différents boutons non-présent par défaut comme :
-> voir le site classique
-> inscription à la newsletter
-> page de contact

Les catégories avec la disponibilité de l’offre.

Un formulaire de recherche avancé sur-mesure… avec tous les paramètres rêvés.

Oui y’a même les options détaillées des voitures… pour les plus « exigeants ».

Ou encore l’inscription à la newsletter… simple, mais efficace !

Sur la fiche produit le même esprit a été conservé avec les infos des voitures… les possibilités d’alertes.

Y’a même les petites illustrations marrantes… parce que y’a pas à dire mais ça fait tout  !

Le compte client… avec la possibilité de gérer les annonces

Et si je désactivais mon annonce … bien pratique 🙂

Bref… y’a de quoi faire déjà … et finalement je me suis bien rendu compte du travail que ça pouvait impliquer, je sais à présent que ce type de travail demande beaucoup de temps et de ressource. Quand le client demande « compatible sur mobile »… c’est pas une formalité… rien qu’avec ça le prix du devis peut-être multiplié par deux facilement… et oui une ligne de texte = budget x 2 …. bah oui pour faire bien, il faut faire un tour complet du thème et travailler son aspect… sa logique et limiter les fonctions.

Intégrer la fonction mobile de manière intelligente
En terme de déploiement aussi cela n’est pas si simple… il a fallu fusionner la branche de dev, sur la branche de production… publier sans tout exploser ce qui était en production. Malgré tout cela demande une certaine dextérité, car le plantage ne tient qu’à un fil… j’ai du aussi apporter des changements dans le coeur… pour gérer des comportements différents sur mobile et aussi pour limiter le chargement des ressources inutiles. Bien sûr quand il a fallu fusionner les projets… c’était pas si « simple » mais ça s’est bien passé. Si jamais vous travaillez avec GIT gui, lancez la commande « gitk » pour visualiser l’état de la situation après / avant fusion pour ensuite transférer les données correctement sur la production.

Oui ça fait peur les fusions GIT…surtout quand t’es un jeune dresseur pokémon… (ahah… rien à voir, mais on s’en fou)

Bilan
Mettre en place le thème mobile comme un bourrin… rien de compliqué c’est vraiment quand on rentre dans le vif du sujet que ça se complique. Très vite quand on commence à pousser sur des détails… on voit les limites on voit les bugs aussi… on se confronte aussi à reporter les fonctions du thème « classique » dans celui « mobile » et c’est pas si évident. Le pire dans tout ça c’est quand j’ai vu que sur mon Iphone ça n’avait pas le même rendu exact que dans mon environnement de simulation sur mon PC… Donc en conclusion, mettre un thème mobile standard… pourquoi pas… viser la customisation certes c’est un plus, mais c’est long et ça prendra du temps. A la place d’un client « Mr Tout le monde »  je concentrerais l’effort sur la boutique « classique »… via mobile on pourra toujours de toute façon accéder à son offre.

Notez mon billet, Google va adorer :
1 étoiles - J'aime pas !2 étoiles - Bof !3 étoiles - Bien !4 étoiles - Très bien !5 étoiles - Génial ! (Soyez le premier à noter ce billet)
Loading...

6 commentaires sur “Prestashop la version mobile un retour concret”

  1. merci pour toutes ces informations 🙂
    j’utilise aussi ce thème mais je me suis rendu compte d’un bug
    lorsqu’on sélectionne « activer sur smartphones uniquement » le thème est quand même actif sur tablette et là le visuel n’est pas du tout adapté
    As-tu le même problème ?
    bonne soirée

    1. Mais mais…. c’est horrible ! Effectivement j’utilise cette fonction mais ça ne marchait pas (même pas vu).

      Bon j’ai cherché un peu… pas de trace particulières sur le net du coup j’ai adapté le fichier « settings.inc.php », je pense qu’il faut que tu ajoutes la même section de code.

      Quand tu testes ensuite… n’oublie pas de vider les cookies de Safari.

      ....
      define('_PS_CACHE_ENABLED_', '0');

      // -------------------------------------------
      if((isset($_GET['ps_mobile_site']) && $_GET['ps_mobile_site'] == 1) || !isset($_GET['ps_full_site']) || (!isset($_GET['ps_full_site']) && $_SERVER['HTTP_HOST'] == 'm.localhost')){
      include(dirname(__FILE__).'/../modules/mobile_theme/Mobile_Detect.php');
      $mobile_detect = new Mobile_Detect();
      define('_PS_MOBILE_TABLET_',0);

      // Webbax - 04.05.2013 - révision détection mobile
      $ps_mobile_phone = 0;
      if(isset($_GET['ps_mobile_site'])==1){
      $ps_mobile_phone = 1;
      }else{
      if($mobile_detect->isMobile() && !$mobile_detect->isTablet()){
      $ps_mobile_phone = 1;
      }
      }
      define('_PS_MOBILE_PHONE_',$ps_mobile_phone);

      }else{
      define('_PS_MOBILE_TABLET_', 0); define('_PS_MOBILE_PHONE_', 0);
      }
      define('_PS_MOBILE_', _PS_MOBILE_PHONE_ || _PS_MOBILE_TABLET_);

      /* PrestaShop Mobile */
      if(_PS_MOBILE_) define('_THEME_NAME_', 'prestashop_mobile'); else define('_THEME_NAME_','autodingo');
      // -------------------------------------------

      define('_DB_NAME_', 'xxx');
      ....

      Il y a un autre truc à savoir aussi, c’est que quand on remet les paramètres à jour de la configuration mobile depuis le back-office, parfois ça met du code à double dans le fichier settings.inc.php… du coup ça fout le bordel… au pire ça fera une plantée générale, page blanche.

      1. Bonjour,

        J’ai entré ce code et vidé cent fois les cookies.
        Rien a faire : l’option Smartphone uniquement ne fonctionne pas.
        Ce site mobile plein de bugs est aussi appellé par les tablettes.

        1. Bonjour,

          Actuellement je conseille de désactiver la version mobile (dans Apparences -> Thèmes) et d’utiliser plutôt un thème responsive.

          Cette solution n’est pas vraiment adéquate pour les petits e-commerçants, l’interface et les traductions décentralisées demandent trop de temps et de suivi.

          Merci pour votre visite.

  2. Bonjour, je trouve votre retour d’expérience intéressant. Même si je ne suis pas expert en site mobile, je trouve que l’adaptation est en adéquation avec le support.
    Je me permets par contre de réagir et aussi de vous conseiller sur l’utilisation de git:
    Pas de commit sur la branche master.
    Développez sur la branche dev, et mergez avant le passage en prod (la prod, elle, est basée sur la branche master). Au passage, le merge deviendra donc un élément familier et sera sans risque. Lors d’un hotfix, créez une branche hotfix, corrigez le code et rapatriez-le sur vos branches dev et master. Vous pouvez également utiliser les tags pour gérer les numéros de versions que vous déploierez sur la branche master, si vous le souhaitez.
    Cordialement, JPC

    1. Bonjour,

      Merci d’être passé par là !

      Pour GIT je suis encore loin d’être un expert, j’expérimente la chose (parfois des sueurs froides), mais ça demande une certaine dextérité, les commandes et les possibilités sont très nombreuses.

      J’y penserai pour la prochaine fois… bon je suis pas encore assez en mode « industrie » pour utiliser l’outil à fond… un jour viendra peut-être 😉

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *