# Collecting Payments

Once you have obtained a payment token through the API endpoint, you can initiate the payment process on your platform. This guide will walk you through the steps to collect payments using the token, showcasing both iframe and standalone page approaches.

### Integration Methods

#### Using an Iframe

To integrate PayPangea's payment process within your application seamlessly, you can use an iframe. This method provides a cohesive user experience, keeping the user within your application environment throughout the payment process.

Steps:

* **Embed the Iframe**: Insert an iframe into your HTML, setting its `src` attribute to `https://paypangea.com/request/paysdk/?tkn=${TOKEN}`, where `${TOKEN}` is the payment token you obtained from the API.

```html
<iframe src="https://paypangea.com/request/paysdk/?tkn=${TOKEN}" width="600" height="400"></iframe>
```

* **Listen for Iframe Events**: PayPangea's iframe integration emits several events that you can listen to for managing the payment flow:
  * `PAYPANGEA_WIDGET_CLOSE`: Triggered when the payment widget is closed.
  * `PAYPANGEA_WIDGET_OPEN`: Triggered when the payment widget is opened.
  * `PAYPANGEA_WIDGET_CLOSE_REQUEST`: Emitted when a request to close the widget is made. This is crucial for detecting the end of a payment process.
  * `PAYPANGEA_WIDGET_INITIALISED`: Indicates that the widget has been initialized and is ready to use.
* **Handling Payment Confirmation**: Monitor the `PAYPANGEA_WIDGET_CLOSE_REQUEST` event for `event.data.outcome = 'SUCCESS'` to confirm a successful payment.

```javascript
window.addEventListener('message', (event) => {
    if (event.data.type === 'PAYPANGEA_WIDGET_CLOSE_REQUEST' && event.data.outcome === 'SUCCESS') {
        // Handle successful payment
    }
});
```

#### Standalone Page

Alternatively, you can redirect users to a standalone payment page hosted by PayPangea. This method is straightforward and does not require embedding within your site.

Steps:

* **Redirect to PayPangea**: Redirect users to `https://paypangea.com?tkn=${TOKEN}` for payment. Ensure the user's browser navigates to this URL, where `${TOKEN}` is your obtained payment token.
* **Set a Redirect URL** (Optional): If you prefer to redirect users back to your site upon completion, specify a redirect URL during the token generation step in the API. PayPangea will redirect users to this URL after the payment process, allowing you to handle post-payment actions on your site.


---

# 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.paypangea.com/crypto-payments/api-integration/collecting-payments.md?ask=<question>
```

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.