Verbinden mit Google Sheets über eine benutzerdefinierte Anwendung

Google Sheets Addon ist ein Profi-Feature

Schalten Sie das Google Sheets Addon und andere leistungsstarke Funktionen frei, um Ihr Unternehmen auszubauen.

WPForms Pro kaufen

Möchten Sie unser Google Sheets Addon mit einer benutzerdefinierten Google-Anwendung anstelle der WPForms Google-App verwenden? Eine Verbindung zu Google Sheets über eine benutzerdefinierte Anwendung ist manchmal die beste Option für Entwickler und fortgeschrittene Nutzer.

In diesem Tutorial zeigen wir Ihnen, wie Sie das WPForms Google Sheets Addon mit Ihrer eigenen benutzerdefinierten Google-App verwenden können.

Anforderungen:


Bevor Sie beginnen, müssen Sie zunächst sicherstellen, dass WPForms auf Ihrer WordPress-Website installiert und aktiviert ist und dass Sie Ihre Lizenz überprüft haben. Außerdem müssen Sie sich für ein Google-Konto anmelden, falls Sie noch keins haben, und das Google Sheets-Addon installieren und aktivieren.

Hinweis: Die Verbindung von WPForms mit einer benutzerdefinierten Google-Anwendung wird nur für Entwickler oder fortgeschrittene Nutzer empfohlen. Wenn Sie keine benutzerdefinierte Anwendung benötigen, lesen Sie bitte unsere Anleitung zur Verwendung des Google Sheets-Addons.

Aktivieren des erweiterten Modus

Um loszulegen, öffnen Sie Ihr WordPress-Dashboard und gehen Sie zu WPForms " Einstellungen. Klicken Sie dann auf die Registerkarte " Integrationen ".

klick-integrationen-tab

Klicken Sie anschließend auf die Google Sheets-Integration, um die Einstellungen zu erweitern.

klick-google-sheets

Um mit der Verbindung zu Ihrer Google-Anwendung zu beginnen, klicken Sie auf Erweiterten Modus aktivieren.

click-enable-advanced-mode

Es werden nun weitere Einstellungen angezeigt, in die Sie Informationen von der Google Cloud Platform eingeben müssen.

advanced-mode-connection-settings

Um diese Informationen zu finden, müssen Sie sich zunächst bei der Google Cloud Platform anmelden und eine benutzerdefinierte Anwendung erstellen. Wir empfehlen jedoch, Ihre WPForms-Einstellungen in einem separaten Browser-Tab geöffnet zu lassen, während Sie Ihre Anwendung erstellen, da Sie später darauf zugreifen müssen.

Hinzufügen eines neuen Projekts

Sobald Sie sich bei der Google Cloud Platform angemeldet haben, klicken Sie auf APIs & Services.

klick-apis-und-app-dienste

Klicken Sie auf dem nächsten Bildschirm auf das Dropdown-Menü Projekte.

Klick-ein-Projekt-auswählen-Dropdown

Daraufhin wird ein Overlay mit Ihren Projekten angezeigt. Klicken Sie nun auf NEUES PROJEKT.

klick-neues-projekt

Als Nächstes müssen Sie einen Namen in das Feld Projektname eingeben. Wir empfehlen Ihnen, einen Namen zu verwenden, der Ihnen hilft, sich zu merken, wofür Sie das Projekt verwenden. Sie können jedoch jeden beliebigen Namen verwenden.

Nachdem Sie einen Namen hinzugefügt haben, klicken Sie auf die Schaltfläche ERSTELLEN.

projektname-hinzufügen-und-klick-erstellen

Wenn Sie Ihr Projekt erstellt haben, klicken Sie erneut auf das Dropdown-Menü und wählen Sie Ihr neu erstelltes Projekt aus, sofern es nicht bereits standardmäßig ausgewählt ist.

Klick-Projekt-Dropdown

Aktivieren von Google APIs

