Contact via Prestashop

Prestashop 1.7 – Formulaire de Contact (ép.15)

Le formulaire de contact ça vous semble une page sans importance ? Détrompez-vous, il faut absolument la soigner pour inspirer confiance… sous Prestashop 1.7 ça évolue dans le bon sens.

Episode 15

Le formulaire de contact c’est toujours un emplacement « austère »… combien de fois j’ai vu cette page dans Prestashop avec seulement quelques champs… et un pauvre bouton valider (sans aucune information complémentaire).

Il faut dire aussi qu’il y a toujours cette envie de rester caché quand on est marchand, afin de ne pas être dérangé par le client… Hey ! Nous sommes en 2017, les clients veulent pouvoir vous contacter facilement, les acheteurs veulent un terrain de confiance… avec un numéro de téléphone… une adresse, de la transparence !

Le système de FAQ est aussi sous-exploité, répondez d’avance aux questions régulières de vos clients en mettant en place une page pour les questions les plus fréquentes. Avec cette approche, vous allez leur faire gagner du temps et vous aussi.

Essayez aussi dans la mesure du possible d’humaniser avec une photo la page de contact, un gros plus serait de pouvoir mettre la photo des personnes qui vont vous répondre… C’est très primaire comme comportement, mais on est toujours plus « tolérant » quand on sait qui va nous répondre et qu’on sait d’avance que quelqu’un est là pour nous.

Vous l’avez compris, si vous êtes encore à l’ère des formulaires « ultra-basiques », de l’époque des années 2000 faites un petit effort.

Ressources

Pour ce tutoriel vous avez à disposition :

  • Fichier contact.psd (pour votre bannière)
  • contactform.tpl (pour la partie droite du formulaire)
  • ps_contactinfo-rich.tpl (pour la partie gauche du formulaire)
  • theme.css.txt (extrait de règles CSS)

Télécharger

Au programme

  • Améliorer la page de contact Prestashop de manière générale.
  • Ajuster la taille des champs et obtenir un alignement parfait.
  • Masquer l’option sujet dans la liste des champs.
  • Ajuster les coordonnées de contact de la boutique.
  • Inclure l’emplacement Google Map.
  • Ajouter une bannière dans le haut de pages + règles CSS.
  • Intégrer un lien vers une FAQ (qui pointe vers une page CMS).
  • Enlever le fond gris pour plus de clarté ?

5 réflexions au sujet de « Prestashop 1.7 – Formulaire de Contact (ép.15) »

  1. Bonjour Germain
    merci pour cet excellent tuto.
    Je coince cependant avec ce bout de code :

        <strong>{l s='Consultez notre FAQ'}</strong> : <a>getCMSLink(17)}" target="_blank"&gt;{l s='Vous allez peut-être trouver la réponse à votre question.'}</a>
    

    « consultez notre FAQ » s’affiche bien, mais pas le lien cliquable
    ma page cms est bien active (id 17), je ne vois pas ce qui cloche

    Merci
    Cordialement
    Fabien

    1. Bonjour,

      Pouvez-vous vérifier si vous avez bien copier/coller le code ci-dessous :

      <div class="alert alert-info">
          <strong>{l s='Consultez notre FAQ'}</strong> : <a href="{$link->getCMSLink(6)}" target="_blank"><u>{l s='Vous allez peut-être trouver la réponse à votre question.'}</u></a>
      </div>
      

      Essayez aussi de déplacer le code dans la page TPL à plusieurs emplacements différents pour tester.

      A bientôt !

  2. Merci Germain
    J’ai bien vérifié le code, c’est le même, je l’ai déplacé à plusieurs endroits, rien n’y change. Seul le bloc « Consultez notre FAQ » apparait, mais pas le lien
    Mais pas grave, je trouverai bien un autre moyen

    merci quand même
    Cordialement

    1. Hello,

      Difficile de répondre précisément sur le cas, tu peux toujours te faire aider par un développeur (voir forum Prestashop) ou un freelance qui pourra juste te corriger le code.

      A bientôt !

Laisser un commentaire

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