MENU
  1. ホーム
  2. WordPress
  3. 【コピペで実装】WordPressでnoteやcodocのような有料記事販売を3.6%の手数料で再現する方法【stripe決済】

【コピペで実装】WordPressでnoteやcodocのような有料記事販売を3.6%の手数料で再現する方法【stripe決済】

WordPress

noteやbrain、codocのような、最初は無料で読めて、続きは有料。みたいな販売手法っていいですよね。しかし手数料が高いのなんの。じゃあもう自前のWPで実装すればカード決済の手数料3.6%で済むじゃん。

それを実現するのがこの記事です。

このTunaMODは、XserverとSWELLというワードプレステーマを使って作っています。非常にベーシックな環境です。この環境かつコピペで、noteのような有料記事システム(ペイウォール)を実装できます。その他の無料WPテーマなどでも実装できるはずなので、非常に役に立つと思います。

実装に必要な時間は、2～3分。デザインやテキスト周りを修正するなら気が済むまでって感じですね。

ざっくりした内容としては、「Stripe、無料プラグイン、function.phpに追加処理をコピペ」って感じで実装します。月額費用、雑費などは無く永久に、クレジットカード手数料の3.6%のみでペイウォールを実装できます。

では、まず手順をざっと見ていきます。

  1. カード決済代行サービス、Stripeに登録。
  2. ワードプレスでStripe決済を可能にする、「Accept Stripe Payments」プラグインを導入。
  3. 「Accept Stripe Payments」でProduct(販売用ショートコード)を作成。
  4. ワードプレスと連動した会員登録システムを手軽に実装できる「Simple Membersip」プラグインを導入。
  5. ワードプレス子テーマのfunctions.phpにコピペで追加処理を実装。

以上。一つずつ見ていきましょう。

目次

１．Stripeへ登録。

公式サイトhttps://stripe.com
初期・月額費用無料
対応クレジットカードVISA・MasterCard・JCB・American Express・DISCOVER・Diners
その他決済Apple Pay・Google Pay
決済手数料3.6%  参照元
入金手数料無料  参照元
入金サイクル毎週  参照元
返金手数料0円※既に支払いした決済手数料は返金されません。
チャージバック不審請求されたら手数料1,500円掛かる。異議が認められたら返金される。  参照元
年齢制限とくになし
未成年者は保護者の承諾が必要
導入まで所要期間数分程度

Stripeにアクセスして「今すぐ始める」から登録しましょう。普通に必要事項を記入していけばOKです。以下の質問は大抵の人が下記のようになると思います。登録が完了したら、「本番環境利用の申請」も済ませてください。

今後、顧客のカード番号を取り扱う予定はありますか？

 いいえ

今後、お客様の事業で、または他事業の代理として決済を生成する接続アプリケーション（Connect Standard）で、顧客の身元を特定することを目的として、何らかの種類の付加的な検証手段を利用する予定はありますか？

 いいえ

今後、お客様の事業で、または他事業の代理として決済を生成する接続アプリケーション（Connect Standard）で、決済ごとにカードのセキュリティコードを要求する予定はありますか？

 はい

今後、お客様の事業で、または他事業の代理として決済を生成する接続アプリケーション（Connect Standard）で、疑わしい配送先住所を検出するための対策を講じる予定はありますか？

 いいえ

過去５年間に特定商取引法違反もしくは過去に消費者契約法違反による敗訴判決を受けたことがありますか？

 いいえ

２．「Accept Stripe Payments」プラグインを導入

『プラグイン』＞『新規追加』の順に選択し、『Accept Stripe Payments』で検索・導入しましょう。

プラグインを導入・有効化したら初期設定を行っておきましょう。管理画面で『Accept Stripe Payments』＞ 『設定』で選択します。下記に僕の設定を記載しておきます。あくまで目安なので自分の環境に合ったものを選んでください。

一般設定タブの設定

全体設定

  • チェックアウト結果ページのURL：デフォルトのまま変更しない
  • 商品一覧ページ URL：デフォルトのまま変更しない
  • 通貨：日本円(JPY)
  • 通貨記号：¥
  • ボタンテキスト：任意の値
  • お支払いポップアップボタンテキスト：任意の値（%sは入れる）
  • Stripe にカード情報を保存しない：チェックしない
  • “決済情報を保存する” オプションを表示しない：チェックしない
  • 郵便番号の検証：チェックしない
  • Stripe チェックアウト言語：Japanese
  • ポップアップウィンドウのデフォルトの国：Japan
  • Hide the State Field：チェックしない
  • ログイン済みユーザーの名前とメールアドレスの事前入力：チェックしない

