Accueil » Divi » Changement d’icone dans une carte Google map avec le thème Divi

Régulièrement pour le site Internet de mes clients, je personnalise l’icone indiquant l’emplacement de leur entreprise sur une carte Google map. La manip est relativement simple à implémenter et j’aimerai la partager avec vous :).

Vous pouvez voir un exemple concret ici (ouverture dans une nouvelle fenêtre).

Pour cela, il existe 2 solutions :

  1. la plus simple, comme vous vous servez du thème Divi, est de remplacer l’icone « marker.png » que vous trouverez dans le dossier « Divi » -> « includes » -> « builder » -> « images » par la votre.
  2. la plus « compliquée » mais que, pour ma part, je trouve plus propre, est d’éditer le fichier .htaccess qui se trouve (normalement) à la racine de votre site internet.

Localisez la balise que WordPress à créé lors de son installation et qui commence par « # BEGIN WordPress » :

Cela devrait se présenter comme ceci pour une installation « standard » :

# BEGIN WordPress
<IfModule mod_rewrite.c>
 RewriteEngine On
 RewriteBase /
 RewriteRule ^index\.php$ - [L]
 RewriteCond %{REQUEST_FILENAME} !-f
 RewriteCond %{REQUEST_FILENAME} !-d
 RewriteRule . /index.php [L]
 #changement de l'icone du marker de Google maps :)...
 RewriteRule ^wp-content/themes/Divi/includes/builder/images/marker.png$ /wp-content/themes/tips/images/Tips.png [L]
</IfModule>
# END WordPress

Vous aurez noté la présence de la dernière ligne qui demande que toutes les requêtes des navigateurs demandant une url pointant vers le fichier « marker.png » soit redirigées vers  » /wp-content/themes/tips/images/Tips.png ».

A vous de remplacer cette URL par la vôtre et d’afficher ainsi l’icône que vous souhaitez 🙂 !

Petite info importante pour ceux qui utilisent un CDN local comme expliqué ici, le fichier .htaccess que vous devrez modifier sera celui qui se trouve dans le dossier wp-content. Dans ce cas il faudra ajouter à la fin de celui-ci le code suivant :

<IfModule mod_rewrite.c>
RewriteEngine On
#changement de l'icone du marker de Google maps :)...
RewriteRule ^themes/Divi/includes/builder/images/marker.png$ /themes/tips/images/Tips.png [L]
</IfModule>

Vous aurez noté que les références au dossier « wp-content » ont disparu puisque notre CDN local fait pointer notre sous-domaine vers ce même dossier :).

 

Information : Véritablement conquis par ce thème, je me suis inscrit sur le site de ElegantThemes en tant qu'affilié, ce qui signifie que si vous cliquez sur le lien ci-dessous et achetez le thème, je recevrai une commission :).

Information: Truly conquered by this theme, I registered on the site of ElegantThemes as an affiliate, which means that if you click on the link below and buy the theme I will receive a commission :).

 

Après avoir visité les coulisses, découvrez le site :) !

2 Commentaires

  1. Ijahseb

    Bonjour,
    Merci pour cette petite astuce.
    Je cherche à pouvoir intégrer différents marqueurs personnalisés sur une même carte…
    Vous n’auriez pas une solution ?
    Merci,

    Réponse
    • Pierre

      Bonjour Ijahseb 🙂 !

      Il est impossible en l’état actuel de faire ce que tu souhaites. Du moins pas sans l’utilisation d’un plugin. Je te suggère le plugin « Map Extended Module » (https://diviwebdesign.com/store/divi-custom-modules/map-extended-module/) qui, pour 8 €, remplira parfaitement la fonction que tu décris ;).
      Passe une belle soirée 😀 !

      Amicalement,

      Pierre.

      Réponse

Poster le commentaire

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

Accueil » Divi » Changement d’icone dans une carte Google map avec le thème Divi