見出し画像

【福塚】Shopify Subscription APIを利用した定期購読システムについて

アパレルウェブ｜グローバルマーケティングdiv.

【2021/2/18 更新】現在、無料プランに加え、有料プランが追加されているようです。主な違いはトランザクションフィー率の違いだけのようですが、今後プランごとに機能制限をする可能性も言及されていました。

こんにちは。
今週の更新は僕が担当します。

さて、今日は割と役に立つであろうネタを記事にしようかと思います。

先日のShopify Updateにて発表された「Subscription API(s)」。

元々、Shopifyではサブスクリプション/定期購読システムは実装されておらず、サードパーティのアプリを追加して対応するのが常でした。また、決済においてもShopify Paymentsを使用する事ができないため、Stripe等の別の決済プロバイダを契約し、サブスク商品の決済だけ別ルートの決済（Stripe等）を使用するという仕組みでした。

この仕組、Eコマースの運用を1本化するためにShopifyにされた方にとってはすごく大きな障壁になっていたかと思うんです。顧客管理も決済管理も別サービスになってしまいますし・・・。

そこで満を持して登場したのが公式サブスクAPI/機能なわけですが、色々と触っていて、わかったことも多かったので備忘録代わりにシェアしたいと思います。

使用するアプリ

サブスク実装アプリでメジャーなのはやはり「Bold Subscriptions」ですが、ランニングコストがある程度必要です。2020年12月現在、おそらく手頃に始められるサブスク実装アプリはこのアプリになるかと思います。無料です。今回はこちらのアプリを使用します。

インストール

インストール自体は、ほぼ自動でやってくれます。

画像1

（ごめんなさい、スクショめっちゃ端折ってますw）

インストールすべきスニペット（コード）/トークンは、全てで7〜8個ありまして、STEP1で度のテーマにインストールするか選択し、後はボタンクリックで自動インストールでした。

アカウントに紐づくサブスク管理ページのリンク挿入だけテーマソースから手動インストールでした。

定期購読プランの作成

多分、UIに英語しか無いアプリで最もハードルか高い設定箇所って「主要箇所の設定」ですよね。とってもわかります。ここでだいたいやる気落としちゃいますよね（笑

ありがたいことにPayWhirlはそこまで難しくなかったですが、軽く説明を。

1. 「Manage Plans」から「Create」をクリックします。
　  ※考え方としては一つの商品（商品群）に対しての定期購読のプランを
　     作ると思えばいいです。

画像2

2. まず「Selling Plan Group」に入れる名前としては、
　①Internal name・・・アプリ内で使用するプランの名前（設定名）
　②Public name・・・商品詳細ページ内の定期購読の選択肢名
　③Plan selector title・・・定期購読種別選択名

画像3

・・・書いてて意味わからなくなってきました（笑

②については、商品詳細ページで1回購入か定期購読かを選ぶ箇所で、「定期購読」を意味するラベル名を設定する箇所になります。（画像の「②」の箇所）

③については、定期購読の周期を選択する際に表示する項目名を設定する箇所です。（画像の「③」の箇所）

要は、②は「定期購読」、③は「購読周期」とかがオーソドックスかなと。

画像4

3. 名前を決めたら、お次は肝心の中身、「周期」を決めていきます。

画像5

Name・・・販売プランの名前なので、「毎週」や「毎月」ってのがオーソドックスかな・・・？
Plan selector label・・・選択肢にどういう項目名として出すのか？なので、上記同様の名前を付けるのがいいかな？
Description・・・その項目に対しての説明が必要なら書いてね。

お次に、「Billing Rules」の制定です。

Interval・・・定期購読周期を制定します。単位は「年」「月」「週」「日」
Min number of fullfilments before the customer can cancel・・・キャンセル可能になる最小注文数
Max number of fullfilments・・・最大注文数
Discount or manual price・・・割引額軸設定（○円引 or %引 or 指定価格）
Adjustment value・・・割引額設定（○円引 or %引 or 指定価格）
※割引額設定してもしれっと表示価格変わるだけなので、どのぐらいディスカウントしているかどうかを記載したい場合はPlan selector titleに記載必要です。

