Google Maps Prestashop : 10 problemes et solutions 2025 !

tableau comparatif des 10 erreurs fréquentes liées à Google Maps dans PrestaShop

1. Pourquoi Google Maps ne s’affiche pas sur ma boutique PrestaShop ?

Le problème d’affichage de Google Maps sur PrestaShop est souvent lié à une clé API Google manquante, invalide ou mal configurée. Google Maps requiert une clé API activée avec la facturation Google Cloud, même pour une utilisation de base. Si ce paramètre est absent ou erroné, la carte ne se chargera tout simplement pas sur votre site.

Il faut vérifier que la clé API a bien été créée dans la console Google Cloud Platform, qu’elle inclut les bonnes autorisations (Maps JavaScript API, Places API…), et qu’elle est correctement intégrée dans le module ou le thème de PrestaShop. Un diagnostic via la console navigateur (F12) permet souvent d’identifier l’erreur.

2. Comment corriger l’erreur "For development purposes only" de Google Maps sur PrestaShop ?

Cette erreur signifie que votre clé API Google Maps n’a pas été liée à un compte de facturation actif sur Google Cloud. Même si Google offre un quota gratuit mensuel, il exige tout de même l’activation d’un moyen de paiement pour que les services fonctionnent pleinement.

Pour résoudre ce problème, connectez-vous à la console Google Cloud, accédez à votre projet, puis associez une carte bancaire à votre compte. Ensuite, activez la facturation pour le projet contenant votre clé API. Une fois cela fait, la mention "For development purposes only" disparaîtra, et votre carte s’affichera normalement sur votre site PrestaShop.

3. Pourquoi Google Maps fonctionne sur ordinateur mais pas sur mobile dans PrestaShop ?

Ce comportement est généralement causé par des problèmes de responsive design ou de chargement JavaScript différé sur les appareils mobiles. Si la carte est incluse dans un onglet ou une section masquée, elle peut ne pas se charger correctement lorsque la page s’affiche sur un smartphone ou une tablette.

Pour corriger cela, il faut s’assurer que le conteneur de la carte est visible au moment de son initialisation, ou déclencher un événement google.maps.event.trigger(map, 'resize') après le chargement complet du DOM. Une révision CSS pour forcer le redimensionnement et l’adaptabilité de la carte sur les petits écrans est aussi fortement recommandée.

4. Pourquoi la carte Google Maps ne recentre pas correctement après sélection d’un point relais sur PrestaShop ?

Le recentrage de la carte est essentiel pour l’expérience utilisateur. Sur certaines boutiques, après sélection d’un point relais, la carte ne se recentre pas sur le point choisi ou revient à un point de départ générique. Cela nuit à la clarté de l’interface.

Ce bug provient généralement d’un manque de mise à jour dynamique de la fonction de centrage de Google Maps. Pour le corriger, il faut implémenter une fonction JavaScript qui déclenche map.setCenter(marker.getPosition()) dès qu’un point est sélectionné. Cela permet de focaliser l’attention de l’utilisateur sur le bon endroit et d’optimiser la fluidité de navigation.

5. Pourquoi ma carte Google Maps reste blanche dans le module PrestaShop ?

Une carte blanche sans aucun contenu est un symptôme classique d’un chargement incomplet de l’API Google Maps. Cela peut être dû à un conflit JavaScript, un problème de CSS (hauteur à 0), ou un chargement trop tardif de l’API dans la page.

Pour résoudre cela, assurez-vous que le conteneur de la carte a bien une hauteur définie (min-height: 400px; par exemple), et que l’API Google Maps est bien appelée avant l’initialisation de la carte. Vérifiez également qu’aucun conflit avec d’autres bibliothèques JS (comme jQuery ou un autre module de carte) ne bloque le chargement.

6. Comment intégrer correctement Google Maps pour les boutiques physiques dans PrestaShop ?

Afficher la localisation de vos points de vente via Google Maps est un excellent moyen de rassurer et guider vos clients. Cependant, de nombreux utilisateurs rencontrent des problèmes lors de l’intégration, notamment à cause d’une API mal configurée ou d’un module de Store Locator obsolète.

La meilleure pratique consiste à utiliser un module certifié compatible avec PrestaShop et Google Maps, qui permet d’ajouter facilement les coordonnées GPS, les horaires d’ouverture et autres informations pertinentes. Veillez aussi à activer les bonnes API Google (Maps JavaScript, Places API, etc.) dans la console Google Cloud pour un fonctionnement optimal.

7. Pourquoi la carte Google Maps ne se recharge pas après un changement de déclinaison produit ?

Lorsque les déclinaisons d’un produit sont modifiées via AJAX, la carte Google Maps intégrée à la fiche produit peut disparaître ou ne pas se mettre à jour. Cela arrive car le contenu est rechargé sans que le script d’initialisation de la carte soit rappelé.

Il est indispensable d’ajouter un déclencheur JavaScript qui relance initMap() ou la fonction équivalente après chaque changement d’attribut. Cela garantit que la carte est toujours visible et correctement centrée, même si le DOM a été mis à jour dynamiquement. Ce genre de problème est courant dans les thèmes PrestaShop personnalisés.

8. Comment ajouter Google Maps dans une page CMS ou une page personnalisée de PrestaShop ?

Beaucoup de commerçants souhaitent intégrer une carte Google Maps dans une page CMS, comme une page "Contact" ou "Nos magasins". Malheureusement, PrestaShop ne propose pas d’outil natif pour le faire facilement via l’éditeur standard de contenu.

La solution consiste à insérer un code HTML personnalisé avec un iframe Google Maps ou via une API JavaScript. Pour plus de flexibilité, certains modules gratuits ou payants permettent de créer des cartes dynamiques avec des marqueurs multiples, le tout intégré proprement à votre thème. Assurez-vous toutefois que la clé API est bien fonctionnelle et active.

9. Pourquoi Google Maps ne charge aucun point relais dans le module de livraison PrestaShop ?

Ce problème survient souvent dans les modules de livraison utilisant Google Maps (GLS, Chronopost, Mondial Relay). Il peut être causé par une mauvaise configuration de la zone géographique, une clé API invalide ou un conflit avec une autre extension.

Pour résoudre cela, vérifiez d’abord que le code postal ou la ville saisi par l’utilisateur est bien reconnu par Google. Ensuite, examinez les logs JavaScript du navigateur pour voir si l’appel API retourne une erreur. Enfin, assurez-vous que le module est à jour et que les coordonnées des points relais sont bien communiquées par le transporteur.

10. Comment éviter les conflits entre plusieurs modules utilisant Google Maps dans PrestaShop ?

Il arrive que plusieurs modules tentent d’utiliser Google Maps en même temps (par exemple, un module de point relais et un store locator), ce qui peut entraîner des conflits JS ou une surcharge de l’API. Cela se manifeste souvent par une carte figée, des marqueurs non interactifs ou une absence totale d’affichage.

La solution consiste à s’assurer que chaque module utilise une instance propre de Google Maps et que les scripts sont appelés de manière conditionnelle (via if (typeof google !== 'undefined')). Il est aussi conseillé de regrouper les appels à l’API Maps via un seul chargement centralisé, pour éviter les appels redondants et les erreurs de doublon.