web関連業務に役立つノウハウ blog

WEB、IT関係のTipsを紹介しています。

【STRIPE】オンライン決済サービス

会員サイトやオンラインショップを運営する場合、決済システムを導入する必要があります。WEBページでの決済方法は様々ですが、その中でも「STRIPE」が使いやすく、おすすめです。STRIPEを新規に使用開始する際の注意点を具体的に説明します。

STRIPEとは

導入費用が無料で、設定も比較的簡単なオンライン決済サービスであり、決済に対応しているクレジットカードの種類も豊富なのが特徴です。また、API連携により外部サービスの決済を管理することができます。

別記事でも解説しておりますが、STRIPEをWordPress製のWEBページで活用する場合は、WordPressにStripe Paymentsというプラグインを導入することで決済サービスを伴ったWEBページを構築することができます。
【WordPress】WEBページ収益化の味方「Stripe Payments」

登録~初期設定

STRIPEは導入費用こそ無料ですが、オンライン決済サービスに変わりないので、適当な登録情報は問題です。
したがって、登録~初期設定については求められる項目すべてに精確な情報を入力してください。具体的な作業は割愛します。〇https://stripe.com/jp にアクセスして登録

WordPressとの連携準備

STRIPEのユーザ登録が済むとAPIキーが発行されます。このAPIキーこそがWordPressとの連携のために最重要となりますので、必ずチェックしてください。

公開可能キーとシークレットキーの双方をStripe Payments側に入力します。これにより、STRIPEのユーザとWordPressが連携されます。しかしながら、Stripe Payments の設定画面を見ていただけると、APIキーの入力箇所は4か所あります。 〇【WordPress】WEBページ収益化の味方「Stripe Payments」

これは、本番環境とテスト環境の両方のAPIキーのことを指しています。
STRIPEの画面では、テスト環境と本番環境を切り替えることにより、これらのAPIキーをすべて取得することができます。下記の画像はSTRIPEの上部メニューですが、テスト環境がオフになっています。即ち本番環境のAPIキーが表示される状態です。

一方、テスト環境のトグルスイッチをオンにすると下記のようにテスト環境のAPIキーが取得することができます。

以上のように、STRIPEを活用してWordPressで有料会員サイトならびにオンラインショップを運営するためには、APIキーが最重要項目となります。ご自身でWebページを運営する場合は、STRIPEの新規登録に合わせて、APIキーの取得をしておきましょう。また、APIキーを取得する際には、事前にWordPress側にStripe Paymentsプラグインを導入したうえで、取得後すぐに設定画面にて登録するようにしましょう。

このAPIキーのうち、シークレットキーに関しては1度表示すると二度と表示することはできません。したがって、APIキーを取得する段階からWordPress側に設定する部分は1度の作業で実施することがおすすめです。

【WordPress】 Simple Membership ショートコードを最大限に活用する

Simple Membershipでは会員登録のシステムを追加することができますが、会員登録に伴う登録フォームのカスタムについては、ショートコードを主に使用してデータを入力してゆきます。当記事ではショートコードを最大限に活用するポイントを紹介します。

Simple Membershipで使用可能なショートコードは下記のとおりです。

[short code] 内容
[swpm_registration_form] 会員登録フォームを生成します。
[swpm_registration_form level=X] 任意の会員レベル(対応する数字X)の登録フォームを生成
[swpm_login_form] ログインフォームを生成
[swpm_reset_form] パスワードリセットフォームを生成
[swpm_profile_form] プロフィールの編集フォームを生成

これらの機能を超えるシステムを希望する場合、有料版に移行するか、データを直接エディットすることを検討してください。しかしながら後者は予期せぬエラーを招く可能性が高いのでお勧めしません。

また、WordPressのブログ投稿画面では、ブロックの追加からログイン/ログアウトのウィジェットが生成できますのでそちらも合わせてご活用ください。

複数の会員コンテンツを取り扱うWEBサービスでは、会員登録フォームを数種類作成する必要がありますが、Simple Membershipのメニュー内ならびに初期設定の中にはそれらに関するTipsは記載されていません。

したがって、前述した表の中にある”[swpm_registration_form level=X]”のコードは大変重要となります。筆者もこの設定を見つけては存在を忘れ、何度も躓きました。
本記事はその備忘録としても、自身にも役立つとおもい作成しました。

【WordPress】会員サイト構築Tips-有料会員へスムーズに移行

