【Go Sub Tips】新しいお客様アカウントに対応！注文詳細ページにサブスクリプション管理ボタンを設置する方法を解説

ShopifyのサブスクリプションアプリGoSub を提供しているGO RIDEです！

Go Subは2025年1月のアップデートで、Shopifyの「新しいお客様アカウント」に対応しました。今回の記事ではお客様アカウントへのGo Subのボタン設定や、 Checkout Blocksアプリを用いて注文詳細画面に動的にサブスクリプション管理ボタンを表示させる方法について解説します。

詳細な手順をご説明しますのでGo Subをご利用中のマーチャント様はぜひご確認ください！

GoSubってなに？どんな機能があるの？という方はぜひ以下のボタンから資料をご請求ください。

Shopifyにはお客様アカウントの種類が2種類用意されています。Go Subでは今まで「従来のお客様アカウント」のみサポートしておりましたが、最新のアップデートで新しいお客様アカウントもサポート対象となりました。

それぞれの違いについては、お客様アカウントについてのShopifyヘルプページをご確認ください。

https://help.shopify.com/ja/manual/customers/customer-accounts

Shopify設定＞お客様アカウント にて、「お客様アカウント」を選択します。

2024年12月より、名称が「新しいお客様アカウント」から「お客様アカウント」に変更になっています。本記事では明確なご説明のため「新しいお客様アカウント」の名称を使用します。

カスタマイザから、Go Sub Blockを注文ページに挿入します。

上部のページ選択箇所で「注文」を選択します。

ページヘッダーのアプリブロック追加からGo Sub Blockを追加し、保存します。

プレビューではこのようにボタン等は表示されませんがご安心ください。

実際にストアからアカウントにログインいただき、表示をご確認ください。

注文一覧ページにはこのようにボタンが表示されます。この「サブスクリプション管理」というテキストはGo Subの設定から変更可能となっています。

Go Sub管理画面＞設定＞翻訳、テキスト変更 を開きます。

少し下にスクロールし、お客様アカウントページの「新規顧客アカウントページの契約一覧ページボタン」にて変更が可能です。

ページヘッダーのアプリブロック追加からGo Sub Blockを追加し、保存します。

一覧ページへの挿入時と同様に、プレビュー画面では表示を確認できません。

Go Sub管理画面＞設定＞翻訳、テキスト変更 を開き、該当箇所に文言を入力してください。

注文状況ページにGo Subブロックを追加した場合、 注文内にSelling Planが設定されているものがある場合に表示されます。

予約販売アプリなど、その他のアプリでSelling Planを使用している場合はGo Subのサブスクリプション出ない場合もブロックが表示されます。

そのため「この注文はサブスクリプションによる注文です」という文言は控えるなど、ご注意の上設定してください。

文言例

この注文がサブスクリプションによる注文の場合、「再購入」ボタンは押さないでください。（サブスクリプション更新は行われません） サブスクリプションの解約やスキップ、商品変更などの管理を行う際は以下の「サブスクリプション管理」ボタンから管理画面にお進みください。

外部アプリのCheckout Blocksを使用すると、セクションのスタイルの変更などを行うことができます。

Shopifyが公式で提供しているアプリで、どのShopifyプランでも無料で使用できるのでぜひダウンロードしてくださいね。

チェックアウト画面のカスタマイズはShopify Plusプランが必要ですが、注文確認画面やアカウント画面はプランを問わずご利用可能です。

Blocksのページから、Create blockを選択します。

以下はすでに作成済みのブロックがあるため、初めてインストールした場合は表示が異なりますのでご注意ください、

タイプはDynamic contentを選択します。

Go SubのデフォルトブロックはBanner exampleとほぼ同じ形で構成されています。今回の記事でもBanner exampleを使用しますが、他にも様々なカスタマイズが可能なのでいろいろ試してみてくださいね！

Block nameは管理用でお客様画面に表示されることはないため、後から管理しやすい名前を設定してください。

その後、Content ItemsのBannerからEditをクリックし、表示させる詳細を設定します。

Bannerの内容

• Title…ブロックに表示されるタイトル

• Content…ブロックに表示される内容です。お客様に伝えたい内容を記載してください。

• Banner status…今回のサンプルではCritical bannerを設定しています。

  • Info banner…背景グレー

  • Warning banner…背景イエロー

  • Critical banner…背景レッド

  • Success banner…背景グリーン

  • Plain banner…背景グレー（Info bannerに近い）

• Button label…ボタンに表示されるテキスト

• Button URL…Go Sub管理画面のURLを指定します。

  • https://xxxxxxxxxx/apps/gosubscride/subscriptions

  • 「xxxxxxxxxx」の部分はストアのURLを指定してください。

ここまでの設定では、全ての注文に作成したブロックが表示されてしまいます。そのため、表示ルールを設定します。

Add display ruleから、Productセクション内にあるLine item has selling planを選択します。

 予約販売アプリなど、その他のアプリでSelling planを使用している可能性があるため設定時はご注意ください。

今回作成するブロックが初めての場合などはデフォルトの0のままで大丈夫です。

表示ルールが異なるブロックを同じ場所に設置したい場合などにそれぞれのブロックに共通IDを設定します。今回の記事では詳細は割愛します。

ここまで完了したらブロックを保存してください。

最後に ブロックのステータスをDraftからActiveに変更することをお忘れなく ！

Shopify設定＞チェックアウト＞チェックアウトカスタマイザ に移動します。

画面上のページ選択リストから、注文状況を選択します。

ページヘッダーのアプリブロックを追加から、 Checkout BlocksのDynamic contentを選択します。

アプリブロックのIDを指定します。

下の画面のように、プレビューでは表示されませんがご安心ください。

最後に、お客様アカウントにログインし注文詳細を確認してブロックが正しく反映されているか確認してください。

サブスクリプション注文の場合のみ表示されるようにルールを設定したため、対象ではない場合は表示されないためご注意ください。

いかがでしたか？今回の記事ではShopifyの新しいお客様アカウントにGo Subブロックやサブスクリプションに関する注意書きを表示する方法をお伝えしました。

今後もGo Subはどんどんアップデートしていきますので、アップデート情報もぜひ確認してくださいね！