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

# Kundenbereich

> Kundenbereich

Im Kundenbereich können Kunden eigenständig ihre Rechnungsadressen und Zahlungsmethoden verwalten, Abonnements einsehen, kündigen und Rechnungen herunterladen.

## Erreichbarkeit

Der Kundenbereich ist standardmäßig über die URL `[tenant-username].customerfront.app` erreichbar.

### Eigene Domain

Für den Kundenbereich und Warenkorb kann eine eigene Domain aufgeschaltet werden. Schreibe uns eine kurze E-Mail mit dem Wunsch an [hi@fynn.eu](mailto:hi@fynn.eu).

## Funktionsumfang

### Abonnements

Unter dem Bereich "Abonnements" können Kunden ihre aktiven Abonnements einsehen, kündigen und Kündigungen widerrufen.
Zudem sind Vertragsdetails wie Vertragsbeginn, Vertragsende und der nächste Rechnungsbetrag einsehbar.

<Frame>
  <img src="https://mintcdn.com/fynnsubscriptionbilling/tzBoVhlU_naKbmRt/images/customer-area-subscription-section.png?fit=max&auto=format&n=tzBoVhlU_naKbmRt&q=85&s=ee2351af712742c379907e4b0c8f7966" alt="Kundenbereich - Abonnements" width="759" height="308" data-path="images/customer-area-subscription-section.png" />
</Frame>

## Rechnungsadressen

Unter dem Bereich "Rechnungsadresse" können Kunden eine Standard-Rechnungsadresse hinterlegen, die für alle zukünftigen Abonnements und Rechnungen verwendet wird.
Alternativ kann eine neue Rechnungsadresse hinterlegt werden.

<Frame>
  <img src="https://mintcdn.com/fynnsubscriptionbilling/iVIPUuF_nH0B0-xL/images/customer-area-invoice-addresses.png?fit=max&auto=format&n=iVIPUuF_nH0B0-xL&q=85&s=a39ed0f5697b9de1385baa9643b289c8" alt="Kundenbereich - Rechnungsadressen" width="761" height="399" data-path="images/customer-area-invoice-addresses.png" />
</Frame>

## Zahlungsmethoden

Unter dem Bereich "Zahlungsmethoden" können Kunden eine Standard-Zahlungsmethode hinterlegen, die für alle zukünftigen Abonnements und Rechnungen verwendet wird.
Alternativ kann eine neue Zahlungsmethode hinterlegt werden.

<Frame>
  <img src="https://mintcdn.com/fynnsubscriptionbilling/tzBoVhlU_naKbmRt/images/customer-area-payment-methods.png?fit=max&auto=format&n=tzBoVhlU_naKbmRt&q=85&s=e989486cb5196f17cfe0ccd9a0858d3b" alt="Kundenbereich - Zahlungsmethoden" width="756" height="318" data-path="images/customer-area-payment-methods.png" />
</Frame>

## Rechnungen

Unter dem Bereich "Rechnungen" können Kunden alle Rechnungen einsehen und herunterladen.

<Frame>
  <img src="https://mintcdn.com/fynnsubscriptionbilling/tzBoVhlU_naKbmRt/images/customer-area-invoices.png?fit=max&auto=format&n=tzBoVhlU_naKbmRt&q=85&s=a40541c0b85de4e72d1d2a6bdc3346d1" alt="Kundenbereich - Rechnungen" width="752" height="416" data-path="images/customer-area-invoices.png" />
</Frame>

## Persönlicher Ansprechpartner

