> ## 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.

# Google Address Autocomplete in Quiz-Funnels verwenden

> Aktivieren Sie Google Address Autocomplete auf Ihren Landingpages in LanderLab, um das Ausfüllen von Formularen zu beschleunigen, Fehler zu reduzieren und präzise Adressdaten zu erfassen.

> Fügen Sie Google Address Autocomplete zu Ihren Landingpages in LanderLab hinzu, um Besuchern schon beim Tippen Adressvorschläge in Echtzeit anzuzeigen. So lassen sich Adressfelder schneller und fehlerfreier ausfüllen.

## Was ist Google Address Autocomplete?

Google Address Autocomplete nutzt die Google Places API, um Adressvorschläge in Echtzeit anzuzeigen, sobald ein Besucher beginnt, in ein Adressfeld zu tippen. Statt die vollständige Adresse manuell einzugeben, können Besucher aus einer Liste passender Vorschläge auswählen. Das beschleunigt das Ausfüllen des Formulars und reduziert Tippfehler.

Um diese Funktion in LanderLab zu nutzen, sind zwei Schritte nötig:

1. Fügen Sie im Editor den Block **Google Address Autocomplete Input** zu Ihrem Quiz oder Formular hinzu.
2. Verbinden Sie über das Integrationsfenster Ihren **Google Places API Key**.

Beide Schritte sind erforderlich, damit die Autocomplete-Vorschläge erscheinen.

<Note>
  Sobald Sie eine Google-Address-Autocomplete-Integration hinzugefügt haben, wird sie **global** in Ihrem Konto gespeichert. Sie können sie auf mehreren Landingpages wiederverwenden, ohne die Angaben erneut einzugeben.
</Note>

***

## Teil 1: Den Autocomplete-Eingabeblock hinzufügen

Fügen Sie zunächst das spezielle Adress-Eingabefeld dem Quiz- oder Formularschritt hinzu, in dem Sie Adressdaten erfassen möchten.

<Steps>
  <Step title="Öffnen Sie den Quiz-Editor">
    Öffnen Sie die Landingpage mit Ihrem Quiz-Funnel und wechseln Sie in den **Quiz-Editor**.
  </Step>

  <Step title="Gehen Sie zum Adressschritt">
    Wechseln Sie zu dem Schritt, in dem Sie die Adresse des Besuchers erfassen möchten.
  </Step>

  <Step title="Fügen Sie den Block hinzu">
    Klicken Sie auf **Add Block**, suchen Sie nach **Google Address Autocomplete Input** und ziehen Sie den Block auf Ihren Quiz-Schritt.
  </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>

Damit ist das Feld vorbereitet, Adressvorschläge zu empfangen. Die Vorschläge erscheinen jedoch erst, wenn Sie in Teil 2 Ihren Google Places API Key verbunden haben.

***

## Teil 2: Ihren Google Places API Key verbinden

Sobald der Block hinzugefügt ist, verbinden Sie Ihren Google Places API Key über das Integrationsfenster.

<Steps>
  <Step title="Öffnen Sie Ihre Landingpage">
    Gehen Sie zu **Landing Pages** und klicken Sie auf den **Namen der Landingpage**, auf der Sie die Adressvervollständigung aktivieren möchten.
  </Step>

  <Step title="Öffnen Sie den Tab Integrations">
    Klicken Sie auf **Add Integration**, um das Integrationsfenster zu öffnen.
  </Step>

  <Step title="Wählen Sie Google Address Autocomplete aus">
    Suchen Sie in der Liste der verfügbaren Integrationen **Google Address Autocomplete** und klicken Sie darauf. Es erscheint ein Konfigurationsformular.
  </Step>

  <Step title="Füllen Sie die erforderlichen Felder aus">
    Geben Sie die folgenden Angaben ein:

    | Feld        | Beschreibung                                                                                                                                                                   |
    | :---------- | :----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
    | **Name**    | Eine Bezeichnung zur Identifikation dieser Integration (z. B. „Google Address Autocomplete“). So erkennen Sie sie bei der Wiederverwendung auf anderen Seiten leichter wieder. |
    | **API Key** | Ihr Google Places API Key aus der Google Cloud Console.                                                                                                                        |

    <Tip>
      Falls Sie noch keinen erstellt haben, lesen Sie weiter unten den Abschnitt **So erhalten Sie einen Google Places API Key**.
    </Tip>
  </Step>

  <Step title="Speichern und veröffentlichen">
    Klicken Sie auf **Add Google Address Autocomplete**, um die Integration zu speichern, und anschließend auf **Publish** oder **Republish**. Adressvorschläge erscheinen nun in Echtzeit, während Besucher in das Adressfeld tippen.
  </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>

***

## Mit einer weiteren Landingpage verbinden

Da Google-Address-Autocomplete-Integrationen global gespeichert werden, müssen Sie nicht für jede Landingpage eine neue anlegen.

