Menu

料金管理

前提条件

料金管理を設定する前に、以下のセットアップ手順を完了していることを確認してください:

リストページ概要

注目すべき点

  • フロントエンドコード:app/[locale]/(protected)/dashboard/(admin)/prices
  • バックエンドコード:actions/prices

前提条件を完了すると、管理者料金管理ページに初期データが表示されます。以下のことができます:

  • /dashboard/pricesで料金リストを表示
  • ランディングページでの料金プランの表示をプレビュー
list

ランディングページは現在の環境に基づいて料金プランを表示します:

pricing
pricing

料金プランの作成、複製、編集

3つの操作(作成、コピー、編集)はすべて同じフォームコンポーネントを使用しますが、以下の主要な違いがあります:

  • 作成:新しい料金プランを作成するための空白フォームを開く
  • 複製:既存の料金プランの同一コピーを新しい名前で作成し、変更できる状態にする
  • 編集:既存データでフォームを開いて変更を行う

フォームコンポーネント概要

基本情報

form 1

基本情報セクションでは、環境を選択し、料金プランのタイトルと説明を入力する必要があります。

選択した環境はStripe統合で入力するprice_idの環境と一致し、環境変数STRIPE_SECRET_KEYSTRIPE_PUBLISHABLE_KEYの環境とも一致する必要があります。この手順は少し煩雑に見えるかもしれませんが、誤った操作によってテスト環境のプランを本番環境に設定してしまい、決済エラーを起こすことを防ぎます。

右側の設定では、現在の料金プランの表示順序とアクティベーション状態を設定できます。下のプレビューエリアはWYSIWYGデザインを使用し、エンドユーザーが見るものと同じスタイルで表示されるため、料金プランを公開する前に異なる言語でカードが正しく表示されるかを確認できます。

Stripe統合

form 2

Stripe製品情報からprice_idをコピーしてStripe統合に貼り付け、検証・取得をクリックするだけで、Stripeで設定された料金情報が自動的に入力されます。

表示・コンテンツ

form 3
form 4

このセクションはカードの表示情報を設定するために使用され、以下の内容が含まれます:

  • 表示価格
  • 料金プランに含まれる特典リスト
    • includedはこの項目が含まれるかどうかを示す;チェックされている場合、プレビューカードに✅が表示され、そうでなければ❌が表示される
    • boldはこの項目を太字で表示するかどうかを示す
  • カードをハイライトするかどうかを選択;一般的にハイライトされるカードは1つだけ設定し、ユーザーの注意を引く
    • ハイライトを選択した場合、ハイライトテキストも入力する必要がある
  • ボタンテキスト
  • ボタンリンク、2つのジャンプ動作をサポート:
    • ボタンがStripe決済フローを処理するために使用される場合、リンクを入力する必要はない
    • ボタンが外部リンクジャンプに使用される場合、ジャンプリンクを入力する必要があり、httpsリンクとメールリンク(mailto:)をサポート

注目すべき点

ボタンリンクがサポートする異なるジャンプ動作はNextyランディングページで体験できます

多言語翻訳

このセクションは料金プランの多言語版を設定するために使用され、多言語設定を完了する2つの方法があります:

  • テンプレート生成をクリックしてフォーム情報に基づいてJSON構造を生成し、他の場所で翻訳してからコピーして戻す
  • .envまたは.env.localで翻訳関連の環境変数が設定されている場合、AI翻訳ボタンが利用可能になり、クリックするとフォームに基づいて自動的に多言語料金JSONデータを生成

多言語JSONが生成されると、料金プランカードのコンテンツは最初にそのJSONに従って表示されます。料金プランカードを編集して表示・コンテンツのコンテンツを変更した場合は、同時に多言語JSONも更新する必要があります。

form 5

特典

このセクションはプランの特典をカスタマイズするために使用されます。3つの使用方法とシナリオがあります:

  • 特典が空または空のオブジェクトの場合でも、決済プロセスは正常に実行できます

    • 一回限りの支払いの場合、ordersテーブルに注文情報が生成されます
    • 定期サブスクリプションの場合、ordersテーブルに注文情報、subscriptionsテーブルにサブスクリプション情報が生成されます
  • 一回限りの支払いと定期サブスクリプションにクレジットを提供したい場合は、usageテーブルとその組み込みのone_time_credits_balanceおよびsubscription_credits_balanceフィールドを直接使用できます

    • 一回限りの支払いプランを作成する際は、特典JSONone_time_creditsフィールドを通じて一回限り支払いクレジットを定義します。例:
      {
        "one_time_credits": 500
      }
    • 定期サブスクリプションプランを作成する際は、特典JSONmonthly_creditsフィールドを通じて月額サブスクリプションクレジットを定義します。例:
        {
          "monthly_credits": 100
        }

    組み込みロジックを使用すれば、コードを変更する必要はありません。すべてが準備されています。ユーザーが支払いを行った後、orderssubscriptionsテーブルでのデータ生成に加えて、usageテーブルでクレジット残高データ、credit_logsでクレジット変更記録も生成されます。

    注目すべき点

    v1.1.4以降、/dashboard/credit-usage-exampleページで組み込みクレジット控除プロセスをテストできます。このページは開発環境でのみ開くことができるため、本番環境での悪用を心配する必要はありません。

  • より複雑な特典を実装する必要がある場合は、特典JSONで特典をカスタマイズし、lib/stripe/webhook-handlers.tsupgradeOneTimeCreditsupgradeSubscriptionCreditsを再実装する必要があります。これに対応して、usageテーブルのフィールドも拡張する必要があり、2つの拡張方法があります:

    • テーブル構造を変更し、特典フィールドを追加し、再実装したupgradeOneTimeCreditsupgradeSubscriptionCreditsで新しいフィールドに値を割り当てる
    • 再実装したupgradeOneTimeCreditsupgradeSubscriptionCreditsで、usageテーブルのbalance_jsonbに特典情報を書き込む

    特典JSONの詳細な使用法とカスタム実装については、決済フローで詳しく紹介されます。

新しい料金プランを作成後、リストで新しいデータを確認できます。