Como Adicionar uma Chave de API do Google Maps ao Seu Localizador de Lojas

O Storemapper trabalha com a plataforma Google Maps para garantir que seus clientes tenham a melhor experiência de mapa possível. Como esse mapa está no seu site, disponível publicamente, e seus clientes o utilizam livremente, você precisará estabelecer seu próprio relacionamento com o provedor de mapas (neste caso, o Google). Isso envolve a criação de uma conta com eles e a geração de uma chave de API ou token vinculado ao seu mapa e site.


Se você quiser saber mais sobre como o Storemapper utiliza a plataforma Google Maps e por que é necessário registrar seu mapa com o Google, acesse o artigo Sua licença do Google Maps para localizador de lojas explicada.


Se você não se sentir confortável em seguir essas etapas, oferecemos suporte a um provedor de mapas alternativo, que possui um processo de configuração de chave muito mais simples e não exige a configuração de cobrança. Acesse o artigo Adicione um token do Mapbox à sua conta para saber mais.


Siga os passos abaixo para configurar e adicionar sua chave de API do Google Maps:


Passo 1: Crie uma conta no Google Cloud


1.Acesse sua conta do Google Maps Platform.

2.Clique em Vamos começar no topo da página.

3.Configure sua conta preenchendo as informações necessárias.


Se você já tiver uma conta, pule para o Passo 2.


Passo 2: Crie um projeto no Google Cloud

1.Acesse sua conta do Google Maps Platform.

2.Clique em Selecionar um Projeto no topo da página.

3.Clique em Novo Projeto.

4.Dê um nome ao projeto (ex.: “Localizador de Lojas”) e clique em Criar.


Se você é novo na plataforma Google Cloud Platform (GCP), pode ser direcionado para a página inicial do GCP ao começar. O GCP é gratuito, mas o Google oferece um crédito de $300 por mês durante os 12 meses de teste gratuito, para que você possa experimentar os diversos serviços disponíveis na plataforma. Após os 12 meses, o Google reduzirá esse crédito e você passará a receber $200 por mês.


Além disso, o Google oferece a cada site uma cota gratuita de uso todo mês, suficiente para aproximadamente 10.000 a 15.000 visitas à página do seu localizador mensalmente (caso você não utilize a funcionalidade de preenchimento automático). Cerca de 99% dos clientes do Storemapper se enquadram nessa cota gratuita do Google, então, para a maioria dos clientes, não há custos adicionais.

No entanto, é sempre uma boa prática configurar um limite de orçamento e alertas de cobrança para evitar despesas inesperadas. Você encontrará os links para essas configurações no final deste artigo.


Passo 3: Ative as APIs Necessárias

1.Clique aqui para acessar a página de criação de API's.

2.Clique em criar credenciais e em seguida "Chave API":

3.Copie a chave API gerada e salve:

4.Adicione restrições para evitar o uso inadequado das APIs:

•Clique nos três pontinhos ao lado da chave API criada e em seguida clique em "editar chave API"


•Em restrições de chave, selecione "Sites".

•Em seguida, em Restrições do site, clique em "Add":

•Preencha com as informações das URL's que você quer que a API funcione.

Você deve preencher seu nome de domínio e colocar asteriscos antes e depois. Isso garantirá que você possa usar o Storemapper em qualquer subdomínio ou página dentro do seu domínio, e ele conseguirá utilizar a chave da API.


Por exemplo:

*seudominio.com/*


Além disso, se você deseja acessar o Storemapper a partir da tela de Preview no painel da sua conta, recomendamos adicionar também o domínio do Storemapper:

*storemapper.co/*


Solução de problemas

Se, após adicionar os referenciadores HTTP, você atualizar a página do seu localizador e visualizar o pino pulando no mapa, isso significa que o domínio foi adicionado de forma incorreta. Certifique-se de usar asteriscos no início e no final do nome do domínio.


Passo 4: Ative as API's necessárias:

  1. No menu lateral, clique em "Biblioteca"



2.Selecione "API Javascript de mapas":

3.Clique em "Habilitar":


4.Faça o mesmo para as seguintes API's:

API de geocodificação

•API de lugares

API de direções (opcional, mas recomendada para cálculo de rotas).

4.Clique em habilitar para cada uma das APIs.


Passo 5: Restrinja o Uso da Chave

1.Volte para a sua lista de API's, clicando aqui.

2.Clique em editar API.

3.Em Restrições de API, selecione "restringir chave" e em seguida selecione as APIs que você ativou anteriormente (ex.: Maps JavaScript API, Geocoding API, etc.).

4.Salve as alterações.


Passo 6: Adicione a Chave ao Storemapper


1.Acesse sua conta no Storemapper.

2.No painel de controle, clique em Configurações > Configurações da conta > Provedor de mapas.

3.Insira a chave de API que você copiou e salvou no campo apropriado.

4.Salve as alterações.


Passo 7: Teste seu Localizador de Lojas

1.Acesse o localizador de lojas no seu site.

2.Verifique se o mapa está carregando corretamente.

3.Caso encontre erros, consulte o Google Cloud Console para verificar o status da chave ou mensagens de erro.



Dicas Importantes

Controle o uso do Google Maps e gerencie custos de forma eficaz

Para seus produtos do Google Maps, o Google utiliza um modelo de preços baseado no consumo, o que significa que seus clientes pagam apenas pelo que realmente utilizam. Além disso, o Google oferece um crédito mensal recorrente de $200 em sua conta de cobrança para compensar os custos de uso.


Analisamos o uso de nossos clientes e descobrimos que a maioria se enquadra no crédito de $200, não tendo custos adicionais com o Google. No entanto, recomendamos seguir as dicas abaixo para evitar pagamentos inesperados.


Dica 1: Conheça o seu uso do mapa e os custos potenciais

O crédito gratuito que o Google oferece mensalmente deve ser suficiente para aproximadamente 10.000 – 15.000 carregamentos de mapas por mês. Ainda assim, é recomendável calcular o seu uso de mapas para garantir que você esteja dentro dessa faixa.


Dica 2: Configure alertas de orçamento e cobrança

O recurso de orçamento é uma funcionalidade interessante que o Google fornece para controlar sua cobrança. Você pode configurar limites de orçamento e alertas de cobrança, que o notificarão caso esteja se aproximando do limite definido. O artigo a seguir pode ajudar você a configurar alertas de orçamento e cobrança:

Configure um orçamento e alertas de cobrança


Se você tiver dúvidas ou problemas, entre em contato conosco pelo e-mail help@storemapper.co.

Still need help? Contact Us Contact Us