別記事にて無料会員から有料会員への移行システムについて紹介しました。〇【Wordpress】会員サイト構築Tips-有料会員のみのサイト作成
本記事では、もう少し具体的に内容を解説し、運用に失敗するケースも含めてご紹介します。

プラグインの準備

まずは、過去記事をご参考に、3つのプラグインを導入し、必要な初期設定をお済ませください。
【WordPress】WEBページ収益化の味方「Stripe Payments」
【WordPress】会員サイト作成の味方「Simple Membership」
【WordPress】 Simple Membership After Login Redirection について

商品の準備、会員レベルの設定

有料会員サイトを作成する前提でご説明します。また、ユーザが購入するフローとあえて逆向きに作成しておりますのでご注意ください。
まずは商品となるサービスの設定をStripe Paymentsにて設定します。

Add New Productから商品の価格や説明を記載します。こちらの設定内にショートコードが用意されておりますので、購入セクションを作成したいページに挿入することで購入を誘導することができます。

続いて、当該決済が完了した際に移動するページ先のURLを設定します。こちらについてはグローバル設定が事前にされていることかと思いますが、念のためこちらにも記載しておきます。

また、当該会員サービスを購入した後に移行する先の会員レベルを選択しておきます。つまり、無料会員登録を済ませたユーザが決済をすることで有料会員に移行するという設定をここでします。

ここまでで、決済から有料会員への移行システムが仕上がりました。次は無料会員登録から決済までの流れを見てゆきましょう。

会員登録ページから購入ページへ

前述したとおり、購入ページはショートコードを用いて作成することができますので、任意のページに作成します。また、Stripe Paymentsのデフォルト生成ページに商品一覧ページも作成されますので、こちらを活用するのもよいでしょう。

会員登録ページはSimple Membership インストール後、自動で生成されますが、ショートコードを活用することで自作することもできます。ショートコードの一覧については下記の記事をご覧ください。
【WordPress】 Simple Membership ショートコードを最大限に活用する

無料会員登録ページが作成できたら、会員登録後のページ設定をします。
Simple Membership →設定→詳細設定
ついでに「新規登録後の自動ログインを有効化」にチェックを入れましょう。

登録後の転送先URLには、事前に作成した商品購入ページのURLを入力しておきます。
ここまでで、利用登録ページから購入ページへの移行が可能となりました。また、購入ページから完了ページへの移行が済んでおりますので、以上ですべて完了したかに思えます。

無料会員登録の段階で脱落するユーザへの対応

ここまでで重要になるのが、「無料会員登録まではしたが、購入は後にしよう」というユーザへの配慮です。このようなユーザは次回サイト訪問時には購入ページへ移行しなければなりません。しかしながらそのことに気づかなかったり、そのユーザのためだけに購入ページのリンクもつくらなければなりません。このあたりが「失敗」のポイントです。ここでSimple Membership After Login Redirectionの登場です。〇 【WordPress】 Simple Membership After Login Redirection について

当該アドインで無料会員のログイン後ページを購入ページに誘導するように設定すればよいのです。したがって、無料会員の会員レベル設定にて、ログイン後ページに購入ページのURLを設定します。

これにより、無料会員登録ステップで停止した会員に関しても、その後の購入フローをスムーズに進めていただくことができます。

以上の各ページは一方通行で進むため、進行状況のバーなど、進捗を明らかにするデザインを追加するとなおよいと思います。例えば下記のサービスでは、「STEP1/STEP2/STEP3」といった具合に表記し、現在の状況が分かるように工夫されています。
がんと生きる言葉の処方箋

以上の通り、ユーザビリティを中心に、手元にある無料の技術で対応することで、コスパの良いサービスを作成することができます。邪道な使い方かもしれませんが、投資額を下げることもWEBサービスを軌道に乗せるために重要な切り口ではないでしょうか。

【WordPress】 Simple Membership After Login Redirection について

Simple Membershipはいくつものアドインを追加可能であり、様々な機能を追加することができます。プラグイン本体と同様、無料版と有料版が存在しており、機能に制限がありますが、便利な機能を追加することができます。

After Login Redirection の特徴

当アドインは文字通り、ログイン操作後のページ遷移設定をすることができます。

ログイン機能については先にSimple Membershipのプラグインを追加しておく必要があります。
【WordPress】会員サイト作成の味方「Simple Membership」

アドインを追加すると、Login Redirectionの設定画面が追加されます。

