Trusted WordPress tutorials, when you need them most.
Beginner’s Guide to WordPress
Copa WPB
25 Million+
Websites using our plugins
16+
Years of WordPress experience
3000+
WordPress tutorials
by experts

Como incorporar o Bing Maps no WordPress (passo a passo)

Nota editorial: Ganhamos uma comissão de links de parceiros no WPBeginner. As comissões não afetam as opiniões ou avaliações de nossos editores. Saiba mais sobre Processo editorial.

Você deseja incorporar o Bing Maps no WordPress?

Você pode usar o Bing Maps para mostrar direções, tráfego, rotas e instruções de navegação em seu site WordPress. Se você não quiser usar o Google Maps, o Bing é um ótimo aplicativo de mapas alternativo com muitos dados úteis.

Neste artigo, mostraremos a você como incorporar facilmente o Bing Maps no WordPress, passo a passo.

How to embed Bing Maps in WordPress

Por que adicionar o Bing Maps no WordPress (e não o Google Maps)?

Se você tem uma loja, um restaurante, um salão de beleza, uma atração turística ou outro negócio físico, adicionar o Bing Maps ao seu site facilitará a localização dos clientes.

An example of an embedded Bing map

Os clientes em potencial também podem obter instruções de como chegar à sua empresa e compartilhar facilmente sua localização com amigos e familiares. Além disso, a incorporação do Bings Maps pode melhorar o SEO do WordPress e tornar seu site mais visível nas pesquisas locais.

Quando se trata de adicionar um mapa ao WordPress, o Google Maps pode parecer a escolha óbvia, especialmente porque ele oferece um localizador de lojas do Google Maps.

Entretanto, nos últimos anos, o Bing Maps se tornou mais popular e ambos os serviços oferecem recursos, cobertura de área e dados ligeiramente diferentes. Em particular, muitas pessoas acreditam que o Google Maps superestima o tempo necessário para chegar ao seu destino.

Se você não estiver satisfeito com o Google Maps ou simplesmente preferir a Microsoft ao Google, o Bing Maps é uma ótima alternativa.

Dito isso, vamos ver como você pode adicionar o Bing Maps ao seu site WordPress. Basta usar os links rápidos abaixo para ir direto ao método que você deseja usar:

Método 1: Adicionar o Bing Maps no WordPress (melhor para mapas únicos)

Muitos proprietários de empresas querem simplesmente adicionar um mapa ao formulário de contato ou à página Sobre nós. Se você quiser adicionar apenas um mapa ao seu site, poderá usar um código incorporado.

Basta acessar o Bing Maps e pesquisar o local ou o mapa que você deseja usar. Depois de encontrar o local correto, clique no ícone de três pontos e selecione “Incorporar um mapa”.

Embed a Map option in Bing Maps

O Bing abrirá uma nova guia na qual você poderá personalizar o mapa alterando seu tamanho, tipo de mapa (estático ou arrastável), estilo de mapa (rodoviário ou aéreo) e muito mais.

À medida que você fizer alterações, a visualização será atualizada automaticamente, para que você possa experimentar configurações diferentes e ver qual é a melhor.

Customize Bing Map to Embed in WordPress site

Quando você estiver satisfeito com a configuração do mapa, clique no botão “Generate Code” (Gerar código).

O Bing Maps mostrará um trecho de código. Vá em frente e copie o código, pois você precisará dele na próxima etapa.

generated Embed Code for Bing Maps

Agora, volte ao site do WordPress e abra o post ou a página em que deseja adicionar o mapa.

Em seguida, clique no ícone “+” e comece a digitar “HTML personalizado”.

Embedding a Bing map using a custom HTML block

Quando o bloco certo aparecer, basta clicar para adicioná-lo à página.

Depois de fazer isso, basta colar o código incorporado no bloco HTML personalizado.

Bing Map Embed Code Added in WordPress Editor

Agora você pode clicar no botão “Update” (Atualizar) ou “Publish” (Publicar) para tornar o mapa ativo em sua loja on-line ou site.

