Concrete CMS が決済サービス「Stripe」と連携するために必要な弊社が開発したアドオンです。
Stripeを導入される際はぜひご検討ください。

アドオンページはこちら（英語ページ）

事前準備

事前に Stripe 側でアカウントの作成、サイトと連携する商品（プラン）の設定を行っておいてください。設定例としては弊社ブログ「決済サービス「Stripe」のアカウント作成〜サブスクリプションの設定まとめ」をご参照ください。
なお、当アドオンは公開サーバーでのみ動作します。非公開サーバーでは動作できませんので、ご了承ください。

 

設定の流れ

Stripe 側の設定を行う

Stripe 側で必要な設定は以下のとおりです。

1. 商品（プラン）の追加
2. 消費税の設定
3. Webhook（イベント）の設定
4. 本番環境利用の申請

これらの一連の流れは弊社ブログ「決済サービス「Stripe」のアカウント作成〜サブスクリプションの設定まとめ」に記載がございますので、そちらを参考に設定をお願いします。

 

プランで使うグループを作成する

管理画面 > メンバー > ユーザーグループ ページより、プランで使用したいグループを作成します。
グループの作成方法は「ユーザーグループを追加する」をご確認ください。

 

Stripe へのアクセスキーを取得してアドオンに設定する

Concrete CMS から Stripe へアクセスするには、Stripe で発行された「公開可能キー」と「シークレットキー」が必要です。

Stripe の Dashboard ページを表示し、左側のメニューから 開発 > API キーを表示します。標準キー内にある「公開可能キー」と「シークレットキー」をクリックしてコピーします。（下図はテスト運営中のものです。本番運営中の場合は若干異なる可能性があります）

 

取得したキーを、Concrete CMS の 管理画面 > Stripe > 設定 ページにある API設定 タブで設定します。

 

Webhook を設定する

アドオンを利用するには、Webhook を Stripe 側で設定する必要があります。設定方法については ブログの「イベント(Webhook)の設定」の項目部分を参照ください。
Stripe に設定するエンドポイントURLは「必須のWebhook」に表示されているURLを設定します。

Stripe 側に設定するイベントは以下の5つです。

• customer.subscription.updated
• customer.subscription.deleted
• customer.updated
• customer.deleted
• invoice.payment_action_required

設定後、表示されるシークレットキーを concrete5 の 管理画面 > Stripe > 設定 ページにある API設定 タブにある「Stripe Webhook シークレット」に設定します。

 

設定が完了したら、ページ下にある [保存] をクリックします。

 

プランを設定する

管理画面 > Stripe > プラン ページを表示します。
ページ上にある [＋プランを追加] をクリックします。

 

プランの追加ページが表示されます。

Stripe プラン	Stripe 側で設定されたプランが表示されます。 ページに表示したいプランを選択します。
名前	ページ側に表示したいプラン名を入力します。
ハンドル	concrete5 でプランの申し込みページを生成するための文字列を入力します。 基本的には「名前」で設定した内容をローマ字、あるいは英名で設定するのがおすすめです。
グループ	このプランに申し込んだユーザーに設定するユーザーグループを指定します。
説明	このプランに関する説明を入力します。 これはページ側にも内容が表示されます。

設定が完了したらページ下にある [プランを追加] をクリックします。
この作業を Concrete CMS で使用したいプラン分繰り返します。

 

申し込みページを作成する

プランの申し込みページを作成します。
ツールバーの＋アイコンからブロック一覧を表示します。一覧の中から「Stripe プラン一覧」ブロックを探します。
その他カテゴリに入っていますので、そこまでスクロールするか、検索ボックスで「Stripe」と入力して一覧に表示し、ページに挿入します。

Stripe プラン一覧 を追加ポップアップが表示されます。
「プランを選択」で表示したいプランを選択します。すべてを一覧で表示したい場合は「すべてのプラン」を設定します。
「成功ページ」は、決済成功後の遷移先のページです。デフォルトでは http(s)://[あなたのサイトURL]/index.php/account/billing が表示されるようになっています。
「キャンセルページ」は、決済キャンセル後の遷移先のページです。デフォルトではサイトのトップページが表示されるようになっています。

