How To Embed Bing Maps In Wordpress

Cómo integrar mapas de Bing en WordPress (paso a paso)

¿Quiere integrar Bing Maps en su sitio web de WordPress? Si está buscando una alternativa a Google Maps, Bing Maps es el candidato adecuado para usted. De manera similar a Google Maps, puede usar Bing Maps para mostrar direcciones, tráfico, direcciones de conducción e instrucciones de navegación en su sitio de WordPress. Dado que es propiedad de Microsoft, es una gran aplicación de mapas con una tonelada de datos útiles. En este artículo, le mostraremos cómo integrar fácilmente Bing Maps en WordPress, paso a paso.

Agregar mapas de Bing en WordPress (no se requiere complemento)

Lo primero que debe hacer es ir al sitio web de Bing Maps y encontrar la ubicación o el mapa que desea incrustar. Una vez que haya encontrado la ubicación, haga clic en la opción «Más» con el icono de tres puntos y seleccione la opción «Insertar mapa».

Incrustar Una Opción De Mapa En Bing Maps
Después de eso, se abrirá una nueva pestaña donde puede personalizar el mapa para incrustarlo en su sitio web.
Personalice Bing Map Para Integrarlo En El Sitio De Wordpress
Puede elegir el tamaño del mapa, el tipo de mapa (estático o arrastrable), el estilo del mapa (por carretera o aéreo) y los vínculos del mapa. Revise las opciones de personalización y luego haga clic en Generar código. Después de eso, le proporcionará un fragmento de código. Continúe y copie el código, ya que lo necesitará en el siguiente paso.
Insertar Código Generado Para Bing Maps
Ahora regrese a su sitio de WordPress y cree una nueva página o edite una página existente a la que desea agregar el mapa. En la pantalla de edición de página, haga clic en el icono Agregar nuevo bloque y seleccione el bloque HTML personalizado.
Agregue Un Bloque Html Personalizado En El Editor De Páginas De Wordpress
Después de eso, pegue el código de incrustación de Bing Map que copió anteriormente en el campo HTML.
Código De Incrustación De Bing Map Agregado En El Editor De Wordpress
Ahora puede guardar o publicar su página y hacer clic en el botón de vista previa para ver el mapa incrustado en su página. Así es como apareció el mapa de Bing en nuestro sitio de demostración.
Bing Map Integrado En Wordpress Manualmente - Vista Previa

Agregar mapas de Bing mediante un complemento

