> Portal Navigation:
> 
> - Append `.md` to any URL under `https://dev.wix.com/docs/` to get its markdown version.
> - Pages are either content pages (article or reference text) or menu pages (a list of links to child pages).
> - To get a menu page, truncate any URL to a parent path and append `.md` (e.g. `https://dev.wix.com/docs/sdk.md`, `https://dev.wix.com/docs/sdk/core-modules.md`).
> - Top-level index of all portals: https://dev.wix.com/docs/llms.txt
> - Full concatenated docs: https://dev.wix.com/docs/llms-full.txt

## Resource: wix-pay-frontend



## Article: Introduction

## Article Link: https://dev.wix.com/docs/velo/apis/wix-pay-frontend/introduction.md

## Article Content:

# Introduction
To process payments on your site, first set up your site to accept payments
 as described in [About Accepting Payments](https://support.wix.com/en/article/about-accepting-payments).
 When setting up your site to accept payments, be sure to select the payment
 methods you want to offer and [set your payment currency](https://support.wix.com/en/article/setting-your-currency-for-accepting-payments). 
You can also set up a list of alternative currencies to display your prices in. Use the [currency objects](wix-pay-frontend.Currencies.html) and the [currency conversion dropdown element](https://support.wix.com/en/article/adding-and-setting-up-a-currency-converter-in-wix-stores) to set up and display product prices in different currencies.

 ### Typical Payment Lifecycle

 The following list outlines the steps taken in a typical payment lifecycle:

 1. A site visitor clicks a button to start the payment process.
 1. The button's event handler calls a backend function.
 1. A `PaymentInfo` object containing information about
    the payment, such as the payment amount, is created in the backend function.
 1. The backend function calls [`createPayment()`](wix-pay-backend/create-payment) using the
    `PaymentInfo` object and returns the generated
    `Payment` object to the calling client-side event handler.
 1. The event handler then calls the [`startPayment()`](wix-pay-frontend/start-payment)
    function with the id from the `Payment` object, which opens
    the payment popup on your site.
 1. The site visitor enters the payment information.
 1. The event handler optionally handles the returned `PaymentResult`.
 1. Handle additional status updates to the payment transaction using the
    [`onPaymentUpdate()`](wix-pay-backend/events/on-payment-update) event.

 To use the Pay API, import `wixPayFrontend` from the `wix-pay-frontend` module:

   ```javascript
   import wixPayFrontend from 'wix-pay-frontend';
   ```

> **Note:**
 To work with the Pay API, you need to save and publish your site.