# Gravity Forms

## Allgemein

Gravity Forms ist ein WordPress-Plugin zur Erstellung von Formularen. Mit Gravity Forms können Nutzer auch ohne Programmierkenntnisse Kontaktformulare, Umfragen und Anmeldeformulare erstellen.

Mit dem von der Agentur cloudWEB entwickelten Plugin lässt sich Payrexx nahtlos in Gravity Forms integrieren. So ermöglichst Du Deinen Kunden direkte Zahlungen über die in Gravity Forms erstellten Formulare.

### Links

* [Webseite](https://www.gravityforms.com/) von Gravity Forms
* [Plugin](https://cldwb.ch/JtckIt) von Gravity Forms
* [Dokumentation](https://docs.gravityforms.com/) von Gravity Forms
* [Registrierung](https://www.gravityforms.com/registration/) bei Gravity Forms
* [Login](https://www.gravityforms.com/wp-login.php) bei Gravity Forms
* Download des [Payrexx Add-On for Gravity Forms](https://www.thenextstep.ch/extensions-uploads/payrexx-add-on-for-gravity-forms/payrexx-add-on-for-gravity-forms.zip)
* Webseite des Plugin-Entwicklers [cloudWEB](https://www.cloudweb.ch/)

### Funktionen

* ✅ Kaufabschluss im Formular von Gravity Forms
* ✅ Look & Feel Konfiguration der Bezahlseite
* ✅ Übertragung der Zahlungs- und Käuferdaten in Payrexx
* ✅ Abgleich der Bestellstatus zwischen Gravity Forms und Payrexx

{% hint style="info" %}
Bitte beachte, dass die Integration in Gravity Forms nur in den Preisplänen "Standard" und "Premium" verfügbar ist. [Weitere Informationen](https://payrexx.com/de-ch/preise)
{% endhint %}

## Integration

Führe die folgenden Schritte durch, um Payrexx in Gravity Forms zu integrieren.

### Konfiguration von Payrexx

{% hint style="info" %}
Bitte beachte, dass Du bei Payrexx [eingeloggt](https://login.payrexx.com/de) sein musst, bevor Du beginnst. Falls Du noch kein Konto hast, [registriere](https://signup.payrexx.com/de/email-validation/) Dich bitte bei Payrexx.
{% endhint %}

* Navigiere in der Händler-Administration Deines Payrexx-Kontos zu **API und Integrationen**.
* Klicke auf "API-Schlüssel hinzufügen":

<div align="left"><figure><img src="https://3244062149-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MYJhU4qriZCz_Wxs0T0-543259558%2Fuploads%2Fxx6LkMBojKkTmUxpBYvg%2Fimage.png?alt=media&#x26;token=a58cf246-b8b7-4304-a42f-3151546f5e2a" alt=""><figcaption><p>Start der Einrichtung eines API-Schlüssels in Payrexx</p></figcaption></figure></div>

* Gib der Integration einen beliebigen Namen und klicke auf die grüne Schaltfläche "Hinzufügen":

<div align="left"><figure><img src="https://3244062149-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MYJhU4qriZCz_Wxs0T0-543259558%2Fuploads%2FoFOFwbtbe9CzliTO9GUI%2Fimage.png?alt=media&#x26;token=b2e9d473-0f10-4042-95f8-d4595a72db88" alt=""><figcaption><p>Erstellen des API-Schlüssels für Gravity Forms</p></figcaption></figure></div>

* Kopiere den API-Schlüssel in die Zwischenablage, da Du ihn später in Gravity Forms benötigen wirst:

<div align="left"><figure><img src="https://3244062149-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MYJhU4qriZCz_Wxs0T0-543259558%2Fuploads%2FHVvxSG3dHrQyqTjhPPl4%2Fimage.png?alt=media&#x26;token=121241aa-5e1f-43ad-b1c7-23459e4a6b80" alt=""><figcaption><p>Kopieren des API-Schlüssels in die Zwischenablage</p></figcaption></figure></div>

### Konfiguration von Gravity Forms

* Logge Dich in Dein WordPress-Konto ein.
* Installiere das Plugin von Gravity Forms.
* Aktiviere die Lizenz für das Plugin von Gravity Forms.
* Installiere und aktiviere das [Payrexx Add-On for Gravity Forms](https://www.thenextstep.ch/extensions-uploads/payrexx-add-on-for-gravity-forms/payrexx-add-on-for-gravity-forms.zip).

<div align="left"><figure><img src="https://3244062149-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MYJhU4qriZCz_Wxs0T0-543259558%2Fuploads%2FyIT18wzNCZdOg0iwCu2L%2Fimage.png?alt=media&#x26;token=1179d612-8d36-4729-98b5-a597a4b2aa13" alt=""><figcaption><p>Ansicht aus WordPress mit den installierten und aktivierten Plugins</p></figcaption></figure></div>

## Erstellen eines Formulars

{% hint style="info" %}
Weitere Informationen und eine detaillierte Anleitung zur Erstellung von Formularen findest Du auf der Webseite von [Gravity Forms](https://www.gravityforms.com/get-started-create-embed-form/).
{% endhint %}

Führe die folgenden Schritte durch, um mit Gravity Forms ein Formular zu erstellen und die Zahlungslösung von Payrexx zu integrieren.

* Navigiere im Hauptmenü Deines WordPress-Kontos zu **Forms > New Form**.
* Wähle "Blank Form" als Art des Templates:

<div align="left"><figure><img src="https://3244062149-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MYJhU4qriZCz_Wxs0T0-543259558%2Fuploads%2FvzV6aGK3EJPDEPmxyzS9%2Fimage.png?alt=media&#x26;token=44622149-ee22-4b1c-aa38-7aed0bd494bf" alt=""><figcaption><p>Erstellen eines neuen Formulars vom Typ "Blank Form" in Gravity Forms</p></figcaption></figure></div>

* Wähle für das Formular einen Titel sowie optional eine Beschreibung und klicke auf die Schaltfläche "Create Blank Form":

<div align="left"><figure><img src="https://3244062149-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MYJhU4qriZCz_Wxs0T0-543259558%2Fuploads%2Fan8rheukzBbw5xbzxR2H%2Fimage.png?alt=media&#x26;token=72d7d121-6b41-4a0e-96d2-dc665606ace2" alt=""><figcaption><p>Erfassen von Titel und Beschreibung und Erstellen des Formulars</p></figcaption></figure></div>

* Integriere mittels Drag & Drop mindestens die folgenden Felder ins Formular:

<div align="left"><figure><img src="https://3244062149-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MYJhU4qriZCz_Wxs0T0-543259558%2Fuploads%2FOaiF4cHJitO1fiiZx06y%2Fimage.png?alt=media&#x26;token=c35cbe0c-9b94-49d3-9565-4ccdb55e96f3" alt=""><figcaption><p>Erstellen der Formularfelder in Gravity Forms</p></figcaption></figure></div>

1. Name (Gruppe: Standard Fields, Typ: Single Line Text)
2. Vorname (Gruppe: Standard Fields, Typ: Single Line Text)
3. E-Mail (Gruppe: Advanced Fields, Typ: Email)
4. Produkt (Gruppe: Pricing Fields, Typ: Product)
5. Total (Gruppe: Pricing Fields, Typ: Total)
6. Payrexx (Gruppe: Pricing Fields, Typ: Payrexx)

{% hint style="info" %}
Bitte stelle sicher, dass Du im Feld "Produkt" einen Betrag definierst, der grösser als 0.00 ist.
{% endhint %}

* Bewege den Mauszeiger über "Settings" und klicke auf "Payrexx":

<div align="left"><figure><img src="https://3244062149-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MYJhU4qriZCz_Wxs0T0-543259558%2Fuploads%2FndlvcA9YjNow7ERvGT2L%2Fimage.png?alt=media&#x26;token=7cd3b46d-78a8-46b4-9672-888f7c2d0ea7" alt=""><figcaption><p>Öffnen der Payrexx-Feeds in Gravity Forms</p></figcaption></figure></div>

* Klicke bei den Payrexx Feeds auf "Add New":

<div align="left"><figure><img src="https://3244062149-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MYJhU4qriZCz_Wxs0T0-543259558%2Fuploads%2Foa6LOm26gR9MgnY75YNL%2Fimage.png?alt=media&#x26;token=6e070c57-cd1a-4c9a-ba8f-d716b6d72302" alt=""><figcaption><p>Hinzufügen eines Feeds in Gravity Forms</p></figcaption></figure></div>

* Wähle für die Integration einen Namen (1) und wähle bei "Transaction Type" die Option "Products and Services".

<figure><img src="https://3244062149-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MYJhU4qriZCz_Wxs0T0-543259558%2Fuploads%2Fa9upQIbHZO4zSSADj4k3%2Fimage.png?alt=media&#x26;token=197b3816-6331-4881-8b0f-c8cc6a254c0e" alt=""><figcaption><p>Konfiguration des Feeds in Gravity Forms</p></figcaption></figure>

Nach der Auswahl von "Products and Services" werden nun weitere Felder angezeigt.

* Stelle sicher, dass im Feld "Payment Amount" die Option "Form Total" ausgewählt ist.

<div align="left"><figure><img src="https://3244062149-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MYJhU4qriZCz_Wxs0T0-543259558%2Fuploads%2FtZxJAWqZ6Z2dcPnb51qL%2Fimage.png?alt=media&#x26;token=558c59d0-c4e3-4594-82ec-238569c9064f" alt=""><figcaption><p>Konfiguration des Feldes für den Totalbetrag</p></figcaption></figure></div>

* Konfiguriere die Felder anhand der folgenden Abbildung:

<div align="left"><figure><img src="https://3244062149-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MYJhU4qriZCz_Wxs0T0-543259558%2Fuploads%2FnWE9bJjaJ8zYNfHtxBtx%2Fimage.png?alt=media&#x26;token=1accdae2-7cf9-43cd-adb7-8ab6d0a9da6b" alt=""><figcaption><p>Konfiguration der Verbindung mit Payrexx</p></figcaption></figure></div>

1. **API Key:** Füge den API-Schlüssel ein, den Du bei der [Einrichtung von Payrexx](#konfiguration-von-payrexx) in die Zwischenablage kopiert hast.
2. **Instance name:** Erfasse den Instanznamen Deines Payrexx-Kontos. Wenn die URL Deines Kontos *beispiel*.payrexx.com lautet, so ist Dein Instanzname *beispiel*.
3. **Vat Rate:** Erfasse den gültigen Mehrwertsteuersatz des Landes, in dem sich Deine Kunden befinden.
4. **Currency:** Wähle die bevorzugte Währung aus.
5. **Success confirmation:** Wähle, welche Bestätigung nach einer erfolgreichen Zahlung verschickt werden soll.

* Weise den Feldern, die Du erstellt hast, das entsprechende "Form Field" zu:

<div align="left"><figure><img src="https://3244062149-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MYJhU4qriZCz_Wxs0T0-543259558%2Fuploads%2FRCNz8Yk6J0iUZM7uWoeZ%2Fimage.png?alt=media&#x26;token=24f16ff8-7b4b-4ef5-a19f-035e155efa5e" alt=""><figcaption><p>Zuweisung der Felder</p></figcaption></figure></div>

* Schliesse die Konfiguration ab, indem Du ganz unten auf der Seite auf "Save Settings" klickst.

{% hint style="success" %}
Die Konfiguration des Formulars und die Verbindung mit Payrexx sind somit abgeschlossen.
{% endhint %}

## Einbinden des Formulars in die Webseite

In der folgenden Anleitung erfährst Du, wie Du das Formular in Deine Webseite integrieren kannst:

{% embed url="<https://docs.gravityforms.com/category/getting-started/add-form-to-site/>" %}

## Support

Solltest Du Fragen zur Integration von Gravity Forms in Payrexx haben, steht Dir unser Support-Team gerne zur Verfügung:

{% content-ref url="../../support/support-portal" %}
[support-portal](https://docs.payrexx.com/merchant/support/support-portal)
{% endcontent-ref %}

Falls Du Fragen zur Erstellung von Formularen hast, nutze bitte die folgende Dokumentation oder wende Dich an den Support von Gravity Forms:

{% embed url="<https://docs.gravityforms.com/>" %}

{% embed url="<https://www.gravityforms.com/open-support-ticket/>" %}