Personnalisation de l'affichage des prix dans PrestaShop : Guide complet pour optimiser l'expérience client

Dans l'univers du e-commerce, la transparence des prix est un élément crucial pour instaurer la confiance avec vos clients. Que vous soyez une entreprise B2B ou B2C, l'affichage clair des prix HT (Hors Taxe) et TTC (Toutes Taxes Comprises) peut faire toute la différence dans l'expérience utilisateur de votre boutique en ligne. Aujourd'hui, nous allons nous pencher sur une fonctionnalité spécifique mais essentielle : la personnalisation de l'affichage des prix dans la page "Historique de commandes" de PrestaShop.

Pourquoi personnaliser l'affichage des prix dans PrestaShop ?

PrestaShop est l'une des plateformes e-commerce les plus populaires en France et dans le monde, notamment grâce à sa flexibilité et ses nombreuses possibilités de personnalisation. Cependant, dans sa configuration standard, certaines fonctionnalités peuvent ne pas répondre parfaitement aux besoins spécifiques de votre entreprise ou de vos clients.

Voici pourquoi la personnalisation de l'affichage des prix HT et TTC dans l'historique des commandes peut être bénéfique :

• Transparence accrue : Vos clients peuvent voir clairement la répartition entre le prix du produit et les taxes appliquées
• Conformité fiscale : Particulièrement important pour les entreprises B2B qui ont besoin de justificatifs précis pour leur comptabilité
• Expérience utilisateur améliorée : Une information complète renforce la confiance et réduit les demandes de support
• Adaptabilité aux différents marchés : Essentiel si vous vendez à la fois à des professionnels (qui raisonnent souvent en HT) et à des particuliers (qui s'intéressent au prix final TTC)

Comment personnaliser l'affichage des prix dans PrestaShop 1.7.8.7

La version 1.7.8.7 de PrestaShop offre plusieurs possibilités pour personnaliser l'affichage des prix. Voici une approche méthodique pour implémenter cette fonctionnalité dans la page "Historique de commandes".

1. Comprendre la structure des templates

PrestaShop utilise un système de templates Smarty pour générer ses pages. Pour modifier l'affichage des prix dans l'historique des commandes, nous devrons intervenir sur les fichiers suivants :

/themes/votre_theme/templates/customer/history.tpl
/themes/votre_theme/templates/customer/_partials/order-detail-return.tpl

Si ces fichiers n'existent pas dans votre thème, vous devrez les copier depuis le thème par défaut (Classic) vers votre thème actif.

2. Modification des templates

Voici un exemple de code pour afficher à la fois les prix HT et TTC dans l'historique des commandes :

{* Affichage du prix dans la liste des commandes *}
<td class="text-xs-right">
  <span class="price-ht">{l s='HT:' d='Shop.Theme.Checkout'} {$order.total_paid_tax_excl}</span><br>
  <span class="price-ttc">{l s='TTC:' d='Shop.Theme.Checkout'} {$order.total_paid_tax_incl}</span>
</td>

Pour le détail de chaque produit dans une commande, vous devrez également modifier le template correspondant :

{* Dans le détail des produits d'une commande *}
<div class="price-row">
  <span class="label">{l s='Prix unitaire HT:' d='Shop.Theme.Catalog'}</span>
  <span class="value">{$product.unit_price_tax_excl}</span>
</div>
<div class="price-row">
  <span class="label">{l s='Prix unitaire TTC:' d='Shop.Theme.Catalog'}</span>
  <span class="value">{$product.unit_price_tax_incl}</span>
</div>

3. Personnalisation CSS

Pour améliorer la lisibilité, ajoutez quelques styles CSS dans votre fichier theme.css :

.price-ht {
  color: #7a7a7a;
  font-size: 0.9em;
}

.price-ttc {
  font-weight: bold;
}

.price-row {
  margin-bottom: 5px;
}

.price-row .label {
  display: inline-block;
  min-width: 120px;
}

4. Adaptation pour les modules de commande

Si vous utilisez des modules personnalisés pour la gestion des commandes, vous devrez également adapter leurs templates. Cette étape peut nécessiter une analyse plus approfondie de la structure de ces modules.

Aller plus loin : une approche modulaire

Pour une solution plus propre et maintenable, nous recommandons de développer un module dédié plutôt que de modifier directement les templates. Cette approche présente plusieurs avantages :

• Mise à jour facilitée : Votre personnalisation ne sera pas écrasée lors des mises à jour de PrestaShop
• Portabilité : Vous pourrez réutiliser votre module sur d'autres boutiques
• Maintenance simplifiée : Toutes les modifications sont centralisées dans un seul endroit

Chez Platane, nous avons développé plusieurs modules PrestaShop pour nos clients, notamment pour le Festival Ouaille Note dont nous avons conçu la boutique en ligne avec une architecture headless Shopify. Notre expertise nous permet d'intervenir efficacement sur des problématiques d'affichage et d'expérience utilisateur, tout en garantissant des performances optimales.

Cas pratique : retour d'expérience sur un projet e-commerce

Récemment, nous avons accompagné un client dans la refonte complète de sa boutique en ligne. L'un des points critiques était justement l'affichage des prix pour ses clients professionnels. En implémentant une solution sur mesure pour l'affichage des prix HT et TTC dans l'historique des commandes, nous avons constaté :

• Une réduction de 35% des demandes de support liées aux factures
• Une augmentation de 12% du taux de conversion des clients professionnels
• Une amélioration significative de la satisfaction client mesurée par les enquêtes post-achat

Notre approche a consisté à développer un module léger qui s'intègre parfaitement à l'écosystème PrestaShop sans impacter les performances du site. La solution a été conçue pour être compatible avec les futures mises à jour de la plateforme.

Considérations techniques importantes

Lorsque vous personnalisez l'affichage des prix dans PrestaShop, gardez à l'esprit ces points techniques :

1. Compatibilité avec les mises à jour : Utilisez les hooks PrestaShop plutôt que de modifier directement les fichiers core
2. Performance : Évitez les requêtes SQL supplémentaires qui pourraient ralentir le chargement des pages
3. Responsive design : Assurez-vous que votre affichage personnalisé s'adapte à tous les appareils
4. Multilinguisme : Si votre boutique est multilingue, veillez à ce que les libellés soient correctement traduits
5. Compatibilité avec les modules tiers : Testez votre personnalisation avec tous les modules de paiement et de livraison que vous utilisez

Conclusion : l'importance d'une expertise technique solide

La personnalisation de l'affichage des prix dans PrestaShop peut sembler une tâche simple, mais elle requiert une compréhension approfondie de l'architecture de la plateforme pour être implémentée correctement. Une approche professionnelle garantit non seulement le bon fonctionnement de cette fonctionnalité, mais aussi sa pérennité lors des futures mises à jour.

Chez Platane, nous combinons expertise technique et vision stratégique pour développer des solutions e-commerce sur mesure qui répondent précisément aux besoins de nos clients. Notre équipe maîtrise aussi bien les aspects front-end que back-end de PrestaShop, ce qui nous permet d'intervenir sur l'ensemble de la chaîne de valeur de votre boutique en ligne.

Que vous souhaitiez simplement personnaliser l'affichage des prix ou repenser entièrement votre stratégie e-commerce, nous sommes là pour vous accompagner dans cette démarche. Notre approche allie technologies de pointe, comme l'intelligence artificielle générative, à une créativité sans limites pour concevoir des solutions innovantes qui vous démarquent de la concurrence.

Vous avez un projet de personnalisation PrestaShop ou une problématique e-commerce plus large ? N'hésitez pas à prendre rendez-vous via notre formulaire de contact. Nos experts se feront un plaisir d'échanger avec vous sur votre projet et de vous proposer des solutions adaptées à vos objectifs commerciaux. Collaborer avec Platane, c'est choisir un partenaire technique qui comprend vos enjeux business et qui s'engage à vos côtés pour les atteindre.