[3.0.1] Formulaire de contact dynamique sur page produit

Affichez un formulaire de contact dynamique sur page produit

Pour cette nouvelle version j'ai pris le temps, enfin pas tant que cela puisque je fus pas mal accaparé par mon module concernant le Brexit, de repenser l'intégralité de la méthode d'affichage du formulaire sur les pages produits pour améliorer les performances et le ressenti des visiteurs.

Le contexte

Dans les versions précédentes, j'utilisais l'option iframe de fancybox pour afficher une page spécifique à mon module en contenu seul.

Cela avait pour effet de présenter deux soucis majeurs à mon sens.

  1. Le premier touche simplement le temps d'affichage puisque le clic sur le bouton présent sur la fiche produit provoquait l'ouverture d'une fenêtre pop-up qui chargeait le contenu de la page et donc il y avait un délai d'attente plus ou moins long.
  2. Le second était dans le cas où certains éléments de design étaient appelés pour être affichés dans l'espace de la page où normalement nous ne devrions avoir que le formulaire de contact, ce qui provoquait des soucis puisqu'on pouvait trouver une fenêtre supplémentaire de chat.

Concernant les éléments perturbateurs, dans la majorité des cas, cela provenait d'un mauvais développement ou d'intégration de ces éléments mais cette information n'est pas recevable pour la majorité des utilisateurs de mon module, ce qui m'a poussé à revoir l'intégralité du code d'affichage.

La solution

Pourquoi ne pas optimiser l'affichage de cette fenêtre pop-up en préchargeant le contenu avant d'afficher celle-ci.

voilà c'est fini j'ai tout dit ... mais non, si le développement de module universel était si simple vous seriez inondé de produits de qualité.

J'ai donc pris le temps de tester plusieurs méthodes de développement et à chaque fois j'étais bloqué sur un point qui me semble essentiel, les performances de chargement, car réussir à générer ce formulaire personnalisé par visiteur et client tout en le présentant au maximum sur toutes les pages produits risquait de ralentir de manière importante l'affichage des pages produits, ce qui n'est pas acceptable dans le monde du ecommerce même en apportant une solution importante pour la communication avec les clients.

Donc tout mon effort fut porté sur la meilleure méthode à mettre en oeuvre pour générer le code le plus souvent à partir du cache mais sans jamais risquer que des données personnelles soient visibles par d'autres utilisateurs.

Comme mon module peut préremplir le formulaire à l'aide des données renseignées par les clients il faut que je puisse identifier chaque formulaire par client ainsi que par produit.

Cela augmente considérablement le nombre de fichiers cache générés pour ce simple formulaire puisqu'il faudra un cache par produit et par client, mais il sera toujours plus performant que l'ancienne méthode de génération à chaque clic sur le bouton.

Les bonus de cette nouvelle version

  • J'ai ajouté une case à cocher pour obliger à apporter son consentement à l'usage des données pour être recontacté, vous pouvez personnaliser à votre convenance ce message s'il ne vous convient pas.
  • J'ai ajouté un compteur de caractères coloré sur le message si vous avez décidé de limiter le nombre de caractères minimum.
  • Je permets maintenant de décider d'afficher ou non l'image du produit sur le formulaire.
  • Je désactive le bouton pour appeler le formulaire sur la fiche produit afin d'éviter l'envoie successif de messages après un message envoyé.
  • L'identification des champs obligatoire est meilleure avec un tooltip d'information.
  • Et vous pouvez choisir directement à partir de la configuration du module les dimensions de la fenêtre.

Galerie photos

Présentation vidéo

Conclusion

Il faut bien se l'avouer, cela reste le meilleur module de contact pour un site PrestaShop ou thritybees.

Simple, ne nécessitant aucune connaissance en développement, respectant tous les standards de développement, rapide et efficace.

Alors n'hésitez plus et passez tout de suite sur cette nouvelle version.

Disponibilité

Changelog

3.0.1 - 26/01/2021

  • Amélioration de la gestion du cache du module

3.0.0 - 24/01/2021

  • Refonte du code de la fancybox
  • Suppression de la possibilité de forcer Fancybox
  • Ajout du consentement du RGPD
  • Ajout d'une option permettant d'afficher ou de masquer l'image du produit dans le formulaire
  • Ajout d'un compteur de caractères sur le message si une limite est configurée dans le module
  • Désactiver le bouton de demande après l'envoi du formulaire
  • Ajout d'un message de remerciement sur le bouton lorsqu'il est désactivé après l'envoi du courriel
  • Ajout d'une option permettant de personnaliser les dimensions de la fenêtre d'affichage du formulaire

Discussions