Para um café, uma clínica, um estúdio ou uma banca de mercado, a página associada ao link do perfil tem uma função mais importante do que todas as outras, levar as pessoas até à porta. Há 3 formas de colocar um mapa numa página Digily Link. A escolha depende do seu plano e de querer mostrar um mapa ou disponibilizar um botão que inicia a navegação.
Opção 1. Um botão de direções que abre a aplicação Maps
Esta opção funciona em todos os planos, incluindo o Free, e é aquela que a maioria dos visitantes realmente procura. Ninguém quer ampliar e reduzir um mapa no telemóvel. As pessoas tocam em "Obter direções" e esperam que a navegação comece.
- Abra o Google Maps, encontre o seu negócio, toque em Partilhar e copie o link.
- No painel, crie um link curto com esse endereço como destino e ative "auto open app on mobile". A Digily Link reconhece links do Google Maps e do Waze. Assim, num telemóvel com a aplicação instalada, o link curto abre diretamente a navegação. O guia sobre deep linking explica por que motivo isto é importante.
- Adicione um bloco de link à sua página, cole o link curto e dê-lhe o nome "Obter direções".
Como o botão aponta para um link curto, os toques são contabilizados nas estatísticas. Se mudar de localização, também pode alterar o destino.
Opção 2. Um mapa incorporado com o bloco iframe
O bloco iframe está disponível nos planos Starter e Pro e apresenta o mapa na própria página.
- No Google Maps, encontre o local, abra Partilhar e selecione o separador "Incorporar um mapa".
- Copie o HTML apresentado pelo Google. Só precisa do endereço dentro de src="…", que começa por https://www.google.com/maps/embed. Se for mais fácil extrair o endereço dessa forma, cole o fragmento completo no Analisador de URL.
- Adicione um bloco iframe à sua página, cole esse endereço como URL e defina uma altura de cerca de 300 píxeis.
Coloque o botão de direções da opção 1 imediatamente abaixo do mapa. O mapa mostra onde está e o botão ajuda as pessoas a chegar lá.
Opção 3. HTML personalizado para um mapa responsivo
O bloco de HTML personalizado está disponível no plano Pro e permite controlar todos os detalhes, incluindo apresentar um mapa que mantém as proporções em qualquer tamanho de ecrã. Cole o código seguinte no bloco e substitua YOUR_EMBED_URL pelo endereço do separador "Incorporar um mapa".
<div style="position:relative;padding-bottom:56.25%;height:0;overflow:hidden;border-radius:12px"><iframe src="YOUR_EMBED_URL" style="position:absolute;top:0;left:0;width:100%;height:100%;border:0" loading="lazy" allowfullscreen referrerpolicy="no-referrer-when-downgrade"></iframe></div>
O valor de padding-bottom define o formato. 56,25% cria um retângulo de 16:9, 75% cria um mapa mais quadrado de 4:3 e 100% cria um quadrado. O atributo loading="lazy" impede que o mapa abrande a página antes de o visitante chegar até ele. Se copiar código de outro local, organize-o primeiro com o Minificador de HTML, para que uma quebra de linha perdida não danifique o bloco.
Que opção deve escolher
| O que pretende | O que deve usar | Plano |
|---|---|---|
| Iniciar a navegação com um toque | Botão de direções com ligação à aplicação | Free e superiores |
| Mostrar um mapa na página | Bloco iframe | Starter e Pro |
| Personalizar o formato e o estilo do mapa | Bloco de HTML personalizado | Pro |
| Mostrar várias localizações | Um título e um botão de direções por local, ou um Google My Map personalizado incorporado com a opção 2 ou 3 | Depende dos blocos utilizados |
Sugestões para negócios locais
- Coloque o código postal num bloco de parágrafo acima do mapa, para quem preferir introduzi-lo na sua própria aplicação.
- Adicione o bloco de horário de funcionamento, disponível no plano Free, para que o visitante saiba se ainda vai a tempo de sair.
- Use apenas um mapa por página. Dois mapas incorporados duplicam o tempo de carregamento e oferecem muito pouco benefício adicional.
- Imprima um código QR da página para colocar na montra e em folhetos. Pode consultar a estrutura de uma página para um estabelecimento em link na bio para pequenos negócios.
- Teste o botão de direções dentro do Instagram num iPhone e num telemóvel Android. O Verificador de redirecionamento de URL mostra o que o link curto faz num computador.
Negócios temporários, mercados e eventos
Uma banca que muda de local todos os fins de semana não precisa de um mapa novo de cada vez. Mantenha o botão de direções associado a um link curto e, à sexta-feira, altere o destino para a localização desse fim de semana. O endereço na página, o código QR na faixa e o link do perfil nunca mudam. Nos planos Starter e Pro, o link curto também pode ser programado. Assim, a localização de sábado muda para a de domingo à meia-noite, sem ser necessário alguém se lembrar de o fazer. Adicione um bloco de parágrafo com as datas e o código postal para quem gosta de planear com antecedência.
Apple Maps e Waze
A ligação à aplicação reconhece endereços do Google Maps e do Waze. Para os utilizadores de iPhone que preferem o Apple Maps, um link normal para maps.apple.com com o endereço abre o Apple Maps num iPhone e um mapa na web noutros dispositivos. Os próprios links da Apple funcionam assim, sem ser necessária qualquer definição. Dois botões, "Google Maps" e "Apple Maps", abrangem quase todos os telemóveis em Portugal, e o número de cliques mostra qual deles é realmente utilizado pelos seus visitantes.
Perguntas frequentes
Preciso de uma chave da API do Google Maps?
Não. O fragmento "Incorporar um mapa" e o link de partilha podem ser utilizados gratuitamente e não precisam de uma chave. Uma chave da API só é necessária para programadores que estejam a criar a sua própria aplicação de mapas.
Posso mostrar mais do que um marcador?
Crie um mapa personalizado no Google My Maps com todas as suas localizações, partilhe-o publicamente e utilize o respetivo endereço de incorporação no bloco iframe ou no bloco de HTML personalizado.
Um mapa incorporado torna a página mais lenta?
Um pouco. Por esse motivo, o código acima só o carrega quando for necessário. Numa página cujo objetivo é levar pessoas até um local, o botão de direções é mais importante do que a imagem do mapa.
Posso fazer isto no plano Free?
Pode usar o botão de direções. O bloco iframe exige o plano Starter e o bloco de HTML personalizado exige o plano Pro. A página dos planos indica o que está incluído em cada um.
O que tenho de fazer se mudar de instalações?
Altere o destino do link curto associado ao botão de direções e substitua o endereço de incorporação. Não precisa de alterar nada do que já imprimiu.
Verificações finais
- O botão de direções abre a aplicação Maps num telemóvel e uma página de mapa num computador.
- O mapa incorporado mostra o marcador certo e ajusta-se à largura da página num telemóvel.
- O código postal e o horário de funcionamento estão na página.
- A página tem apenas um mapa.
- Testou a página dentro do Instagram, não apenas no navegador.