Unter dem Bereich "Persönlicher Ansprechpartner" können Kunden ihren persönlichen Ansprechpartner einsehen.
Dieser ist unter [Persönlicher Ansprechpartner hinterlegen](/guide/customers/introduction#persönlicher-ansprechpartner-hinterlegen) einstellbar.

<Frame>
  <img src="https://mintcdn.com/fynnsubscriptionbilling/tzBoVhlU_naKbmRt/images/customer-area-personal-contact.png?fit=max&auto=format&n=tzBoVhlU_naKbmRt&q=85&s=30b02bdd22384062355680bb70944b37" alt="Kundenbereich - Persönlicher Ansprechpartner" width="314" height="97" data-path="images/customer-area-personal-contact.png" />
</Frame>

## Link zum Kundenbereich erstellen

Um Kunden authentifiziert in den Kundenbereich zu leiten, kann ein personalisierter Link erstellt werden.

<Tabs>
  <Tab title="Web-App verwenden">
    <Steps>
      <Step title="Link erstellen">
        Klicke auf "Kunden" in der linken Navigation und wähle den Kunden aus, für den du einen authentifizierten Link erstellen möchtest.

        Klicke oben rechts auf die drei Punkte und wähle "Kundenbereich-Link erstellen" aus.
      </Step>

      <Step title="Link erfolgreich erstellt">
        Der Link wurde erfolgreich erstellt und wurde in die Zwischenablage kopiert. Du kannst den Link nun an den Kunden weiterleiten.
      </Step>
    </Steps>
  </Tab>

  <Tab title="API verwenden">
    Um einen Link zum Kundenbereich zu erstellen, kann die API verwendet werden.

    ```bash theme={null}
    POST /customers/{customerId}/authenticate
    ```

    Als Antwort wird eine URL zurückgegeben, die den Kunden authentifiziert in den Kundenbereich leitet.
    Den Access- & Refresh-Token kannst du andernfalls für die API Authentifierung verwenden, um eigene Anfragen an die API zu stellen.

    ```json theme={null}
    {
        "data": {
            "customerAreaLink": "https://[tenant-username].customerfront.app/customer-area/login?token=abc",
            "accessToken": "eyxxxxxx",
            "refreshToken": "eyxxxxxx"
        }
    }
    ```

    [Zur API-Dokumentation](/api-reference/customer/authenticate-customer)
  </Tab>
</Tabs>

## Login-E-Mail an Kunden senden

Du kannst Kunden eine E-Mail mit einem Login-Link senden, über den sie direkt in ihren Kundenbereich gelangen – ohne Passwort oder Code eingeben zu müssen.

<Tabs>
  <Tab title="Web-App verwenden">
    <Steps>
      <Step title="Kunde auswählen">
        Klicke auf "Kunden" in der linken Navigation und wähle den Kunden aus.
      </Step>

      <Step title="Login-E-Mail senden">
        Klicke oben rechts auf die drei Punkte und wähle "Login-E-Mail senden" aus.

        Der Kunde erhält eine E-Mail mit einem Link, über den er sich direkt einloggen kann.
      </Step>
    </Steps>
  </Tab>

  <Tab title="API verwenden">
    ```bash theme={null}
    POST /customers/{customerId}/send-login-email
    ```

    Der Kunde erhält eine E-Mail mit einem Login-Link zum Kundenbereich.

    [Zur API-Dokumentation](/api-reference/customer/send-login-email)
  </Tab>
</Tabs>

<Tip>
  Diese Funktion ist besonders nützlich für Support-Anfragen oder um Kunden beim Zugang zu ihrem Kundenbereich zu helfen.
</Tip>

## Kundenbereich anpassen

Im Kundenbereich können einzelne Bereiche oder Funktionen angepasst werden. Hierzu gehören:

* Ansprechpartner anzeigen
* Rechnungen anzeigen
* Rechnungsadresse verwalten
* Zahlungsmethoden verwalten
* Abonnements einsehen
* Abonnements kündigen
* Verhalten bei Kündigung während Testphase

Die Einstellungen findest du unter "Einstellungen" > "Hosted Pages".

<Frame>
  <img src="https://mintcdn.com/fynnsubscriptionbilling/tzBoVhlU_naKbmRt/images/customerArea/settings.png?fit=max&auto=format&n=tzBoVhlU_naKbmRt&q=85&s=293c2714f50573ded4a1e854982c5ec7" alt="Kundenbereich - Anpassungen" width="1169" height="862" data-path="images/customerArea/settings.png" />
</Frame>

### Verhalten bei Kündigung während Testphase

Wenn ein Kunde ein Abonnement während der Testphase kündigt, kann das Verhalten des Kündigungszeitpunktes festgelegt werden.

Folgende Optionen stehen zur Verfügung:

* **Abonnement zum Zeitpunkt der Kündigung beenden**: Das Abonnement wird sofort gekündigt, auch wenn die Testphase noch nicht abgelaufen ist.
* **Abonnement zum Ende der Testphase beenden**: Das Abonnement wird zum Ende der Testphase beendet, die Küdigung wird vorgemerkt.

<Tip>
  Die Einstellungen gelten für alle Kunden, die über den Kundenbereich kündigen.
</Tip>

<Info>
  Diese Einstellung ist für die Wallet nicht relevant, da bei Kündigung durch einen Mitarbeiter der Kündigungszeitpunkt manuell festgelegt wird.
</Info>

## Zahlungsmethode hinzufügen per Link

Um Kunden die Möglichkeit zu geben, eine Zahlungsmethode per Link hinzuzufügen, kann ein personalisierter Link erstellt und optional per E-Mail versendet werden.

Der Kunde kann anschließend auswählen, ob die Zahlungsmethode für bestehende und zukünftige Abonnements verwendet werden soll.
Zudem wird die Zahlungsmethode für offene Rechnungen verwendet, sofern die letzte Zahlung nicht erfolgreich war.

<Check>
  Die Zahlungsmethode wird automatisch als Standard-Zahlungsmethode hinterlegt.
</Check>

<Tabs>
  <Tab title="Web-App verwenden">
    <Steps>
      <Step title="Link erstellen">
        Klicke auf "Kunden" in der linken Navigation und wähle den Kunden aus, für den du einen Link erstellen möchtest.

        Klicke oben rechts auf die drei Punkte und wähle "Zahlungsmethode hinzufügen" aus.
        Wähle die Zahlungsmethoden aus, die der Kunde hinzufügen kann und ob eine E-Mail versendet werden soll.

        Klicke auf "Link erstellen".

        <Frame>
          <img src="https://mintcdn.com/fynnsubscriptionbilling/tzBoVhlU_naKbmRt/images/customers/payment-method-send-link.png?fit=max&auto=format&n=tzBoVhlU_naKbmRt&q=85&s=be7eb3c8db72d6ee7eacbb412bbe7a18" alt="Zahlungsmethode hinzufügen" width="716" height="351" data-path="images/customers/payment-method-send-link.png" />
        </Frame>
      </Step>

      <Step title="Link erfolgreich erstellt">
        Der Link wurde erfolgreich erstellt und wurde in die Zwischenablage kopiert. Du kannst den Link nun an den Kunden weiterleiten.
      </Step>
    </Steps>
  </Tab>

  <Tab title="API verwenden">
    Um einen Link zum Hinzufügen einer Zahlungsmethode zu erstellen, kann die API verwendet werden.

    ```bash theme={null}
    POST /payment-methods/link
    ```

    [Weitere Informationen zur API](/api-reference/paymentmethod/create-payment-method-link)
  </Tab>
</Tabs>