Da Ihr Projekt nun erstellt ist, ist es an der Zeit, einige Google-APIs zu aktivieren. Klicken Sie zunächst auf Bibliothek im Menü auf der linken Seite.

Klick-Bücherei

Dies führt Sie zur API-Bibliothek, wo Sie 3 verschiedene APIs suchen und aktivieren müssen: Google Drive API, Google Sheets API und Google Picker API.

Geben Sie "Google Drive API" in die Suchleiste ein, um die Google Drive API zu finden.

suche-google-drive-api

Sobald Sie die Google Drive API gefunden haben, klicken Sie auf die Schaltfläche AKTIVIEREN.

google-drive-ap per Klick aktivieren

Gehen Sie dann zurück zur API-Bibliothek von Google und geben Sie "Google Sheets API" in die Suchleiste ein.

suche-google-blätter-api

Nachdem Sie die Google Sheets API gefunden haben, klicken Sie auf die Schaltfläche AKTIVIEREN.

klicken-aktivieren-google-sheets-api

Kehren Sie schließlich zur API-Bibliothek von Google zurück und geben Sie "Google Picker API" in die Suchleiste ein.

such-auswahl-api

Sobald Sie die Google Picker API gefunden haben, klicken Sie auf die Schaltfläche AKTIVIEREN.

click-to-enable-picker-api

Auswählen eines Benutzertyps

Nachdem Sie nun die erforderlichen APIs aktiviert haben, klicken Sie im Menü auf der linken Seite auf OAuth-Zustimmungsbildschirm.

click-oauth-consent-screen

Auf dem nächsten Bildschirm müssen Sie einen Nutzertyp für Ihre Anwendung auswählen. Sie können entweder intern oder extern wählen, je nachdem, für wen Sie Ihre Anwendung freigeben möchten.

Für unser Beispiel wählen wir Extern. Sobald Sie Ihre Auswahl getroffen haben, klicken Sie auf die Schaltfläche ERSTELLEN, um fortzufahren.

click-create-button-oauth-consent

Hinweis: Lesen Sie unbedingt die Google-Dokumentation über Nutzertypen, um mehr über externe und interne Nutzer zu erfahren.

Registrierung Ihrer App

Nachdem Sie einen Nutzertyp für Ihre App ausgewählt haben, werden Sie zu einer Seite weitergeleitet, auf der Sie die Registrierung Ihrer App abschließen können. Sie müssen eine Reihe von Schritten durchführen, um Ihre App zu registrieren, die wir in den folgenden Abschnitten erläutern.

Hinzufügen von App-Informationen

Das Hinzufügen von Informationen über Ihre App ist erforderlich, damit die Nutzer wissen, wer Sie sind und wie sie Sie kontaktieren können.

Fügen Sie in den erforderlichen Feldern einen App-Namen und eine Benutzer-Support-E-Mail hinzu.

app-registration-name-and-support-email

Hinzufügen einer App-Domäne

Scrollen Sie nach unten zum Abschnitt App-Domain und suchen Sie den Abschnitt Autorisierte Domains. Klicken Sie hier auf die Schaltfläche DOMÄNE HINZUFÜGEN.

Klick-auf-die-Domain-Schaltfläche

Im Feld Autorisierte Domäne 1 müssen Sie wpforms.com als Ihre Domäne hinzufügen.

add-wpforms-domain

Hinweis: Sie müssen wpforms.com als autorisierte Domäne hinzufügen, sonst kann Ihre Anwendung keine Verbindung zu WPForms herstellen.

Hinzufügen von Kontaktinformationen für Entwickler

Fügen Sie als Nächstes Ihre bevorzugte E-Mail-Adresse im Abschnitt Kontaktinformationen für Entwickler hinzu. Google wird Sie unter dieser E-Mail-Adresse kontaktieren, wenn es Änderungen an Ihrem Projekt gibt.

entwickler-email-adresse

Klicken Sie abschließend auf die Schaltfläche SPEICHERN UND WEITER, um mit dem nächsten Schritt fortzufahren.

