Collect Payments for a Single Product

More Examples

Collect quick and secure payments from your site visitors.

Play with the example below to see what you can do:

Open this example as a template so you can see how everything works in the Editor. 

Before You Start

Before you start working with the Wix Pay API, make sure you do the following:

  • Apply all necessary security precautions for working with payments in code. Specifically, make sure to always define payment information in the backend.

  • Set up accepted payment methods on your site. We also recommend that you understand the typical payment process before proceeding.

What We Built

On the Pay API page, we displayed a single product for sale. Product and pricing information is defined in the code. Site visitors can pay for the product using a payment system based on the Wix Code Pay API.

How It Works

We displayed a product for sale and added a payment button. When a visitor clicks the button, the BE_PayAPI.jsw backend module is called, and the Wix Pay createPayment() function creates a payment info object with a unique payment ID.

 

The Wix Pay startPayment() function runs in the client-side with the payment ID, opening a payment popup. The visitor enters payment information and completes the transaction.

Next Steps

  1. Open this example in the Editor to work with the template.

  2. Publish the site.

  3. Learn how to work with examples in Corvid.

Example Code

arrow&v

Example Demonstrates

wix-pay API

Web Modules

Coding with Dropdown

More Resources

To start using Corvid:  Go to the Wix Editor > Dev Mode > Turn on Dev Mode