このLogin Redirecitonの設定画面では、ログインを求められる前にアクセスしていたページに戻す設定のみ表示されています。

ここでポイントとなるのが、Simple Membershipの会員レベル設定の中に、各会員レベルのログイン後の表示ページ設定です。これにより、会員ごとにログイン後の表示ページを設定することができるため、様々なフローに誘導することができます。

【WordPress】WEBページ収益化の味方「Stripe Payments」

会員サイトの作成では収益化のための仕組み作りが求められます。収益化のためには、「商品」を設定し、「決済」を可能にする必要があります。これらを可能とするプラグインの一つである「Stripe Payments」に着目してみたいと思います。

Stripeとは?

オンライン決済サービスの一つであり、VisaやMasterCardなど全6社に対応しています。導入が比較的容易で、手数料は他社と比較して大幅に低いわけではありませんが初期費用が掛からないメリットがあります。 〇【STRIPE】オンライン決済サービス

Stripe Paymentsの特徴

Wordpressで作成したWEBページに決済機能を追加したい場合、決済機能を追加するプラグインが必要ですが、Stripe Paymentsがお勧めです。

Stripe PaymentsはWordpress側で商品の作成、Simple Membershipの会員レベル変更との連携、自動送信メールのアレンジなどが可能です。したがって、有料会員サイトなどを運営する場合は、Simple Membershipとともに導入することをおすすめします。
【WordPress】会員サイト作成の味方「Simple Membership」

Stripe Paymentsで商品の作成、決済画面の導入が可能ですが、売り上げの管理はどのようにするのでしょうか。購入履歴についてはWordpress側での確認が可能ですが、実際の入金処理が管理されるのは「STRIPE」側です。したがって、まずSTRIPEに登録をする必要があります。

Stripe Paymentsをの導入フロー

①STRIPEに登録  〇【STRIPE】オンライン決済サービス

②Stripe Payments のインストール

③初期設定:STRIPEとの接続
STRIPE側で発行される公開可能キーとシークレットキーを入力することで、STRIPEと連携することができます。またこれらのキーは本番環境用とテスト環境用のものがありますので、間違えないようにご注意ください

④商品の設定
Stripe Payments で決済する対象の商品を設定します。商品の価格や内容の説明などを設定できます。

昨今は、情報商材やブログ購読など、データでの納品を伴う商品が多く扱われているため、当該商品の購入に合わせて、当該商品の取得URLの共有や購読設定がトリガーされる必要があります。当サイトでも紹介している有料会員サイトの仕組みに関しては、商品購入に伴い、会員レベルの変更が自動で実行されるように商品設定の項目を調整します。

なお、当該会員レベル設定で閲覧権限を調整する場合は、各ページの権限設定をあらかじめ確認しておく必要があります。

⑤各種ページを調整する
Stripe Paymentsを導入すると、商品一覧ページや支払い完了ページなどが生成されます。支払い完了ページについてはいろいろなアレンジが求められること、また当該プラグイン導入前に準備が進んでいた場合、別途ページを作成している場合がありますので、設定画面にて転送設定をします。

⑥その他細部設定見直し
本記事ではポイントのみ紹介しておりますので、その他にもたくさんの設定項目がございます。例えば、カード決済時の入力を簡略化する項目などがあります。

【Wordpress】会員サイト構築Tips-有料会員のみのサイト作成

imple Membershipをはじめとする会員管理プラグインの導入では、一般に、無料会員から有料会員への移行システムが求められていますが、コンテンツによっては有料会員のみの構築が望まれる場合があります。本記事では有料会員のみのサイト作成における注意点を挙げています。

Simple Membershipの落とし穴

メンバーシップ系のプラグインの一つ、「Simple Membership」はWordpressに無料および有料会員の概念を追加することができます。「会員」は各ユーザーにユーザー名とパスワードを設定することで構成され、そのプロセスに「決済」が生じる場合は有料会員の区分となるような仕組みです。ここで厄介なのが、有料会員になるためには先ず無料会員になる必要があるということです。つまり、ユーザー名とパスワードを発行したうえで決済をしなければならず、内部的には、当該会員データを有料会員ステータスに変更するという操作をしているからです。

これらのことから、無料会員登録の後、有料会員のための決済をすることになるため、画面遷移を少なくとも2回する必要があります。無料会員登録ページと、有料会員となるためのコンテンツ購入ページの2つです。

