Update code and URLs for billing

This topic explains how to customize billing flows with Kinde, including URL parameters, direct auth URLs, and SDK usage in React.

Examples are given in React, but can be adapted for most frameworks.

Edit the auth URL parameters directly

Link to this section

Here’s a standard Kinde auth URL:

https://<your_kinde_subdomain>.kinde.com/oauth2/auth
  ?response_type=code
  &client_id=<your_kinde_client_id>
  &redirect_uri=<your_app_redirect_url>
  &scope=openid%20profile%20email
  &state=abc

Add these parameters as needed:

Parameter	Description
plan_interest	Pre-selects a plan (skips plan selection)
pricing_table_key	Displays a specific pricing table
is_create_org	Triggers org sign-up flow

Examples

Link to this section

• Pre-select a plan:

  ...&plan_interest=pro_monthly

• Show specific pricing:

  ...&pricing_table_key=spring_promo

• Org sign-up:

  ...&is_create_org=true

Integrate billing using the React SDK

Link to this section

You can avoid manual URL construction by using our SDK components. Here’s how.

User sign-up (default):

<RegisterLink>Sign up</RegisterLink>

Org sign-up (B2B):

<RegisterLink isCreateOrg>Sign up your organization</RegisterLink>

Pre-select a user plan:

<RegisterLink planInterest="pro_monthly">Sign up with Pro plan</RegisterLink>

Show a specific pricing table:

<RegisterLink pricingTableKey="spring_promo">Spring Promo Sign up</RegisterLink>

Combine for B2B + pricing table:

<RegisterLink isCreateOrg pricingTableKey="enterprise_2024">
  Sign up your company
</RegisterLink>