認証情報

  • 本番環境モード：インストール直後はチェックしない。（本番利用開始時にチェックを入れる）
  • 本番環境用の公開可能キー：Stripeのdashboardから転記
  • 本番環境用のシークレットキー：Stripeのdashboardから転記
  • テスト環境用の公開可能キー：Stripeのdashboardから転記
  • テスト環境用のシークレットキー：Stripeのdashboardから転記

デバッグ

  • デバッグログを有効にする：チェックしない
  • デバッグログの共有リンク：編集不可

電子メール設定タブの設定

電子メール設定

  • Stripe から領収書メール送信：チェックを入れる
  • 購入後にお客様へメール送信：チェックしない
  • お客様へ送信するメールのコンテンツタイプ：Plain text
  • メールの差出人アドレス：your-domain.comの箇所をご自身のサイトURLに変更
  • お客様へのメールの件名：任意の値
  • お客様へのメールの本文：デフォルトのまま
  • 販売管理者へ売上通知メール送信：チェックを入れる
  • 通知メールアドレス：任意の値（専用のメールアドレスを作って設定する）
  • 販売管理者へ送信するメールのコンテンツタイプ：Plain text
  • 販売管理者へのメールの件名：デフォルトのまま
  • 販売管理者へのメールの本文：デフォルトのまま

お取引エラーのメール設定

  • 決済エラー時のメール送信：チェックを入れる
  • エラーメール送信先：任意の値（専用のメールアドレスを作って設定する）
  • 追加のメール設定：チェックしない

高度な設定タブの設定

価格表示設定

  • 通貨記号の位置：左
  • 小数点区切り文字：.
  • 1000単位毎の区切り文字：,
  • 小数点以下の桁数：0
  • 区切り設定をユーザーによる入力にも適用する：チェックしない

カスタムフィールドの設定

  • すべてのボタンと商品を有効にする：チェックしない
  • フィールド名：（空欄）
  • フィールドの説明：（空欄）
  • フィールドの説明の表示場所：プレースホルダ
  • 位置：ボタンの上
  • フィールドタイプ：Text
  • フィールド検証：検証なし
  • 必須：チェックしない

利用規約と条件

  • 利用規約と条件を有効にする：チェックを入れる
  • チェックボックスのテキスト：リンク先のURLを自サイトの利用規約ページに変更
  • ユーザーのIPアドレスを保存：チェックしない
  • 位置：ボタンの上

追加の設定

  • レガシーAPIのチェックアウトを有効にする：チェックしない
  • 商品の設定をコンパクトな編集方式にする：チェックしない
  • プリフェッチ支払いポップアップスクリプト：チェックしない
  • 注文情報を作成しない：チェックしない
  • Allowed Currencies：（編集不可）
  • お支払いポップアップの追加 CSS：（追記なし）

Experemintal Settings

  • Do Not Use Stripe PHP SDK Library：チェックしない
  • Disable Security Token Check：チェックしない
  • Show Incomplete Orders：チェックしない
  • Javascriptのロード前にボタンを無効にする：チェックを入れる

３．「Accept Stripe Payments」で販売用ショートコードを作成。

設定が完了したら、『Accept Stripe Payments』でProductを作成します。この作業をネットショップに出品する感じと同じです。商品販売用のショートコード(リンク)を作ることが出来ます。

ショートコードとは、この記事の最初にあった購入ボタンを実装するためのコードです。完成したショートコードは記事に貼り付けたらカード決済で販売することが出来るようになります。下記を参考に作りましょう。

  • タイトル：商品の名前を入力。（これは、決済時にお客様に表示される商品名です。）
  • 説明：商品の説明を入力。（これも、決済時にお客様に表示されます。）
  • 簡単な説明：入力不要
  • 価格と通貨：「One-time payment」を選択し、通貨は日本円（JPY）を設定します（共通設定で日本円としている場合はDefaultでも可。）価格は販売したい価格を入力します。
  • バリエーション：入力不要（決済時にユーザが商品を複数選択し、その選択結果によって価格が変動する機能です。非常に複雑であるため、今回は利用しません。）
  • 数量と在庫：入力不要
  • 送料および税額：送料は入力不要。税額には消費税の割合を入力。
  • 住所を収集する：入力不要（収集する場合はプライバシーポリシーなどに目的を明記）
  • ダウンロードURL：購入時に公開URLに配置したコンテンツを提供する場合は、コンテンツのURLを入力。（←手軽な方法）別途購入者のみにコンテンツ公開したい場合は入力不要。（functions.phpなどに処理追加は必要）
  • 商品画像サムネイル：サムネイルの画像を指定。（これも、決済時にお客様に表示されます。）
  • お買い上げありがとうございますページのURL：デフォルト以外を指定したい場合は入力。
  • 外観：入力不要。
  • クーポンの設定：入力不要。
  • カスタムフィールド ：入力不要。
  • 高度な設定：入力不要。

