Comment insérer Google maps sur WordPress ?

Vous aimeriez montrer à vos visiteurs ou vous vous situez sur une carte, afficher un plan d’accès ou montrer une région. Rien de plus facile avec Google maps. Encore faut-il pouvoir l’installer sur son site ? ce qui n’est pas si simple que cela sous WordPress.
Ce petit tutoriel vous sera peut-être utile.

  • Récupérer le code

Pour installer Google maps rendez-vous tout d’abord sur Google maps 

google maps

  •  1- Indiquez la zone, la région, la ville que vous souhaitez afficher (ici la France, cocorico )
  • 2- Sélectionnez le type de carte que vous voulez (carte – earth – satellite)
  • 3- Cliquez sur l’icône représentant une chaîne, pour obtenir le lien à insérer.

Centrez correctement la carte avant d’obtenir le lien, s’est important pour voir ce que vous voulez afficher.

  •  Intégrer cette carte à votre site

– Copiez le code <iframe …> </iframe> et collez-le à l’endroit ou vous voulez l’afficher.

– Sous WordPress, n’oubliez pas d’être en mode HTML (Texte) avant de coller le code.


Problèmes rencontrés – Certains thèmes WordPress gèrent mal les iframes. Dans ce cas, il existe des plugins WordPress.

Allez dans votre zone administrateur WordPress : Extensions > ajouter

Tapez dans la zone de recherche iframe et lancez la recherche. Prenez le premier plugins, nommé iframe

Installez puis activez ce plugins.

Vous avez maintenant un plugins nommé iframe dans vos extensions. Le code à insérer dans vos article pour insérer une iframe est :
[iframe src= »http://lien » width= »550″ height= »550″]
Remplacez le lien http://…   par le lien obtenu sur google maps et le tour est joué.

Par exemple pour avoir la carte de France j’ai inséré le code suivant :

[iframe src= »http://maps.google.com/?ll=46.950262,2.329102&
spn=11.205371,19.753418&t=m&z=6&lci=weather » width= »550″ height= »550″]

la largeur est de 550 pixels (width=550 ) et la hauteur de 550 pixels aussi (height=550)
Ce qui donne :

[iframe src= »http://maps.google.com/?ll=46.950262,2.329102&
spn=11.205371,19.753418&t=m&z=6&lci=weather » width= »550″ height= »550″]

Si vous voulez centrer, vous pouvez utiliser les balises <center> et </center> comme indiqué dans cet article 

Voilà, est-ce que cet article vous a intéressé ? Est-ce qu’il vous apporte quelque chose ? Y a-t-il des sujets que vous aimeriez traiter ?

N’hésitez pas à commenter ou à me contacter.

A bientôt sur outils-web.fr

Les recherches qui vous ont mené ici

  • insérer code iframe google map dans joomla (1)
  • obtenir le lien google maps (1)
Ces articles pourraient vous intéresser :
2 Comments

Add a Comment

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

Lire plus :
post dater
Comment planifier vos publications d’articles sous WordPress ?

Vous publiez régulièrement sur votre blog Wordpress , mais voilà, vous avez aussi une vie à côté du blogging. Vous...

martine
Créer une couverture « Martine » en ligne.

Les passionnés des "Martine", cette bande dessinée pour enfant un peu datée, vont pouvoir s'amuser avec ce générateur de couverture...

police-de-caracteres
Comment insérer une police de caractère avec Google Fonts ?

Grâce à Google Web Fonts, il est possible d'utiliser un très grand nombre de polices de caractères sur blog. Certaines...

Fermer