speichern-und-weiter-klicken

Hinzufügen von Geltungsbereichen

Klicken Sie auf dem nächsten Bildschirm auf die Schaltfläche SCOPES HINZUFÜGEN ODER ENTFERNEN.

Klick-hinzufügen-oder-entfernen-Bereiche

Klicken Sie in dem daraufhin angezeigten Seitenmodal auf die Suchleiste mit der Aufschrift Eigenschaftsname oder Wert eingeben.

eigenschaftsname-oder-wert-suche-leiste eingeben

Suchen Sie dann nach jedem der folgenden Bereiche:

  • https://www.googleapis.com/auth/userinfo.email
  • https://www.googleapis.com/auth/userinfo.profile
  • https://www.googleapis.com/auth/drive.file
  • https://www.googleapis.com/auth/spreadsheets

Sie müssen jeden der oben genannten Bereiche durch Anklicken des Kontrollkästchens auf der linken Seite aktivieren.

click-checkbox-to-enable-scope

Sobald Sie die erforderlichen Bereiche aktiviert haben, klicken Sie auf die Schaltfläche UPDATE am unteren Rand des Bildschirms.

Klick-Update-Button

Sie kehren dann zum Bildschirm " Bereiche" zurück, wo Sie Ihre aktivierten Bereiche anzeigen und verwalten können. Klicken Sie hier auf die Schaltfläche SPEICHERN UND WEITER, um Ihre Änderungen zu speichern.

klicken-speichern-und-fortsetzen-bildschirm

Hinzufügen von Testbenutzern

Google muss den Verifizierungsprozess abschließen, bevor Nutzer mit Ihrer App interagieren können. Sie können jedoch bestimmten Nutzern erlauben, Ihre App zu testen, bevor sie verifiziert wird. Dieser Schritt ist für unsere Einrichtung nicht erforderlich, daher gehen wir zum nächsten Schritt über, indem wir auf die Schaltfläche SPEICHERN UND WEITER klicken.

klicken-speichern-und-weiter-test-benutzer-bildschirm

Überprüfung der Registrierung Ihrer App

Der letzte Schritt der App-Registrierung besteht darin, Ihre Konfiguration auf dem Bildschirm Zusammenfassung zu überprüfen. Wenn alles korrekt aussieht und mit den Schritten in diesem Tutorial übereinstimmt, klicken Sie auf die Schaltfläche ZURÜCK ZUR ANZEIGE am unteren Rand des Bildschirms.

Klick-zurück-zur-Tafel-Schaltfläche

Veröffentlichen Ihrer App

Nachdem Sie die App-Registrierung abgeschlossen haben, müssen Sie Ihre App veröffentlichen. Sie können dies direkt vom Oauth-Zustimmungsbildschirm aus tun, indem Sie auf die Schaltfläche APP VERÖFFENTLICHEN klicken.

klick-veröffentlichen-app

Nachdem Sie auf die Schaltfläche geklickt haben, wird ein Modal mit einigen weiteren Schritten für den Abschluss des App-Verifizierungsprozesses von Google angezeigt. Zum Bestätigen klicken Sie auf BESTÄTIGEN.

Klick-Bestätigung

Berechtigungsnachweise für Ihre Anwendung erstellen

Der nächste Schritt ist die Erstellung von Anmeldeinformationen für Ihre Anwendung. Klicken Sie dazu im Menü auf der linken Seite auf Credentials.

click-credentials

Klicken Sie dann auf CREDENTIALS ERSTELLEN am oberen Rand des Bildschirms Berechtigungsnachweise.

click-credentials-credentials erstellen

Klicken Sie anschließend auf OAuth-Client-ID.

select-oauth-client-id

Klicken Sie anschließend auf die Dropdown-Liste Anwendungstyp und wählen Sie Webanwendung.

select-web-application

