Intégrer Google Map dans Wordpress sans utiliser iframe ou plugin?

Question

Je voudrais intégrer une carte Google dans un post WordPress mais sans en utilisant un iframe ou un plugin.

J'ai essayé d'utiliser le code HTML suivant dans le message:

<div id="map_canvas" style="border: 1px solid black;" width="100%" height="500px"></div> 

Mais cela me donne une carte de hauteur nulle. Je voudrais utiliser une carte de pourcentage-largeur comme j'utilise un thème enfant TwentyEleven, donc le site est réactif.

Quelqu'un peut-il suggérer comment je dois style map_canvas de sorte qu'il ne s'effondre pas?

Merci.

Answer 1

Fondamentalement, cela ne fonctionnera pas. Wordpress supprimera le code lors du passage de html à visuel. Cela ne fonctionnera que si vous quittez la vue "html" tout en modifiant un post avec le code gmap. Je recommande fortement d'utiliser un plug-in, comme celui-ci:

http://wordpress.org/extend/plugins/google-maps-v3-shortcode/

Answer 2

Si vous êtes prêt à utiliser Google Maps avec le code iframe embed, vous pouvez utiliser un plugin que j'ai écrit appelé FitMaps. Il rend un iframe de Google Maps réactif, et est basé sur le plugin FitVids pour les vidéos embarquées responsive.

Le plugin Fitmaps encapsule toutes les iframes de Google Maps dans un élément div et fait que l'iframe occupe 100% de la largeur et de la hauteur de ce div. Le div d'emballage est alors facilement rendu sensible avec css.

Voir: http://www.waywayway.nl/bin/handig-en-leuk/tutorials/responsive-google-maps-embeds/

Answer 3

Vous pouvez arrêter le code de mutiler 'Wordpress en faisant un peu de traitement. Je mets que pour un mini plugin ici http://llocally.com/wordpress-plugins/?did=2

Aussi, si vous voulez utiliser MapQuest plutôt que des cartes Google il y a un plugin ici http://wordpress.org/extend/plugins/get-directions/