Método 2: Adicionar o Bing Maps usando um plug-in (melhor para incorporar vários mapas)

Se você só precisa adicionar um mapa, o código incorporado é uma boa solução. No entanto, esse método pode exigir muito tempo e esforço se você precisar adicionar vários Bing Maps.

Por exemplo, se você administra um diretório de empresas, talvez seja necessário adicionar um mapa a cada página. Nesse caso, recomendamos o uso do Ultimate Maps da Supsystic, pois ele facilita a incorporação de mapas do Bing, mapas do Leaflet e outras alternativas do Google Maps.

A primeira coisa que você precisa fazer é instalar e ativar o plug-in Ultimate Maps by Supsystic. Para obter instruções detalhadas, consulte nosso guia passo a passo sobre como instalar um plug-in do WordPress.

Para usar esse plug-in com o Bing Maps, você precisará de uma chave de API do Bing Map.

Para obter essa chave, basta criar uma conta no Bing Maps Dev Center. Se você já tiver uma conta da Microsoft, poderá entrar com suas informações de login da Microsoft.

Sign in to Bing Dev Center

Depois de fazer login na sua conta, clique no menu “My Account” (Minha conta).

Em seguida, selecione “My Keys” (Minhas chaves).

Bing Maps Dev Center My keys Option

Na próxima tela, você precisa preencher as informações do seu blog ou site WordPress.

Em seguida, clique em “Create” (Criar).

Create Bing Map API key to Embed in WordPress

Após alguns instantes, você verá a mensagem “Key created successfully” (Chave criada com sucesso).

Agora você pode clicar em “Show key” (Mostrar chave) e copiar a chave da API do Bing Maps ou simplesmente clicar no link “Copy key” (Copiar chave).

Bing Maps API Key Created

A próxima etapa é colar a chave nas configurações do plug-in.

No painel do WordPress, você precisa ir para Ultimate Maps by Supsystic ” Settings. Em seguida, abra o menu suspenso “Mecanismo de mapas” e escolha “Bing Microsoft”.

How to add a Bing Map to your WordPress website

Agora você pode prosseguir e colar a chave de API no campo “Bing Maps API Key”.

Feito isso, não se esqueça de clicar no botão “Save” (Salvar).

Adding a Bing Map API key to your WordPress website

Depois disso, talvez você queira adicionar categorias de marcadores. Semelhante às categorias e tags no WordPress, elas podem ajudar a organizar os pontos de interesse em seu mapa.

Por exemplo, se você estiver criando um mapa para turistas, poderá criar categorias como “Acomodação”, “Restaurantes” e “Atrações”.

Para criar uma categoria, basta selecionar a guia “Marker Categories” (Categorias de marcadores) e clicar em “Add Category” (Adicionar categoria).

Adding marker categories in WordPress

Agora você pode adicionar um título, alterar o plano de fundo e a cor do texto e atribuir categorias secundárias a categorias principais.

Quando estiver satisfeito com as informações inseridas, clique em “Save” (Salvar).

Adding Bing marker categories to a WordPress website

Para criar mais categorias, basta clicar no botão “Add Category” (Adicionar categoria).

Feito isso, clique na guia “Add Map” (Adicionar mapa). Agora você pode digitar um nome para o mapa, definir sua largura e altura, escolher um modo de barra de navegação e muito mais.

Add Bing map using a plugin

Você também pode configurar opções para tornar o Bing Map arrastável, usar o clique duplo para ampliar e muito mais.

O mais importante de tudo é que, em “Map Center”, digite o local que você deseja mostrar. Você pode digitar o endereço ou os valores de longitude e latitude.

Choosing a location for a Bing map

Há muitas configurações nessa página, portanto, vale a pena examinar todas as opções e fazer as alterações necessárias.

Quando você estiver satisfeito com a configuração do mapa, basta clicar em ‘Save Map’ (Salvar mapa).

Saving a custom Bing map

Depois disso, talvez você queira destacar um ou mais locais no mapa usando marcadores.

Para começar, clique na guia Marcadores e digite um nome para o marcador. Normalmente, você desejará usar o nome do local ou da organização, mas pode digitar qualquer nome que desejar.

