{% hint style="info" %}
The Stripe Payment element requires at-least one connection to an active Stripe account. For more information please click [here](/app-editor/connections/services/stripe.md).
{% endhint %}
The **`Stripe Payment`** element provides a turn-key solution to accept payments inside your app.
The Stripe Payment is a widget element with the following characteristics:
* It exhibits content dynamically upon page load. Within the page editor, it will showcase a placeholder that denotes the designated content area. To preview the element's appearance on your page, utilize the [Page Preview](/app-editor/page-editor/page-preview.md) feature.
* It will span the entire width of their parent element horizontally.
The Stripe Payment element uses the [Test Mode keys](/app-editor/connections/services/stripe.md#test-mode-publishable-key) when you preview the page and uses the [Live Mode keys](/app-editor/connections/services/stripe.md#live-mode-publishable-key) when your page is normally loaded by your app's users.
The information about successful payments are posted to the [Stripe service](/app-editor/connections/services/stripe.md) Connection Data.
***
## Example
The image below shows a stripe payment element placed inside in the right layout column. For demonstration the left layout column is styled with a green dashed border, and the right layout column is styled with a red dashed border.
In the page editor, the stripe payment element is rendered with a place holder as shown below.
Example showing Stripe Payment placeholder in the page editor.
When the page is previewed or loaded by the user, the stripe payment element is rendered as shown below.
Example showing Stripe Payment element when the page is loaded
***
## Options
The [Options tab](/app-editor/page-editor/page-element-settings.md#options-tab) settings for this element are described below:
### `Stripe Connection`
Select the Stripe service connection you want to use for the element.
### `Sendgrid Connection for Email`
This is an optional setting. If you want the customer to receive a payment receipt email from your app, select the Sendgrid service connection here.
### `Require Shipping Address`
Turn this ON if you want the stripe payment element to ask the user for their address.
Stripe Payment: Require Address
### `Email Payment Receipt to Customer`
Turn this ON if you want the customer to receive a payment receipt email from your app. This works in conjunction with the [Sendgrid Connection for Email](#sendgrid-connection-for-email) setting.
### `Email Notification`
Turn this ON if you want a payment notification email to be sent to the address set in the [Notification Address](#notification-address) setting.
### `Notification Address`
Specify the email address you want the payment notification to be sent to.
### `Amount`
Provide the amount you want to charge using the payment element. If you need to calculate the amount dynamically when the user is using the app, enter 0 and use [Page Flow](/app-editor/page-flow.md) to set this value.
---
# Agent Instructions: Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.
Perform an HTTP GET request on the current page URL with the `ask` query parameter:
```
GET https://docs.zingy.ai/app-editor/page-editor/built-in-elements/stripe-payment.md?ask=
```
The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.
Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.