例えば、個々までの設定で「毎週」用のプランを作って、別で「毎月」用のプラン作りたい場合は、「Insert selling plans」をクリックすれば追加できます。

設定をすべて終えたら「Save」をクリックして、完了です。

サブスク商品の作成

プランを作ってて気がつくことは「あれ、商品と紐付ける箇所がない・・・」でした。まさに今回、APIができたからこそなんでしょうけど、PayWhirlには商品紐付けの設定画面が存在しませんでした。

で、どこで商品と紐付けるのかというと、Shopifyの商品管理から、特定の商品の管理画面を開くと下の方に見慣れない「サブスクリプション」という項目が増えてます！（画像参照）

画像6

「オプションを追加する」をクリックすると、「既存のオプションを選択する」をクリックします。（ちなみに「新しい・・・」をクリックすればその場で新しいサブスクオプションも作成できます）

画像7

そうすると先程作成したサブスクプランが選べるようになっているので、選択します。

画像8

選択後、「Add Plan」をクリックすると、自動でステータス更新されてるので、設定は以上です。（「この商品の購入は・・・」にチェック入れておくと定期購読のみの販売担って1回のみの購入はできなくなります。）

画像9

注意点・留意点

お手軽にサブスク始めるには設定も含めハードルはかなり低い印象です。

が、しかし。

注意点、留意点が2つありまして、
一つは「Shopify Payments以外の決済が有効になっている場合はそもそも定期購読機能が有効にならない、機能解禁されない」です。

設定しようと思ってはじめに躓いた箇所なんですが、
Shopify Paymentsが設定されてないストアで上記設定しても、
商品ページに定期購読メニューが表示されないんです。

理由は簡単で、決済方法がShopify Paymentsしか対応してないためです。

もう一つは「翻訳作業が発生する」です。

海外製アプリなんで設定UIについても翻訳されてないんですが、お客さまが使用するフロントページ（定期購読管理ページ）もデフォルトはもちろん英語です。

画像10

翻訳設定自体は Settings ＞ Manage translations から行えますので、手間ですが手動翻訳を頑張ってください・・・！

また、商品ページにある「一回のみ購入」などの文言も元は英語なんですけど、上記をすべて翻訳しても「One-time purchase」となったままになっているかと思います。（下記は僕で翻訳済みのため、One-time purchaseとは表示されてません）

画像4

で、どこで修正するのかというと、liquidファイルの修正が必要になります。

テーマコード編集にて「paywhirl-settings.liquid」を開き、最下部あたりにTranslationに関わる記述があるのでその箇所を修正します。

画像12

初期状態では、英語（en）とポーランド語（pl）しか無いので、日本語（ja）を追加してあげます。

画像13

  /*
* Translations
  */
 translations: {
   en: {
     'plan-selector-title': 'Purchase options',
     'one-time-purchase-label': 'One-time purchase',
   },
   pl: {
     'plan-selector-title': 'Opcje zakupu',
     'one-time-purchase-label': 'Jednorazowy zakup',
   },
   ja: {
     'plan-selector-title': '定期購入方法',
     'one-time-purchase-label': '一回のみ購入',
   }
 }

※「定期購入方法」や「一回のみ購入」はご自由に記述変更してください。

後は変更保存してあげれば翻訳作業はほぼ完璧・・・なはず（笑

最後に・・・

ざっくりとした説明でしたがいかがでしたでしょうか？

Shopify Subscription APIに関して日本語の文献はまだそう多くないので、お役に立てば幸いです。良ければSNSでシェアしてくれると嬉しいです。また、Twitterもやってるので合わせてフォローしてもらえると好きがこぼれ落ちます（©kemio


いいなと思ったら応援しよう！