Add new Marker for Bing Map in WordPress

Depois disso, você pode adicionar texto e imagens à descrição do marcador. Você também pode escolher um ícone para o marcador.

Feito isso, você precisa inserir um endereço para o marcador e selecionar uma categoria de marcador.

Adding markers to a Bing map in WordPress

Quando estiver satisfeito com a configuração, clique em “Save Marker” (Salvar marcador).

Para adicionar mais marcadores, basta seguir o mesmo processo descrito acima.

Save Marker for Bing Maps

À medida que você adicionar marcadores, a visualização do mapa será atualizada automaticamente.

Quando terminar de personalizar o mapa, copie o shortcode ao lado de “Map shortcode”.

Copy Bing Map Shortcode to embed in WordPress

Se você não vir um shortcode, certifique-se de que salvou o mapa.

Agora você pode abrir a página ou o post em que deseja incorporar o Bing Map. Basta clicar no ícone “Add New Block ‘+'” e digitar “Shortcode”.

Adding a shortcode in WordPress

Quando o bloco certo for exibido, clique nele para adicioná-lo à página.

Agora, basta colar o shortcode do Bing Map no bloco.

Paste BIng Map Embed Shortcode in WordPress Page Editor

Para tornar o mapa ativo, clique no botão “Atualizar” ou “Publicar”. Agora, se você visitar seu site, verá o mapa do Bing em ação.

Esperamos que este artigo tenha ajudado você a aprender como incorporar o Bing Maps no WordPress facilmente. Talvez você também queira ver nosso guia sobre como criar um pop-up do WooCommerce para aumentar as vendas ou nossa escolha especializada do melhor software de bate-papo ao vivo para pequenas empresas.

Se você gostou deste artigo, inscreva-se em nosso canal do YouTube para receber tutoriais em vídeo sobre o WordPress. Você também pode nos encontrar no Twitter e no Facebook.

Divulgação: Nosso conteúdo é apoiado pelo leitor. Isso significa que, se você clicar em alguns de nossos links, poderemos receber uma comissão. Veja como o WPBeginner é financiado, por que isso é importante e como você pode nos apoiar. Aqui está nosso processo editorial.

Avatar

Editorial Staff at WPBeginner is a team of WordPress experts led by Syed Balkhi with over 16 years of experience in WordPress, Web Hosting, eCommerce, SEO, and Marketing. Started in 2009, WPBeginner is now the largest free WordPress resource site in the industry and is often referred to as the Wikipedia for WordPress.

O kit de ferramentas definitivo WordPress

Obtenha acesso GRATUITO ao nosso kit de ferramentas - uma coleção de produtos e recursos relacionados ao WordPress que todo profissional deve ter!

Reader Interactions

7 ComentáriosDeixe uma resposta

  1. Syed Balkhi says

    Hey WPBeginner readers,
    Did you know you can win exciting prizes by commenting on WPBeginner?
    Every month, our top blog commenters will win HUGE rewards, including premium WordPress plugin licenses and cash prizes.
    You can get more details about the contest from here.
    Start sharing your thoughts below to stand a chance to win!

  2. Jiří Vaněk says

    Thanks for the practical guide. So far I only had experience with google maps. I will definitely try to integrate BING maps as well, in order to test their functions and possibly also the loading speed.

  3. Jiří Vaněk says

    Thanks for the tip, I actually never thought of using maps other than Google. But I’m all about speed. Google Maps slows down page loading a lot. Are Bing and Microsoft better off?

  4. GODZILLA491 says

    I don’t know why but it doesn’t work.
    I found your tutorial after several minutes spent doing the same things you do but all i had is a blank post.

    With google it works, but i need to use bing maps.

Deixe uma resposta

Obrigado por deixar um comentário. Lembre-se de que todos os comentários são moderados de acordo com nossos política de comentários, e seu endereço de e-mail NÃO será publicado. NÃO use palavras-chave no campo do nome. Vamos ter uma conversa pessoal e significativa.