> ## Documentation Index
> Fetch the complete documentation index at: https://docs.landerlab.io/llms.txt
> Use this file to discover all available pages before exploring further.

# Usar o Google Address Autocomplete em funis de quiz

> Ative o Google Address Autocomplete nas suas landing pages no LanderLab para agilizar o preenchimento de formulários, reduzir erros e coletar dados de endereço precisos dos visitantes.

> Adicione o Google Address Autocomplete às suas landing pages no LanderLab para mostrar sugestões de endereço em tempo real enquanto os visitantes digitam, tornando o preenchimento dos campos de endereço mais rápido e preciso.

## O que é o Google Address Autocomplete?

O Google Address Autocomplete usa a Google Places API para mostrar sugestões de endereço em tempo real assim que o visitante começa a digitar em um campo de endereço. Em vez de digitar o endereço completo manualmente, o visitante pode escolher uma das sugestões correspondentes em uma lista, o que agiliza o preenchimento do formulário e reduz erros de digitação.

Para usar esse recurso no LanderLab, você precisa fazer duas coisas:

1. Adicionar o **bloco Google Address Autocomplete Input** ao seu quiz ou formulário no editor
2. Conectar a sua **chave da Google Places API** pelo painel de integrações

As duas etapas são necessárias para que as sugestões de preenchimento automático apareçam.

<Note>
  Depois que você adiciona uma integração com o Google Address Autocomplete, ela fica salva **globalmente** na sua conta. Você pode reutilizá-la em várias landing pages sem precisar informar os dados novamente.
</Note>

***

## Parte 1: Adicionar o bloco de entrada com preenchimento automático

Primeiro, adicione o campo de endereço especializado à etapa do quiz ou do formulário em que você quer coletar os dados de endereço.

<Steps>
  <Step title="Abra o Quiz Editor">
    Abra a landing page que contém o seu funil de quiz e entre no **Quiz Editor**.
  </Step>

  <Step title="Vá até a etapa de endereço">
    Vá até a etapa em que você quer coletar o endereço do visitante.
  </Step>

  <Step title="Adicione o bloco">
    Clique em **Add Block**, pesquise **Google Address Autocomplete Input** e arraste o bloco para a etapa do seu quiz.
  </Step>
</Steps>

<Frame>
  <img src="https://mintcdn.com/landerlab-babdc23f/hQLLLMPAbDBPhaNj/images/google-address-autocomplete.png?fit=max&auto=format&n=hQLLLMPAbDBPhaNj&q=85&s=52f620d1dce4d0e4c94c5682fd61e326" alt="Google Address Autocomplete" width="1920" height="988" data-path="images/google-address-autocomplete.png" />
</Frame>

Isso prepara o campo para receber sugestões de endereço. As sugestões só aparecerão depois que você conectar a sua chave da Google Places API na Parte 2.

***

## Parte 2: Conectar a sua chave da Google Places API

Depois de adicionar o bloco, conecte a sua chave da Google Places API pelo painel de integrações.

<Steps>
  <Step title="Acesse sua landing page">
    Vá até **Landing Pages** e clique no **nome da landing page** em que você quer ativar o preenchimento automático de endereços.
  </Step>

  <Step title="Abra a aba de integrações">
    Clique em **Add Integration** para abrir o painel de integrações.
  </Step>

  <Step title="Selecione o Google Address Autocomplete">
    Na lista de integrações disponíveis, encontre **Google Address Autocomplete** e clique nele. Um formulário de configuração será exibido.
  </Step>

  <Step title="Preencha os campos obrigatórios">
    Informe os seguintes dados:

    | Campo       | Descrição                                                                                                                                   |
    | :---------- | :------------------------------------------------------------------------------------------------------------------------------------------ |
    | **Name**    | Um nome para identificar esta integração (ex.: "Google Address Autocomplete"). Ajuda você a reconhecê-la ao reutilizá-la em outras páginas. |
    | **API Key** | A sua chave da Google Places API, obtida no Google Cloud Console.                                                                           |

    <Tip>
      Consulte a seção **Como obter uma chave da Google Places API** abaixo se você ainda não tiver criado uma.
    </Tip>
  </Step>

  <Step title="Salve e publique">
    Clique em **Add Google Address Autocomplete** para salvar a integração e depois em **Publish** ou **Republish** na sua landing page. As sugestões de endereço passarão a aparecer em tempo real enquanto os visitantes digitam no campo de endereço.
  </Step>
