Intégrer un localisateur de coordonnée (google map)

[Eleneby]

Bonjour à tous,

Comment pouvons-nous intégrer une sorte de Google Map sur son site sur la page produit afin que les clients puisse chercher une localisation précise un peu comme sur le site suivant : https://ourcuffs.com/collections/all/products/custom-coordinates-cuff-2

Merci par avance de votre réponse ! 

Bonne journée

[Armelle · Accepted solution]

Bonjour @Eleneby !

Avez-vous plusieurs emplacements que vous souhaiteriez montrer dans la map? Et recherchez-vous une apparence avancée semblable à cet exemple? Si vous répondez oui à ces deux questions, vous voudrez lire la première solution. Si, au contraire, vous n'avez qu'un emplacement à montrer et que vous souhaitez une addition simple et gratuite de la map, à la page des produits, lisez ma deuxième solution. 

Solution 1 - L'installation d'une application

En effet, il y a des applications qui vous permettront de montrer une carte interactive avec plusieurs de vos emplacements à la fois. J'ai fait quelques recherches, dans notre App Store, pour vous lister celles qui semblent les plus convenables pour vous. Les voici ci-bas. 

• Closeby ‑ Store Locator - forfait gratuit disponible, mais jusqu'à 5 emplacements (sinon $19 USD/mois)
• Waze/Google Maps Store Locator - gratuit
• ProMap ‑ Store Locator - forfait gratuit disponible pour un emplacement (sinon à partir de $9.99 USD/mois)

Certaines de ces applications offrent un essai gratuit donc, profitez-en pour déterminer celle qui vous plaît. N'oubliez simplement pas de supprimer les applications que vous n'utilisez pas avant la fin de leur essai gratuit pour éviter les frais d'applications récurrents. De plus, dans les liens présentés, ci-haut, vous trouverez une section ''Assistance'' où se trouvent les liens de contact de l'équipe d'assistance de chaque application. Comme ce sont des applications tierces, il est important de communiquer avec leur équipe pour toute question en lien direct avec leur service.

Solution 2 - Ajouter le lien embed de votre adresse Google Maps

Cette deuxième solution est très pratique si vous voulez éviter l'utilisation excessive d'applications qui peuvent ralentir votre site Web, si vous ne trouvez pas d'applications qui vous conviennent et/ou si vous recherchez un moyen rapide d'ajouter une carte Google Map pour montrer une seule adresse. Voici les instructions à suivre. 

1. Allez sur Google Maps et entrez votre adresse. 

2. Cliquez sur le bouton Share à gauche, en dessous de votre adresse. 

3. À la boîte d'apparition, cliquez sur Embed a map. 

4. Cliquez sur Copy HTML pour copier le code embed de votre map. 

5. Rendez-vous à votre interface d'administrateur Shopify et cliquez sur Produits > Le produit de votre choix. Dans la boîte de description du produit, cliquez ensuite sur le bouton </>. Le texte de votre description aura une allure d'un code HTML. Collez le code HTML de la map dans la boîte de description (préférablement à la fin du code déjà présent pour simplifier les choses) et enregistrez le tout.

6. Vérifiez le résultat dans votre boutique et répétez le tout pour vos autres produits. 

Voici le résultat dans ma boutique test.

Bien sûr, cette idée est pratique si vous n'avez pas beaucoup de produits dans votre boutique. Sinon, la première solution serait à considérer. Je vois définitivement l'avantage à intégrer une map plus facilement dans la page de produit, via l'admin Shopify et non par une application tierce. C'est une suggestion que je peux partager à nos développeurs pour l'amélioration de nos services dans le futur. Ceci reste une considération qu'ils prendront sans en être une garantie de réalisation de cet ajout pour autant. 

Sinon, travaillez-vous encore sur votre boutique où est-ce qu'elle est déjà lancée au public? Comment va votre business pour l'instant?

[Eleneby]

Bonjour Armelle je vous remercie de m'avoir répondu. Ce que je cherchais ressemble à ce que vous verrez dans la capture d'écran ci-dessous. Ce "localisateur" me permettrait de récolter une position via la longitude et la latitude comme sur Google map. Cette démarche de récolte de localisation rentre dans un but de personnalisation de produit.