無料会員登録ページから有料コンテンツへの移行

無償版のSimple Membershipをインストールすると、デフォルトで会員登録ページが作成されます。このページではユーザーが会員登録をすることができます。

有料会員登録ページですが、前述したとおり、有料会員となるためのコンテンツ購入ページという方が正しい表現となります。つまり、商品を購入する操作により「会員レベルを変更する」仕組みを利用して有料会員登録としているのです(商品購入ページの作成方法についてはいろいろな方法がありますが、筆者はStripe Paymentsを利用した方法をお勧めしています。 〇【WordPress】WEBページ収益化の味方「Stripe Payments」 )

例えば、こちらのサイトでは、動画配信を実施していますが、本編動画視聴には有料会員登録が必要となります。有料会員登録では、「視聴権を購入する」という動作により、無料会員のステータス(レベル)が有料会員へと変更されるという仕組みです。

実際に登録フローを見ていただければわかりますが、当該サイトでは無料登録を済ませると、自動で視聴権購入ページへ遷移します。また、無料会員となったが、購入はせず、一度ログアウトした場合でも、次回ログイン時には購入ページへと誘導されます。これらの動作を設定することで、無料会員から有料会員への移行をスムーズにすることができます。

無料会員登録後のページ遷移、ログイン時のページ遷移

無料会員登録ページならびに(Stripe Payments を用いて)商品ページを作成した後は以下の操作を実施します。

①左メニューの「WP Membership」⇒設定⇒詳細設定⇒登録後の転送先URL:商品購入ページのURLに設定

② 左メニューの「WP Membership」 ⇒会員レベル⇒無料会員として設定している会員レベルの「Edit」⇒After Login Redirection Page :商品購入ページのURLに設定

※「After Login Redirection Page」はSimple Membershipのアドオンプラグインである「Simple Membership After Login Redirection」の機能です。必ず事前にインストールしてください。 〇【Wordpress】 Simple Membership After Login Redirection について

以上の設定をすることで、無料会員から有料会員への決済を伴うフローがスムーズに実現できます。是非、この設定を参考にしていただき、有料会員サイトを作成してみましょう。

【Wordpress】会員サイト作成の味方「Simple Membership」

Simple Membershipはwordpressプラグインの一つで、メンバーシップの仕組みをWEBサイトに付与することができます。メンバーシップの機能が付与されたWEBページでは閲覧権限の設定などを個別にすることにより、会員限定コンテンツの案内をすることができます。本記事ではsimple membershipの紹介と、特徴をご案内します。

Simple Membership で構築できるサービス

Simple Membershipを導入すると、サービス利用者の特定を必要とする活動が可能となります。

例えば
・有料ブログ
・学習サイト
・配信サイト 等です

作成した会員情報を各ページに適応させることで、アクセスできる会員を制限することができます。これにより、上記のサービスを作り上げることができます。
つまり、有料コンテンツとしたいページを作成した後、当該ページに有料会員アクセス制限をかけることで、有料ブログや有料学習サイトが作成できます。

ただ、サービスで発生する費用のやり取りに関しては別途決済システムに頼る必要があります。選択肢としてはPaypalやStripeなどがあります。おすすめはStripeです(理由は別記事をご覧ください)。 〇【WordPress】WEBページ収益化の味方「Stripe Payments」

Simple Membership で作成した会員サイトの壁

このように会員サイトを構成することができますが、いくつかの壁も存在します。

①無料会員登録から有料会員登録(決済)までのフローをコントロールすることが難しい

Simple Membershipでは、すでに会員登録してあるIDに対してのみ、有料化の案内ができます。したがって、会員登録と決済を同時に実施する構成についてはデフォルトで提供されていません。そのため、ログイン後画面の設定や決済ページのアクセス制限、などを調整することで対応することとなります。 〇【WordPress】会員サイト構築Tips-有料会員へスムーズに移行

②無料版でのプラグインではあまり細かい部分をエディットできない

無料版では、フォームの構成や各種エラーメッセージの内容等、変更できない点がかなりあります。サーバー側のファイルを直接エディットすることである程度有料版に近づけることができますが、コスパを考えると推奨できません。

筆者としては、安易に有料版へ移行(有料版アドオンの導入)することはお勧めしません。収益化を目指すのであれば支出をなるべく小さくすべきです。付け焼刃、その場しのぎであったとしても、先ずは自身の持つテクニックで目標の形式を実現することが大切です。