Skip to main content

Pricing Page

Overview

The Pricing page allows users to choose and purchase subscription plans for your service. This page integrates with Paddle for handling payment processing and subscription management.

Paddle Loader Component

The PaddleLoader component is responsible for loading the Paddle script and initializing the Paddle environment and vendor settings.

Purchase Buttons

The purchase buttons allow users to select and purchase subscription plans. These buttons call the handleBuy function, which initializes the Paddle checkout process.

Usage

  1. Include the PaddleLoader component in your application, preferably in a layout component that is used across multiple pages.
  2. Add purchase buttons for each subscription plan on the Pricing page, and call the handleBuy function with the appropriate product ID when a button is clicked.
  3. Ensure that environment variables such as NEXT_PUBLIC_PADDLE_VENDOR_ID, NEXT_PUBLIC_MONTHLY_PLAN_ID, etc., are defined in your .env file.