一律で「成功ページ」「キャンセルページ」を設定したい場合は、後述の オプション設定 を参照してください。

設定が完了したら、ポップアップ下の [新規] をクリックします。
設定した内容で、プラン一覧が表示されます。(下図は Elemental テーマでの設定例）

 

ここで、左図のように申込みページの作成位置ホーム直下に配置するのではなく、 ホーム直下以外の階層 または URLスラッグを「pricing」以外にする 場合は、別途設定ページのオプション設定タブで「料金設定ページURL」を設定する必要があります。

 

オプション設定

Macareux Stripe Subscription アドオンは、以下の機能をオプションで用意しています。

• 現地通貨での表示設定
• プラン契約時の管理者の承認有無
• 各ページのデフォルト設定
  • 成功ページ
  • キャンセルページ
  • 料金設定ページ
• Eメール通知

 

現地通貨での表示設定

管理画面 > Stripe > 設定 ページのAPI設定タブに設定項目が表示されています。

サイトに表示したい通貨とロケールを選択します。
通貨を変換するのではなく、選択した形式でコストを表示します。支払いは Stripe 側で作成したプラン(商品)で設定した通貨で行われます。

 

プラン契約時の管理者の承認有無

管理画面 > Stripe > 設定 ページのオプション設定タブに設定項目が表示されています。

デフォルトではプランが申し込まれると自動的に契約処理を進めますが「新しい契約を作成するときに admin の承認を必要とする」のチェックを有効にすると管理者の承認が必要になります。

管理者が承認するまで、Stripe 側にはドラフト状態でデータが渡ります。承認されていない状態では、決済は行われません。
管理者が承認を却下すると、Stripe 側にはキャンセルしたとしてデータが渡ります。

 

チェックアウト

管理画面 > Stripe > 設定 ページのオプション設定タブに設定項目が表示されています。
契約時、利用規約に同意したことを証明させるチェックをしないと先に進めないようにするための設定です。

チェックを入れると、条件ページのURLを設定する欄が表示されます。

 

各ページのデフォルトURL設定

管理画面 > Stripe > 設定 ページのオプション設定タブに設定項目が表示されています。
決済成功ページ、決済キャンセルページ、料金設定（申し込み）ページのURLを個別に設定できます。

デフォルトでは以下のとおりです。(concrete5 の設定によっては index.php が表示されないことがあります)

• 決済成功ページ
  • http(s)://[あなたのサイトURL]/index.php/account/billing
• キャンセルページ
  • http(s)://[あなたのサイトURL]/index.php
• 料金設定（申し込み）ページ
  • http(s)://[あなたのサイトURL]/index.php/pricing

上記以外のURLに設定したい場合は、変更します。

 

Eメール通知

管理画面 > Stripe > 設定 ページのEメール設定タブに設定項目が表示されています。
ユーザーがプランを申し込んだ際に

• ユーザーにメールを送信するか
• 管理者にメールを送信するか

を設定できます。

この設定を利用する場合は、あらかじめ Stripe 側に「customer.subscription.created」イベントを登録する必要があります。
前述の Webhook を設定する の手順で、Webhook イベントを登録してください。

 

サブスクリプション一覧と詳細

管理画面 > Stripe > サブスクリプション ページを表示すると、現在プランを契約している、あるいはキャンセルしたユーザーを一覧で確認することができます。
表示されているステータスは、Stripe 側の 顧客 > 定期支払い ページで表示されているステータスを表示しています。キャンセルしたにも関わらず、有効として表示される場合は Stripe 側のステータスと設定を確認してください。
（定期支払いは請求期間の終了時にキャンセルされるよう設定されていることが多いので、1ヶ月契約の場合は翌月まで「有効」として表示されることがあります）

ユーザー名をクリックすると、管理画面 > メンバー > ユーザー検索 > ユーザー詳細 ページが表示されます。
Stripe プラン名をクリックすると、管理画面 > Stripe > プラン > プラン詳細 ページが表示されます。
Stripe ID、やステータス付近で行をクリックすると、契約内容の詳細を確認することができます。