# Eine integrierbare Kaufschaltfläche erstellen Verwenden Sie Payment Links, um eine integrierbare Kaufschaltfläche für Ihre Website zu erstellen. Erstellen Sie eine integrierbare Kaufschaltfläche, um ein Produkt oder ein Abonnement zu verkaufen oder eine Zahlung auf Ihrer Website zu akzeptieren. Beginnen Sie mit der Auswahl eines bestehenden Links aus der [Listenansicht von Payment Links](https://dashboard.stripe.com/payment-links) oder mit der [Erstellung eines neuen Links](https://dashboard.stripe.com/payment-links/create), wobei Sie entscheiden können, welche Produkte verkauft werden sollen, und die Nutzeroberfläche für den Bezahlvorgang personalisieren können. Nachdem Sie Ihren Link erstellt haben, klicken Sie auf die **Kaufschaltfläche**, um das Design der Kaufschaltfläche zu konfigurieren und den Code zu generieren, den Sie kopieren und in Ihre Website einfügen können. ## Schaltfläche anpassen Standardmäßig wird für Ihre „Kaufen“-Schaltfläche das gleiche Branding und der gleiche Aktionsaufruf verwendet, die Sie für Ihren Zahlungslink konfiguriert haben. Sie können: - Wählen Sie zwischen einer einfachen Schaltfläche und einem Karten-Widget. - Passen Sie Markenfarben, Formen und Schriftarten an Ihre Website an. - Legen Sie die Sprache der Schaltfläche und der Zahlungsseite so fest, dass sie mit der Sprache Ihrer Website übereinstimmt. - Passen Sie den Aktionsaufruf Ihrer Schaltfläche an. ![Passen Sie die Schaltfläche "Kaufen" an](https://b.stripecdn.com/docs-statics-srv/assets/buy-button-card-layout.4003c3e9ffe3ce4378092dbdcd456ed9.png) Passen Sie die Schaltfläche “Kaufen” an ## Schaltfläche einbetten Stripe stellt einen Einbettungscode bereit, der aus einem ` ``` ## Attribute zum Anpassen des Checkouts | Parameter | Beschreibung | Syntax | | -------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | `client-reference-id` | Verwenden Sie die `client-reference-id`, um eine eindeutige Zeichenfolge Ihrer Wahl an die `CheckoutSession` anzuhängen. Bei der Zeichenfolge kann es sich um eine Kunden-ID oder eine Warenkorb-ID (o. ä.) handeln, die Sie zum Abgleichen der `CheckoutSession` mit Ihren internen Systemen verwenden. Wenn Sie diesen Parameter an Ihre `` übergeben, wird er nach Abschluss der Zahlung im [Checkout.session.completed-Webhook](https://docs.stripe.com/api/events/types.md#event_types-checkout.session.completed) gesendet. | Die `client-reference-id` kann alpanumerische Zeichen, Bindestriche oder Unterstriche enthalten und bis zu 200 Zeichen umfassen. Ungültige Werte werden ignoriert, aber Ihre Zahlungsseite funktioniert weiterhin erwartungsgemäß. | | `customer-email` | Verwenden Sie `customer-email`, um die E-Mail-Adresse auf der Bezahlseite vorab auszufüllen. Wenn die Eigenschaft festgelegt ist, übergibt die Kaufschaltfläche sie an das `customer_email`-Attribut der `CheckoutSession`. Kundinnen und Kunden können die E-Mail-Adresse auf der Bezahlseite nicht bearbeiten. | Die `customer-email` muss eine gültige E-Mail-Adresse sein. Ungültige Werte werden im Hintergrund gelöscht, Ihre Zahlungsseite funktioniert jedoch weiterhin wie erwartet. | | `customer-session-client-secret` | Verwenden Sie `customer-session-client-secret`, um [eine bestehende Kundin/einen bestehenden Kunden](https://docs.stripe.com/payment-links/buy-button.md#pass-an-existing-customer) zu übergeben. | Der Wert für `customer-session-client-secret`muss aus dem [client_secret](https://docs.stripe.com/api/customer_sessions/object.md#customer_session_object-client_secret) generiert werden. | ## Vorhandene/n Kundin/Kunden übergeben > #### Verwenden Sie die Accounts v2 API zum Darstellen von Kundinnen und Kunden > > The Accounts v2 API is generally available for Connect users, and in public preview for other Stripe users. If you’re part of the Accounts v2 preview, you need to specify a [specify a preview version](https://docs.stripe.com/api-v2-overview.md#sdk-and-api-versioning) in your code. > > To request access to the Accounts v2 preview, > > Für die meisten Anwendungsfälle empfehlen wir, [Ihre Kundinnen und Kunden als vom Kunden bzw. von der Kundin konfigurierte Account-Objekte abzubilden](https://docs.stripe.com/connect/use-accounts-as-customers.md), anstatt das [Kundenobjekt](https://docs.stripe.com/api/customers.md) zu verwenden. #### Accounts v2 Sie können ein bestehendes [kundenkonfiguriertes Konto](https://docs.stripe.com/api/v2/core/accounts/object.md#v2_account_object-configuration-customer) für `CheckoutSessions` bereitstellen, die über die Schaltfläche „Kaufen“ erstellt wurden. Authentifizieren Sie die Kundin/den Kunden auf dem Server, erstellen Sie dann eine `CustomerSession` für sie/ihn und geben Sie das [client_secret](https://docs.stripe.com/api/customer_sessions/object.md#customer_session_object-client_secret) an den Client zurück. ```curl curl https://api.stripe.com/v1/customer_sessions \ -u "<>:" \ -d "customer_account={{CUSTOMERACCOUNT_ID}}" \ -d "components[buy_button][enabled]=true" ``` #### Customer v1 Sie können ein vorhandenes [Kunden](https://docs.stripe.com/api/customers.md)-Objekt für `CheckoutSessions` bereitstellen, die über die Schaltfläche „Kaufen“ erstellt wurden. Erstellen Sie eine Kundin/einen Kunden auf dem Server, erstellen Sie dann eine `CustomerSession` für sie/ihn und geben Sie das [client_secret](https://docs.stripe.com/api/customer_sessions/object.md#customer_session_object-client_secret) an den Client zurück. ```curl curl https://api.stripe.com/v1/customer_sessions \ -u "<>:" \ -d "customer={{CUSTOMER_ID}}" \ -d "components[buy_button][enabled]=true" ``` Legen Sie das Attribut `customer-session-client-secret` in der ``-Webkomponente auf das [Client_Geheimnis](https://docs.stripe.com/api/customer_sessions/object.md#customer_session_object-client_secret) aus der CustomerSession fest. Sie müssen das [client_secret](https://docs.stripe.com/api/customer_sessions/object.md#customer_session_object-client_secret) innerhalb von 30 Minuten angeben. Nachdem Sie das Client-Geheimnis angegeben haben, haben Sie weitere 30 Minuten Zeit, bis die `CustomerSession` abläuft. Nach Ablauf kann die Schaltfläche „Kaufen“ keine `CheckoutSessions` mehr erstellen. Speichern Sie das Client-Geheimnis nicht im Zwischenspeicher. Generieren Sie stattdessen jedes Mal ein neues, wenn Sie eine Kaufschaltfläche rendern. #### HTML ```html ``` ## Sicherheitsrichtlinien für Inhalte Wenn Sie eine [Inhaltssicherheitsrichtlinie](https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP) bereitgestellt haben, sind für die Schaltfläche “Kaufen” die folgenden Richtlinien erforderlich: - frame-src, https://js.stripe.com - script-src, https://js.stripe.com ## Beschränkungen Damit die Kaufschaltfläche gerendert werden kann, ist eine Website-Domain erforderlich. Um die Kaufschaltfläche lokal zu testen, führen Sie einen lokalen HTTP-Server aus, um die Datei `index.html` Ihrer Website über die localhost-Domain zu hosten. Um einen lokalen HTTP-Server auszuführen, verwenden Sie den Python-Server [SimpleHTTPServer](https://developer.mozilla.org/en-US/docs/Learn/Common_questions/set_up_a_local_testing_server#running_a_simple_local_http_server) oder das npm-Modul des [http-server](https://www.npmjs.com/package/http-server). ## Zahlungen nachverfolgen Nachdem Ihre Kundin/Ihr Kunde eine Zahlung über einen Zahlungslink getätigt hat, sehen Sie diese in der [Zahlungsübersicht](https://dashboard.stripe.com/payments) im Dashboard. Wenn Sie neu bei Stripe sind, erhalten Sie nach Ihrer ersten Zahlung eine E-Mail. Um E-Mails für erfolgreiche Zahlungen zu erhalten, aktualisieren Sie Ihre Benachrichtigungseinstellungen in den Einstellungen für [persönliche Daten](https://dashboard.stripe.com/settings/user). Wenn Sie ein Abo verkaufen oder [eine Zahlungsmethode für die zukünftige Verwendung speichern](https://docs.stripe.com/payment-links/customize.md#save-payment-details-for-future-use) und keine bestehende Kundin/keinen Kunden angeben, wird durch den Bezahlvorgang eine neue [Kundin/ein neuer Kunde](https://docs.stripe.com/api/checkout/sessions/create.md#create_checkout_session-customer_creation) erstellt. Für einmalige Zahlungen wird stattdessen für den Bezahlvorgang eine [Gastkundin/ein Gastkunde](https://docs.stripe.com/payments/checkout/guest-customers.md) verwendet. Erfahren Sie mehr über die Verarbeitung von [Zahlungslinks nach der Zahlung](https://docs.stripe.com/payment-links/post-payment.md), zum Beispiel wie Sie das Verhalten nach der Zahlung für eine Kaufschaltfläche oder einen Zahlungslink konfigurieren.