<Steps>
  <Step title="Öffnen Sie eine andere Landingpage">
    Gehen Sie zu **Landing Pages** und klicken Sie auf den Namen der Landingpage, auf der Sie dieselbe Integration verwenden möchten.
  </Step>

  <Step title="Integration hinzufügen">
    Klicken Sie auf **Add Integration**. Ihre zuvor gespeicherten Google-Address-Autocomplete-Konfigurationen werden aufgelistet. Wählen Sie die gewünschte aus.
  </Step>

  <Step title="Varianten auswählen (falls zutreffend)">
    Wenn Ihre Landingpage mehrere **A/B-Test-Varianten** hat, erscheint ein Dialog, in dem Sie auswählen, welche Varianten diese Integration verwenden sollen. Wählen Sie die gewünschten Varianten aus und bestätigen Sie.
  </Step>

  <Step title="Speichern und veröffentlichen">
    Klicken Sie auf **Save** und anschließend auf **Publish** oder **Republish**, um die Adressvervollständigung auf den ausgewählten Varianten zu aktivieren.
  </Step>
</Steps>

***

## So erhalten Sie einen Google Places API Key

Wenn Sie noch keinen Google Places API Key haben, erstellen Sie ihn wie folgt in der Google Cloud Console.

<Steps>
  <Step title="Öffnen Sie die Google Cloud Console">
    Gehen Sie zu [console.cloud.google.com](https://console.cloud.google.com) und melden Sie sich mit Ihrem Google-Konto an.
  </Step>

  <Step title="Erstellen oder wählen Sie ein Projekt">
    Klicken Sie oben auf der Seite auf **Select a Project** und wählen Sie entweder ein vorhandenes Projekt aus oder klicken Sie auf **New Project**, um ein neues anzulegen.
  </Step>

  <Step title="Aktivieren Sie die Places API">
    1. Gehen Sie in der linken Seitenleiste zu **APIs and Services**.
    2. Klicken Sie auf **Library**.
    3. Suchen Sie nach **Places API**.
    4. Klicken Sie darauf und anschließend auf **Enable**.
  </Step>

  <Step title="Erstellen Sie einen API-Schlüssel">
    1. Gehen Sie zu **APIs and Services > Credentials**.
    2. Klicken Sie auf **+ Create Credentials** und wählen Sie **API Key**.
    3. Kopieren Sie den erzeugten API-Schlüssel und fügen Sie ihn in LanderLab in das Feld **API Key** ein.
  </Step>

  <Step title="Beschränken Sie Ihren API-Schlüssel (empfohlen)">
    Um die unbefugte Nutzung Ihres Schlüssels zu verhindern, legen Sie in den Einstellungen des API-Schlüssels Beschränkungen fest:

    * Wählen Sie unter **API restrictions** die **Places API** aus, damit der Schlüssel ausschließlich für die Adressvervollständigung verwendet werden kann.
    * Wählen Sie unter **Application restrictions** die Option **HTTP referrers (websites)** und fügen Sie die Domain Ihrer Landingpage hinzu.

    So stellen Sie sicher, dass Ihr API-Schlüssel nicht von anderen Websites oder Diensten verwendet werden kann.
  </Step>
</Steps>

<Warning>
  Google setzt voraus, dass in Ihrem Google-Cloud-Projekt die **Abrechnung aktiviert** ist, um die Places API zu nutzen. Google gewährt jedoch ein **kostenloses monatliches Guthaben von \$200**, das für die meisten Anwendungsfälle der Adressvervollständigung auf Landingpages mehr als ausreicht.
</Warning>

***

## Tipps zu Google Address Autocomplete

* **Beide Schritte sind erforderlich** – Wenn Sie den Eingabeblock hinzufügen, ohne den API-Schlüssel zu verbinden (oder umgekehrt), erhalten Sie lediglich ein einfaches Textfeld ohne Vorschläge. Führen Sie daher sowohl Teil 1 als auch Teil 2 aus.
* **Nach dem Verbinden veröffentlichen** – Die Autocomplete-Vorschläge erscheinen auf Ihrer Live-Seite erst, wenn Sie nach dem Hinzufügen der Integration erneut veröffentlichen.
* **Beschränken Sie Ihren API-Schlüssel** – Ein unbeschränkter API-Schlüssel kann von jedem genutzt werden, der ihn findet. Legen Sie in der Google Cloud Console stets API- und Domain-Beschränkungen fest, um Nutzung und Abrechnung zu schützen.
* **Abrechnung erforderlich, meist aber kostenlos** – Sie müssen die Abrechnung in Ihrem Google-Cloud-Projekt aktivieren, doch das monatliche Gratisguthaben von \$200 reicht für nahezu alle Landingpage-Anwendungsfälle aus – es sei denn, Sie arbeiten mit sehr hohem Traffic-Volumen.