Geben Sie anschließend einen Namen für Ihren Oauth 2.0-Client in das Feld Name ein. Dieser Name ist für Endbenutzer nicht sichtbar, Sie können ihn also nach Belieben benennen.

add-name-for-client-id

Blättern Sie dann zum Abschnitt Authorized redirect URIs und klicken Sie auf ADD URI.

Klick-add-uri-Button-1

Nun müssen Sie zurück zu Ihren WPForms-Integrationseinstellungen gehen und die erste Callback-URL kopieren, indem Sie auf das Kopiersymbol klicken.

klick-kopier-ikone-rückruf-url-1

Wechseln Sie dann zurück zu den Einstellungen Ihrer Google-Anwendung und fügen Sie die Callback-URL in das Feld URIs 1 ein.

einfügen-rückruf-url-into-uri-1-feld-1

Danach klicken Sie erneut auf die Schaltfläche ADD URI, um Ihren zweiten URI hinzuzufügen.

Klick-add-uri-Button-2

Wechseln Sie zurück zu Ihren WPForms-Einstellungen und klicken Sie auf das Kopiersymbol neben der 2. Callback-URL.

klick-kopier-ikone-rückruf-url-2

Nun können Sie zurück zu Ihren Google-Einstellungen navigieren und die zweite Callback-URL in das Feld URIs 2 einfügen.

add-second-callback-url

Klicken Sie anschließend auf die Schaltfläche ERSTELLEN.

click-create-button-client-id

Daraufhin wird ein modales Fenster mit Ihren OAuth-Client-Anmeldedaten angezeigt. Kopieren Sie hier die Client-ID, indem Sie auf das Kopiersymbol klicken.

klick-kopier-ikon-client-id

Wechseln Sie dann zu Ihren WPForms-Integrationseinstellungen und fügen Sie die Client-ID in das Feld Google Client-ID ein.

client-id-field

Navigieren Sie dann zurück zu den Einstellungen Ihrer Google-Anwendung und kopieren Sie das Client-Geheimnis.

klick-kopieren-ikon-kundengeheimnis

Wechseln Sie erneut zu Ihren WPForms-Integrationseinstellungen und fügen Sie das Kundengeheimnis in das Feld Google Client Secret ein.

Kundengeheimnis einfügen

Fertigstellung der Verbindung

Nachdem Sie nun Ihre Kunden-ID und Ihr Kundengeheimnis festgelegt haben, ist es an der Zeit, die Verbindung herzustellen. Klicken Sie dazu auf die Schaltfläche Mit Google verbinden.

klick-verbinden-zu-google-sheets-button

Als nächstes werden Sie auf eine Google-Authentifizierungsseite weitergeleitet. Hier müssen Sie WPForms Zugriff auf Ihr Google-Konto gewähren.

Sobald Sie ein Google-Konto ausgewählt haben, klicken Sie auf die Schaltfläche " Weiter", um WPForms Zugriff auf Ihr Konto zu gewähren.

checkboxes-for-google-drive-and-sheets

Wenn Sie nun zu WPForms " Einstellungen " Integrationen zurückkehren, sollten Sie den grünen Status Verbunden zusammen mit Ihren Verbindungsdetails sehen.

google-sheets-connected-status

Sie können nun eine Google Sheets-Integration zu jedem Formular auf Ihrer Website hinzufügen.

Das war's! Jetzt wissen Sie, wie Sie eine benutzerdefinierte Google-App zur Verwendung mit dem WPForms Google Sheets-Addon einrichten können.

Möchten Sie mehr darüber erfahren, was Sie mit den vom Benutzer eingegebenen Informationen in WPForms tun können? In unserem vollständigen Leitfaden zu Formulareinträgen erfahren Sie mehr.

Das beste WordPress Drag and Drop Form Builder Plugin

Einfach, schnell und sicher. Schließen Sie sich über 6 Millionen Website-Besitzer, die WPForms vertrauen.

Bitte aktivieren Sie JavaScript in Ihrem Browser, um dieses Formular auszufüllen.