</Steps>

<Frame>
  <img src="https://mintcdn.com/landerlab-babdc23f/hQLLLMPAbDBPhaNj/images/google-api.png?fit=max&auto=format&n=hQLLLMPAbDBPhaNj&q=85&s=25fe80c95ecdb83ad6387c5c2a843ee1" alt="Google Api" width="1920" height="990" data-path="images/google-api.png" />
</Frame>

***

## Conectar a outra landing page

Como as integrações com o Google Address Autocomplete são salvas globalmente, você não precisa criar uma nova para cada landing page.

<Steps>
  <Step title="Abra outra landing page">
    Acesse **Landing Pages** e clique no nome da landing page em que você quer usar a mesma integração.
  </Step>

  <Step title="Adicione a integração">
    Clique em **Add Integration**. Você verá as configurações do Google Address Autocomplete salvas anteriormente. Selecione a que você quer conectar.
  </Step>

  <Step title="Selecione as variantes (se for o caso)">
    Se a sua landing page tiver várias **variantes de teste A/B**, será exibido um modal pedindo que você escolha quais variantes devem usar esta integração. Selecione as variantes desejadas e confirme.
  </Step>

  <Step title="Salve e publique">
    Clique em **Save** e depois em **Publish** ou **Republish** na sua landing page para ativar o preenchimento automático de endereços nas variantes selecionadas.
  </Step>
</Steps>

***

## Como obter uma chave da Google Places API

Se você ainda não tiver uma chave da Google Places API, siga estes passos para criar uma no Google Cloud Console.

<Steps>
  <Step title="Abra o Google Cloud Console">
    Acesse [console.cloud.google.com](https://console.cloud.google.com) e faça login com a sua conta do Google.
  </Step>

  <Step title="Crie ou selecione um projeto">
    Clique em **Select a Project** no topo da página e escolha um projeto existente ou clique em **New Project** para criar um.
  </Step>

  <Step title="Ative a Places API">
    1. Acesse **APIs and Services** na barra lateral esquerda.
    2. Clique em **Library**.
    3. Pesquise **Places API**.
    4. Clique nela e depois em **Enable**.
  </Step>

  <Step title="Crie uma chave de API">
    1. Acesse **APIs and Services > Credentials**.
    2. Clique em **+ Create Credentials** e selecione **API Key**.
    3. Copie a chave de API gerada e cole-a no campo **API Key** no LanderLab.
  </Step>

  <Step title="Restrinja a sua chave de API (recomendado)">
    Para evitar o uso não autorizado da sua chave, aplique restrições nas configurações da chave de API:

    * Em **API restrictions**, selecione **Places API** para que a chave só possa ser usada para o preenchimento automático de endereços.
    * Em **Application restrictions**, selecione **HTTP referrers (websites)** e adicione o domínio da sua landing page.

    Isso garante que a sua chave de API não possa ser usada por outros sites ou serviços.
  </Step>
</Steps>

<Warning>
  O Google exige que o **faturamento esteja ativado** no seu projeto do Google Cloud para usar a Places API. No entanto, o Google oferece **US\$ 200 em crédito mensal gratuito**, o que é mais do que suficiente para a maioria dos casos de uso de preenchimento automático de endereços em landing pages.
</Warning>

***

## Dicas para o Google Address Autocomplete

* **As duas etapas são obrigatórias** - Adicionar o bloco de entrada sem conectar a chave de API (ou vice-versa) resultará em um campo de texto simples, sem sugestões. Certifique-se de concluir a Parte 1 e a Parte 2.
* **Publique depois de conectar** - As sugestões de preenchimento automático só aparecerão na sua página publicada depois que você republicá-la após adicionar a integração.
* **Restrinja a sua chave de API** - Uma chave de API sem restrições pode ser usada por qualquer pessoa que a encontre. Sempre aplique restrições de API e de domínio no Google Cloud Console para proteger o seu uso e o seu faturamento.
* **O faturamento é obrigatório, mas geralmente não gera custos** - Você precisa ativar o faturamento no seu projeto do Google Cloud, mas o crédito mensal gratuito de US\$ 200 oferecido pelo Google é suficiente para quase todos os casos de uso em landing pages, a menos que você tenha volumes de tráfego muito altos.