自分のワードプレスサイトでカード決済をしたい方向けに、プラグインを活用する方法を紹介します。
まずはプラグインの設定とstripe(ストライプ)の登録から行ってください。
この記事では、クレジット決済のテストの方法を紹介します。
クレジット決済で設定ミスがあったら、お客様に迷惑もかかりますし、効率化のためのオンライン決済なのに対応が煩雑になってしまったら意味がないですよね。
しっかりテストしていきましょう。
＊目次＊
STEP1：stripeテスト環境の確認
テストは、テスト環境で決済を行います。
stripeの設定の「一般設定」タブの「本番環境モード」のチェックが外れていることを確認してください。
これから決済したい商品ページを作成しますが、本番で使用するものを作って問題ないです。
決済はあくまでもテスト環境で行うので間違って払ってしまうことがないように進めます。
STEP2：商品ページ作成
次はテストの準備のために商品ページを作成していきます。
STEP2-1：商品ページのメイン部分の入力
ダッシュボート＞Stripe Payments＞Add New Product
タイトル、パーマリンク、本文を入力
タイトルは商品ページのトップに大き目に表示されます。私は勉強会の参加費の決済ページとして使っていますが、日付を入れてわかるようにしています。
具体的に商品名やサービス名を記載した方がお客様のためになると思います。
STEP2-2：販売価格の入力
価格の入力と通貨の選択
価格は税込み金額を数字のみ入力して、通貨は「日本円」をプルダウンから選択してください。
STEP2-3：商品の送料や在庫の入力(物販関連)
「数量と在庫」「送料および税額」「住所を収集する」は適宜入力してください。
初期設定のままでも問題ありません。このあたりが関係するのは物販系の方ですね。
STEP2-4：ダウンロードURLの入力(PDFで配布する場合)
決済後、PDFファイルをダウンロードしてもらうような場合は「ダウンロードURL」の入力が必要になってきます。
ファイルを選択＞(ファイルをアップロードする画面)＞PDFファイルをドラッグ＆ドロップ
「商品サムネイル画像」は必要に応じて画像をアップロードしてください。
物販系以外は、ひとまずなくても問題ないです。
STEP2-5：サンクスページの作成と設定(なくてもOK)
次はサンクスページとボタンの設定です。
サンクスページは「お申し込みありがとうございます」「ご購入ありがとうございます」「ご登録ありがとうございます」といったページです。
見たことがある人も多いと思います。
サンクスページは無し(空欄)でも問題ないですが、ページを作ってお礼したい方は作成してください。
固定ページで作成＞公開＞stirpeの下記欄にURLを入力
STEP2-6：ボタンに表示するテキストを入力
購入ボタンの表記も自由に変更できます。「ボタンテキスト」に表示したい文言を入力してください。
「今すぐ購入する」「購入はこちらから」など。
「公開」ボタンを押してページを公開していきます。
お客さんが決済するページのボタンは、装飾しないとこういう感じです。
ボタンをクリックすると決済の画面が立ち上がります。
次はテストで実際に決済をしてみましょう。
STEP3：stripeのクレジット決済をテストする
テスト環境でクレジット決済をしていきます。
次の内容を入力していきましょう。
- お名前：(何でもOK)入力
- メールアドレス：受信するアドレスを入力(自分で確認できるアドレスなら何でもOK)
- クレジットカード/デビットカード：下記のテストカード番号を入力
- 月/年：将来の年月を入力
- CVC：数字3桁(何でもOK)を入力
※「CVC」は3桁のセキュリティコードを入力(テストは何でもOK、123とか)
stripeでテスト用のカード番号があるのでそちらを使っていきます。
引用元：https://stripe.com/docs/testing
| カード番号 | ブランド | CVC | 日付 |
| 4242424242424242 | VISA | 数字3桁(123 etc.) | 将来の日付 |
| 5555555555554444 | Mastercard | 数字3桁(123 etc.) | 将来の日付 |
| 3566002020360505 | JCB | 数字3桁(123 etc.) | 将来の日付 |
入力できたら、支払いボタンをクリックします。
サンクスページを設定した場合は、サンクスページが表示されると思います。
決済が完了すると、入力したメールアドレスに「ご利用明細書」の自動返信メールが届きます。
またそれとは別に管理者のメールアドレスに、「お申し込み通知」のメールも届いていると思います。
STEP4：stripeのダッシュボードから売上データを確認
テストの決済が終わったら、stripe側で売上が上がっているか確認します。
stripeのダッシュボートにログインし、「テストデータを表示」から売上データを確認することができます。
問題なさそうでしたら、これでテストは終了です。
お疲れ様でした！