上記の入力が完了したら、『公開』ボタンを押して保存しましょう。

４．「Simple Membersip」プラグインを導入。

「Simple Membersip」は、ワードプレスにユーザー登録を実装するためのプラグインです。

今回のnoteのような有料記事を実装するには、購入情報の保存がネックになります。そこでユーザー登録です。似た機能のプラグインは沢山あるので好きなものでいいです。

「Simple Membersip」を導入すると自動で、「登録」、「ログイン」などの固定ページが作成されます(のちのち使います。)。下記を参考に設定してください。

・「WP Membership」→「会員ランク」→「新規追加(レベルの追加)」

WordPress のデフォルトユーザー権限 →購読者
有効期限→無期限
メールで有効化する→チェックしない

・「WP Membership」→「設定」

無料会員を有効にします→チェック入れる
無料会員レベルの ID→先ほど作った会員ランクのIDを入力
管理人に管理ツールバーを表示→チェック入れる
WP ダッシュボードへのアクセスを無効にする→チェック入れる

５．functions.phpに追加処理を実装。

『決済していないユーザには投稿の一部を隠し、決済後にユーザには投稿を全て表示する』という処理は、functions.phpに追加コードを加えて実装します。noteっぽく、購入者に対しては全文表示し、未購入者に対しては記事の途中までしか表示しない、というペイウォール機能をコピペで実装する方法の紹介です。

まずは、「外観」→「テーマファイルエディター」→「functions.php」にアクセスし、下記のコードをコピペします。

add_filter('the_content', tunamod_convert_content_product', 2, 1);
function tunamod_convert_content_product($content){
	$result_content = $content;
	$current_user_id = get_current_user_id();
	if ( preg_match_all('/(\[asp_product id=\")([0-9]*?)\".*\]/', $content, $matches, PREG_SET_ORDER) ) {
		if ( count($matches) > 1) {
			$msg = 'Stripe Paymentのショートコードが複数挿入されています。';
			$result_content .= $msg;
		} else {
			global $wpdb;
			$target_prod_id = $matches[0][2];
			$prod_count = $wpdb->get_var("SELECT COUNT(1) FROM $wpdb->posts a WHERE a.id = $target_prod_id");
			if ( 0 ==$prod_count ) {
				return $result_content;
			}
			$target_short_code = $matches[0][0];
			if ( !empty($current_user_id) ) {
				$query = "
SELECT
	COUNT(1)
FROM
	$wpdb->posts a
	INNER JOIN 
		$wpdb->postmeta b
	ON
		a.id = b.post_id
	INNER JOIN 
		$wpdb->postmeta c
	ON
		a.id = c.post_id
WHERE
	a.post_author = $current_user_id
	AND a.post_type = 'stripe_order'
	AND b.meta_key = 'asp_order_status'
	AND b.meta_value = 'paid'
	AND c.meta_key = 'asp_product_id'
	AND c.meta_value = CAST($target_prod_id as CHAR)
";
				$order_count = $wpdb->get_var( $query );
				if ( 0 < $order_count) {
					$result_content = str_replace($target_short_code, '', $result_content);
					
				} else {
					// ログイン済み・購入してない場合はコンテンツ削除処理。ユーザー登録済みの人に現れる購入リンクです。テキストやデザイン周りを修正したい場合はここ
					$pay_msg = '<p>続きは購入者限定の記事です。</p>';
					$result_content = strstr($result_content, $target_short_code, true)  . $pay_msg . $target_short_code;
				}
			} else {
				// 未ログインの場合はメッセージを設定して、ショートコード以降を削除。未ログインユーザには決済リンクを設定しない。

// △〇□

				$pay_msg = '<hr><p>※続きは購入者限定となります</p><div class="box11">*購入には<a href="#">会員登録</a>および<a href="#">ログイン</a>が必要です。(購入情報を保存するために会員登録が必要なのです...。お手数おかけします...。)</p><br><br>*購入後、記事が見れなくなった場合、購入時に入力した名前・メールアドレス・購入日を明記したうえでお問合せ下さい。</div>';
				$result_content = strstr($result_content, $target_short_code, true) . $pay_msg;
			}
		}
	}
	return $result_content;
}

※コードの最後らへん。目印として「// △〇□」と書いてある部分のメッセージなどは、ご自由に書き換えてください。
※因みにこの処理は、「固定ページ」でのみ有効です。

コピペが完了したら、あとは『Accept Stripe Payments』で作成したショートコードを固定ページに貼るだけ。するとショートコード以下の文章は購入者にしか閲覧できなくなります。

WordPress
保存する時に便利だよ
  • URLをコピーしました！
  • URLをコピーしました！
目次