Si necesita insertar una sola tarjeta en su sitio web, el método manual indicado anteriormente es la mejor opción. Sin embargo, si está ejecutando un sitio web donde a menudo necesita agregar mapas, sería más fácil usar un complemento para agregar Bing Maps. Lo primero que debe hacer es instalar y activar el complemento Ultimate Maps by Supsystic. Para obtener instrucciones detalladas, puede ver nuestra guía paso a paso sobre cómo instalar un complemento de WordPress. Este es un complemento de mapa de WordPress gratuito que le permite incrustar mapas de Bing, mapas de folletos y otras alternativas de Google Maps en su blog de WordPress. Para utilizar este complemento con mapas de Bing, necesitará una clave de API de mapas de Bing. Simplemente cree una cuenta en el sitio web del Centro de desarrollo de Bing Maps. Si ya tiene una cuenta de Microsoft, simplemente puede iniciar sesión con las credenciales de su cuenta.
Conéctese Al Centro De Desarrollo De Bing
Una vez que haya iniciado sesión en su cuenta, debe hacer clic en el menú «Mi cuenta» y seleccionar la opción «Mis claves».
Opción Mis Claves En El Centro Para Desarrolladores De Bing Maps
En la siguiente pantalla, debe completar la información de su sitio web para crear una clave.
Cree Una Clave Api De Bing Map Para Integrarla En Wordpress
Después de eso, puede ver un mensaje de «Clave creada con éxito» y los detalles de la clave en un cuadro.
Se Creó La Clave De Api De Bing Maps
Simplemente puede hacer clic en el enlace «Copiar clave» o «Ver clave» y copiar la clave API de Bing Maps. Después de eso, debe pegar la clave en la configuración de su complemento. Visita Ultimate Maps de Supsystic »Configuración desde su panel de control y seleccione «Bing Microsoft» como motor de mapas. Después de eso, pegue la clave API que copió anteriormente en el campo de clave API de Bing Maps.
Pegue Su Clave Api De Bing Maps En La Configuración Del Complemento Ultimate Maps By Supsystic
No olvide guardar la configuración de su complemento. Después de eso, debe agregar categorías de etiquetas visitando Tarjetas Supsystic Ultimate »Categorías de marcadores» Agregar categoría.
Agregar Categorías De Etiquetas Para Bing Maps
Cree tantas categorías de marcadores como desee. Luego haga clic en el menú Agregar tarjeta para crear una nueva tarjeta. Ingrese un nombre para su mapa, establezca el ancho y alto del mapa, elija el modo de barra de navegación y más.
Agregar Un Mapa De Bing Usando Un Complemento
También puede configurar opciones para hacer que el mapa se pueda mover, usar doble clic para hacer zoom, etc. Lo más importante de todo es que ingrese la ubicación que se mostrará en el centro del mapa. Luego, desplácese hacia abajo y configure más opciones a continuación. Una vez hecho esto, haga clic en el botón «Guardar mapa» debajo del cuadro de vista previa del mapa. Después de eso, puede agregar marcadores para mostrar los puntos de ubicación principales en su mapa. Haz clic en la pestaña Marcadores y luego agrega un nombre para tu creador.
Agregar Un Nuevo Marcador Para Bing Map En Wordpress
Puede utilizar el nombre del lugar u organización como nombre de etiqueta. Por ejemplo, usamos “Universidad de Florida” como el nombre del marcador porque queremos mostrar algunas de las mejores universidades de Florida en nuestro mapa de demostración. Después de eso, puede agregar el texto de descripción del marcador, así como una imagen. Desplácese hacia abajo y elija un icono para su nuevo marcador. Luego, debe ingresar la dirección para señalar el marcador. Y también seleccione la categoría del marcador.
Guarde El Marcador Para Bing Maps
Revise todas las demás opciones, luego haga clic en el botón «Guardar marcador». Puede agregar más marcadores siguiendo los mismos pasos. A medida que agrega los marcadores, puede obtener una vista previa en vivo en el área de vista previa. Una vez que esté satisfecho con su tarjeta, navegue hasta la opción ‘Código corto de tarjeta’ en la parte superior y copie el código corto.
Copie El Código Corto De Bing Map Para Integrarlo En Wordpress
Después de eso, cree una nueva página o edite una página existente para incrustar su nuevo mapa de Bing. Una vez en el editor de página, haga clic en el icono Agregar un nuevo bloque y elija el bloque Shortcode en la sección Widgets.
Agregar Un Bloque De Código Corto En Wordpress
Ahora debe pegar el código corto del mapa de Bing que copió antes.
Pegue El Código Corto E Incruste La Tarjeta Bing En El Editor De Páginas De Wordpress
Cuando termine, guarde o publique su página y obtenga una vista previa de cómo se verá el mapa de Bing en su sitio web. Así es como apareció el mapa de Bing integrado en nuestro sitio web de demostración.
Bing Map Integrado En Wordpress Mediante Un Complemento
Esperamos que este artículo le haya ayudado a aprender cómo integrar fácilmente Bing Maps en WordPress. También puede consultar nuestra guía sobre cómo insertar tweets reales en publicaciones de blog de WordPress. Si le gustó este artículo, suscríbase a nuestro canal de YouTube para ver tutoriales en video de WordPress. También puede encontrarnos en Twitter y Facebook.

Leave a Reply