PayPal決済でサブスクリプションを導入する方法を備忘録としてまとめておきます。
基本手順
- PayPalアカウントを作成（今回の本筋から外れるため省略）
- ログイン
- 右上の歯車を選択
- 『売り手向けツール』を選択
- 『PayPalボタン』＞『管理する』を選択
- 『購読する』または『SmartSubscription』ボタンを選択
- 商品の情報を設定
ウェブサイトのHTMLに生成されたコードを貼り付けます。
SmartSubscriptionを使用する場合の注意点
サブスクリプションは今まで『購読する』というボタンで作成していました。
SmartSubscriptionは後から追加された機能で、UIがとてもきれいでユーザからしてもクリックしやすい見た目となっています。
しかし、以下の点に注意が必要です。
■作成したボタンは保存されないため、都度作成する必要がある（HTMLに埋め込むため、更新頻度は高くないはず）
■メールでの送信は難しく、ウェブページに埋め込むことしかできない。
従来の『購読する』ではメールでURLを送ることができた。ただ、これも単なる文字列として送ることになるのであまり良くはない。
■作成したボタンから決済に進むとその先の画面が英語表記になる。
フッターで言語を変えることはできるがデフォルトの変更不可。
従来の『購読する』ボタンでは、作成時のステップ3で、変数に『cl=JP』と打ち込むことで日本語表記にすることができた。
■PayPalサブスクリプション登録というボタンの他に、『PayPal CREDIT』ボタンと、黒い謎のボタンが併設される。
『PayPal CREDIT』はPayPalログインアカウント登録を要求するもので、謎の黒いボタンは登録せず決済に進むもののようだが、どちらも最初は英語の画面が出るためとても使えるものではない。
■テンプレートが使用できない
単発の請求では、基本請求額＋クーポン割引額、のように商品を組み合わせて請求することができるが、SmartSubscriptionではそもそも登録されている商品自体を引用することができない。
SmartSubscriptionをワードプレスに埋め込む
一般的な『購読する』ボタンでは、HTMLのみで作られているため、ワードプレスのテキストエディタで問題なく埋め込むことができます。
しかし、SmartSubscriptionはjavascriptを使用しているため、テキストエディタで埋め込むことができません。
そのためWordPressのプラグインであるScripts n Stylesを使用して埋め込みます。
参考：
個別ページにJavaScriptを埋め込めるWPプラグイン”Scripts n Styles”の紹介 | Fukuro Press
これで個別記事ページにjavascriptを記述するフィールドが出現します。
ここから少しコツがいります。
SmartSubscriptionで生成されたコードは以下のような形態です。
<div id="paypal-button-container-●●"></div> //本文に貼り付け
<script src="https://www.paypal.com/sdk/js?●●></script> //本文に貼り付け
<script>
//ここから下をScripts n Stylesによって出現したjavascript記述フィールドに貼り付け
paypal.Buttons({
style: {
shape: 'rect',
color: 'gold',
layout: 'vertical',
label: 'subscribe'
},
createSubscription: function(data, actions) {
return actions.subscription.create({
/* Creates the subscription */
plan_id: '●●'
});
},
onApprove: function(data, actions) {
alert(data.subscriptionID); // You can add optional success message for the subscriber here
}
}).render('#paypal-button-container-●●'); // Renders the PayPal button
//javascript記述ここまで
</script>ポイントは、最初の2行は本文のテキストエディタに貼り付け、その他はjavascript記述用のフィールドに貼り付けること。
また、javascript記述フィールドに貼り付けるところでは、すでに
