Como adicionar o Google Maps ao site Turbosite
O Google Maps é o padrão mundial de cartografia. É ideal para sites com público internacional ou empresas do setor de turismo. A maneira mais fácil é incorporar um mapa via iframe diretamente da interface do Google Maps, sem necessidade de uma chave de API. É gratuito e a instalação leva 5 minutos.
O que você precisará
- Uma conta Google (não é obrigatória para o iframe básico) — registro
- Um site publicado no Turbosite
- 5 minutos
Passo 1. Obter o código do mapa
- Acesse google.com/maps.
- Pesquise o endereço ou a organização desejada na barra de busca.
- No cartão do local, clique no botão «Compartilhar» (ícone de seta).
- Na janela que abrir, selecione a aba «Incorporar um mapa» (Embed a map).
- Escolha o tamanho do mapa: pequeno, médio, grande ou personalizado.
- Copie o código iframe gerado.
📷 Captura de tela: janela «Incorporar um mapa» no Google Maps com o código iframe e opções de tamanho.
Passo 2. Inserir o código no Turbosite
O mapa aparece em um local específico da página (geralmente no bloco «Contatos»), portanto, o código é inserido no corpo da página.
- Abra seu site no Turbosite.
- Adicione o bloco «Código HTML» no local desejado da página.
- Cole o iframe do Google Maps copiado.
- Salve as alterações.
- Publique o site.
📷 [captura de tela do Turbosite — será adicionada: bloco de código HTML no corpo da página com o mapa do Google].
Passo 3. Verificar se o mapa está funcionando
- Abra o site publicado.
- Role até o bloco do mapa — ele deve carregar em 1 ou 2 segundos.
- Verifique a interatividade: clique no marcador, tente dar zoom, leia o cartão do local.
- Abra em um dispositivo móvel — o mapa deve se adaptar.
Perguntas frequentes
O mapa é cortado em dispositivos móveis ou não ocupa toda a largura.
No iframe, remova os valores fixos width="600" e height="450" e envolva o iframe em uma <div> com uma classe CSS para responsividade:
<div style="position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden;">
<iframe src="seu_src"
style="position: absolute; top: 0; left: 0; width: 100%; height: 100%;"
frameborder="0" allowfullscreen>
</iframe>
</div>
Preciso de uma chave de API? Para o iframe básico do menu «Compartilhar», não. A chave de API é necessária apenas se você usar a Google Maps Embed API diretamente ou a JavaScript API para personalização (marcadores próprios, rotas, estilos).
Posso adicionar meu próprio marcador ou rota? Via iframe, apenas o que já existe no Google Maps. Para seus próprios marcadores, crie um mapa no Google My Maps e obtenha o iframe a partir de lá.
Planos do Google Maps Platform. Desde 2025, o Google Maps Platform alterou sua tarifação: em vez de um crédito gratuito geral, existem limites mensais separados para cada produto. O iframe básico do Embed funciona gratuitamente sem restrições. Se você usar a JavaScript API, verifique os limites no Cloud Console.
O mapa está em russo, mas preciso dele em inglês.
O Google determina automaticamente o idioma com base na localidade do navegador. Para fixar o idioma, adicione o parâmetro &hl=en (ou outro código de idioma) à URL do iframe.
O que ver a seguir
- Google Maps Platform Documentation — documentação oficial
- Google My Maps — criação de mapas personalizados com marcadores
- Preços do Google Maps Platform — tarifas atuais