![\"Error](\"https:\/\/www.host-fusion.com\/blog\/wp-content\/uploads\/2016\/07\/googlemapapi.jpg\")
<\/p>\n<\/p>\n
Nos encanta cuando un cliente nos trae un problema y adem\u00e1s la soluci\u00f3n para que la compartamos con todos, en este caso Inma de MRinform\u00e1tica Marbella<\/strong>, nos inform\u00f3 de un error al intentar integrar\u00a0un mapa de Google Maps<\/strong> para una web corporativa creada con WordPress<\/strong>, lo t\u00edpico para que el visitante tenga interactuaci\u00f3n y geolocalizaci\u00f3n de esa empresa.<\/p>\n El caso es que al integrar el\u00a0mapa, este lejos de mostrarse, lo que muestra es un error con un mensaje \u00abThis page not load Google Maps correctly, see the javascript console for technical details\u00bb.<\/p>\n Manos a la obra abr\u00ed el inspector de elemento para ver la informaci\u00f3n de la consola de Javascript y ver un par de mensajes de error haciendo referencia a que el mapa no se cargaba porque no hab\u00eda un API KEY<\/strong> activa.<\/p>\n Esto es porque Google desde el 22 de Junio<\/strong> pone unas limitaciones para el uso de mapas en sitios webs y aplicaciones, si ten\u00edas el mapa integrado antes del 22 de junio, Google ha tenido la deferencia de seguir permiti\u00e9ndolo sin necesidad de generar un API KEY<\/strong> para ello, pero si para los nuevos a partir de esta fecha.<\/p>\n Problemas y Soluciones<\/strong>:<\/p>\n Nos encontramos con dos problemas, el primero generar esa API KEY e integrarla en nuestra web, la API KEY la podemos generar sin problemas en el siguiente link API de Google Maps<\/a>\u00a0.\u00a0<\/strong>Seguimos los pasos indicados en la interfaz y obtendremos nuestra API KEY, para ello tendremos que autorizar esa API KEY para nuestro sitio web, recordad que esta API KEY solo es valida para ese sitio, si necesitamos integrar otro mapa en otra web tendremos que repetir el proceso.<\/p>\n Una vez hemos seguido todos los pasos para generar, autorizar y obtener nuestra API KEY el siguiente paso es integrarlo, que ocurre, que muchos trabajan con builders o plugins que a base de un par de clics y unos par\u00e1metros de geolocalizaci\u00f3n integran el mapa pero no tienen un campo donde insertar la\u00a0API KEY, como es algo bastante reciente muchos desarrolladores\u00a0no han realizado las actualizaciones a esta nueva directriz de Google y no queda mas remedio que insertar el c\u00f3digo a \u00abcap\u00f3n\u00bb.<\/p>\n En la propia interfaz de Google Maps nos indica el c\u00f3digo que tenemos que utilizar y en funci\u00f3n de la aplicaci\u00f3n.<\/p>\n Importante que cambiemos YOUR API KEY por la que hemos generado y autorizado para nuestra web en Google Maps, de otra forma no funcionar\u00e1, si te manejas un poco con el c\u00f3digo no ser\u00e1 muy complicado a\u00f1adir estas lineas de c\u00f3digo\u00a0con tu API KEY, localiza con la pesta\u00f1a HTML el c\u00f3digo insertado por tu builder o plugin, normalmente entre etiquetas iframe y a\u00f1ade tu linea de c\u00f3digo con tu API KEY, si todo ha ido correcto tu mapa se ver\u00e1 correctamente ya que est\u00e1 autorizado.<\/p>\n Si no te apa\u00f1as con c\u00f3digo no te queda mas remedio que recurrir al desarrollador del builder o plugin para que incluya en su pr\u00f3xima distro un campo para a\u00f1adir el API KEY y esta se integre con el c\u00f3digo o tirar de un programador para que te a\u00f1ada esas l\u00edneas necesarias para el correcto funcionamiento de tu mapa.<\/p>\n Nos encanta cuando un cliente nos trae un problema y adem\u00e1s la soluci\u00f3n para que la compartamos con todos, en este caso Inma de MRinform\u00e1tica Marbella, nos inform\u00f3 de un error al intentar integrar\u00a0un mapa de Google Maps para una web corporativa creada con WordPress, lo t\u00edpico para que el visitante tenga interactuaci\u00f3n y geolocalizaci\u00f3n […]<\/p>\n","protected":false},"author":4,"featured_media":7986,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[47,751,376],"tags":[1169],"class_list":["post-7985","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-google","category-hosting-wordpress-2","category-wordpress","tag-error-de-google-maps-api-en-wordpress"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/www.host-fusion.com\/blog\/wp-json\/wp\/v2\/posts\/7985","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.host-fusion.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.host-fusion.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.host-fusion.com\/blog\/wp-json\/wp\/v2\/users\/4"}],"replies":[{"embeddable":true,"href":"https:\/\/www.host-fusion.com\/blog\/wp-json\/wp\/v2\/comments?post=7985"}],"version-history":[{"count":0,"href":"https:\/\/www.host-fusion.com\/blog\/wp-json\/wp\/v2\/posts\/7985\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.host-fusion.com\/blog\/wp-json\/wp\/v2\/media\/7986"}],"wp:attachment":[{"href":"https:\/\/www.host-fusion.com\/blog\/wp-json\/wp\/v2\/media?parent=7985"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.host-fusion.com\/blog\/wp-json\/wp\/v2\/categories?post=7985"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.host-fusion.com\/blog\/wp-json\/wp\/v2\/tags?post=7985"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}![\"API](\"https:\/\/www.host-fusion.com\/blog\/wp-content\/uploads\/2016\/07\/Captura-de-pantalla-2016-07-01-a-las-11.15.14.png\")
<\/p>\n![\"Hosting](\"https:\/\/www.host-fusion.com\/blog\/wp-content\/uploads\/2016\/10\/hostingwp.jpg\")
<\/a>Host-Fusion<\/strong> te ofrece Planes de Hosting para WordPress<\/strong><\/a> con SSD<\/strong> + SSL<\/strong> +Backups<\/strong> Configurables + CDN<\/strong> + 15% descuento<\/strong> en hosting utilizando este c\u00f3digo HFXTRA<\/strong> y registro<\/strong> y transferencia<\/strong> de dominio Gratis<\/strong>.<\/p>\n","protected":false},"excerpt":{"rendered":"