widget Categorias: Negócios
Mostre a seus visitantes um mapa de qualquer local que você desejar. Use o widget Mapa para mostrar a localização do seu negócio físico ou de um evento especial. Você também pode usá-lo para mostrar aos clientes onde eles encontrarão estacionamento.
O Mapbox é o provedor de mapas padrão para o widget Map. No entanto, você pode tornar o Google Maps o provedor de mapas padrão para todos os sites novos e existentes em sua conta. Além do Mapa widget, o Google Maps se tornará o padrão em todas as pesquisas de locais e mapas para a Biblioteca de Conteúdo e outros widget aplicáveis.
Todos os dados de localização do Mapbox são salvos e aplicados ao Google Maps. Isso garante que você não precise configurar locais novamente.
Observe que esse recurso só pode ser ativado por membros da equipe com permissão de configurações profissionais.
Para definir o Google Maps como seu provedor de mapas padrão:
-
Na sua conta do Google Maps, gere uma chave de API. Para saber como gerar uma chave de API, consulte a documentação do Google. Recomendamos que você analise a política de uso e cobrança do Google.
-
(Opcional) Se você configurar sua conta do Google para que a chave de API só possa ser usada em sites específicos, você precisará adicionar duda.co, o domínio do seu site e, se aplicável, quaisquer domínios de etiqueta branca à lista de sites permitidos na sua Conta do Google.
É importante usar o seguinte formato para seus domínios: *.duda.co/*
-
No painel, clique em seu avatar no canto superior direito e selecione Conta.
-
Na página Configurações da conta, role para baixo até a seção Integração com o Google Map e clique em Configurar.
-
Cole sua chave de API no campo e clique em Aplicar a todos os sites. Isso torna o Google Maps o mapa padrão para todos os sites existentes e novos em sua conta.
A qualquer momento, você pode desativar o Google Maps e voltar para o Mapbox. Todos os dados de localização do Google Maps serão salvos e aplicados automaticamente ao Mapbox quando você alternar.
Opções de configuração do mapa
-
Digite seu endereço comercial no campo fornecido.
-
Selecione o endereço no menu suspenso que aparece.
Nota
se não aparecer o endereço, é porque que o banco de dados HERE que o Website Builder utiliza não contém o endereço. Para enviar ou corrigir o endereço, fale com o HERE Map Creator.
Ao usar o Google Maps como provedor padrão, consulte a documentação do Google, Adicionar um lugar ausente ao Google Maps.
-
-
Você pode optar por exibir uma imagem de um botão de mapa, em vez de uma imagem de mapa.
-
Para exibir um botão de mapa em dispositivos específicos no editor Clássico, selecione o botão Usar nos dispositivos ( ) onde você deseja que o botão apareça. Se nenhum dispositivo for escolhido, a imagem do mapa será exibida.
-
No Editor 2.0, o botão pode ser ativado para todos os dispositivos. Para ativar o botão, clique no botão Definir como botão em Todos os dispositivos.
-
-
Digite o texto que você deseja que apareça no botão no campo Texto no botão fornecido.
-
Popup de informações de localização (janela de informações para o marcador do mapa). Para exibir um pop-up de informações de localização no widget de mapa:
-
Digite um título e uma descrição para o pop-up.
-
Selecione a exibição do pop-up em hover, Ao clicar ou Sempre no menu suspenso Exibição de pop-up.
-
Para incorporar mapas do Google Maps usando o widget HTML:
-
Navegue para o Google Maps.
-
Procure o local que você deseja.
-
Clique no menu no canto superior esquerdo e clique em Compartilhar ou incorporar mapa .
-
Clique na guia Incorporar mapa.
-
Copie o URL entre aspas após < iframe src = " . Certifique-se de copiar o URL completo aninhado entre aspas.
-
Navegue até o seu site e, no painel esquerdo, clique em widget e arraste o HTML widget para uma linha ou coluna.
-
Use o código de incorporação a seguir e informe o URL que você obteve do Google Maps entre as aspas após iframe src =:
<div class="embed-container"><iframe src=" " frameborder="0" allowfullscreen></iframe></div>
-
Entre no Modo de desenvolvedor.
-
Clique em HTML/CSS do site e, em seguida, clique em site.css.
-
Incorpore o seguinte CSS nesta seção:
.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
O mapa será redimensionado de acordo com as diferentes visualizações do dispositivo. Se você usar o código de incorporação normal do Google Maps, o tamanho do widget do mapa será estático em todos os dispositivos e será cortado na visualização do celular.