1. ノーコードで簡単インストール
定期購買アプリの利用方法について解説します。
まずはショップにサブスクリプションのオプションを表示できるようにテーマに各設定をインストールします。
尚、OS 2.0(Online Store 2.0)対応/非対応 テーマにより、インストール方法が異なります。
ご使用のテーマにあわせてガイドをご覧いただき、ご不明点がございましたら、下記メールアドレスまでお問合せ下さい。(お問い合わせ先:cs-subscription@huckleberry-inc.com )
OS 2.0 対応テーマの場合
OS 2.0(Online Store 2.0)対応テーマへのインストール方法は下記をご参照下さい。
※OS 2.0対応:DAWN・Crave・Sense・Craft は、インストール保証テーマです。
OS 2.0 非対応テーマの場合
OS 2.0(Online Store 2.0)に対応していないテーマへのインストールは下記をご参照下さい。
- アプリをShopify app storeからインストールします
- 管理ページ左メニュー「アプリ管理」から「定期購買アプリ」をクリック

- 「ダッシュボード」タブの1. テーマにかんたんインストール!から「かんたんインストールする」をクリック
インストール保証しているテーマ一覧はこちら

- 上記の画面に遷移します。ここで必要な設定をショップのテーマにインストールします。

- テーマを選択より現在お使いのテーマを選択してください。
*追加されているテーマより選択いただけます。
*一部対応していないテーマがございます。ご了承ください。

- 「2. 商品詳細ページにプランを表示」から「インストール」をクリック。
正常にインストールできると、「インストールしました」と表示されます。

「商品詳細ページにプランを表示」するには、ShopifyPaymentが設定されている必要があります。詳しくは、こちらから>>
*「該当のセクションが存在しません」と表示された場合は、下図のコピーボタンをクリックして、Shopify管理ページの「オンラインストア」から「アクション > コードを編集する」より、Sectionsフォルダのproduct-template.liquidの任意の箇所にコードを貼り付けてください。

*インストール後、上図の
「sections/product-template.liquid」
をクリックするか、またはShopify管理ページの「オンラインストア」から「アクション > コードを編集する」より、下図のようにSectionsフォルダに上記のコードが挿入されているか確認してください。(画像の例はDebutのテーマになります。テーマごとに挿入される場所が違いますのでご注意ください)

- 「3.カートページにプランを表示」から「インストール」をクリック。
正常にインストールできると、「インストールしました」と表示されます。

*「該当のセクションが存在しません」と表示された場合は、下図のコピーボタンをクリックして、Shopify管理ページの「オンラインストア」から「アクション > コードを編集する」より、Sectionsフォルダのproduct-template.liquidの任意の箇所にコードを貼り付けてください。
*貼り付ける箇所がわからない場合は、お問い合わせください。

*インストール後、上図の
「sections/cart-template.liquid」
をクリックするか、またはShopify管理ページの「オンラインストア」から「アクション > コードを編集する」より、下図のようにSectionsフォルダに上記のコードが挿入されているか確認してください。(画像の例はDebutのテーマになります。テーマごとに挿入される場所が違いますのでご注意ください)

- 「4. マイページに「定期購買の注文履歴」へのリンクを表示」からコピーボタンをクリック。

上図の
「templates/customers/account.liquid」
をクリックするか、Shopify管理ページの「オンラインストア」から「アクション > コードを編集する」より、
templates/customers/account.liquid
の任意の場所に貼り付けてください。"Debut" テンプレートの場合などは、ログアウトの隣に設置するのがオススメです。
例)
<div class="section-header text-center">
<h1>{{ 'customer.account.title' | t }}</h1>
<a href="/account?hbSubscriptionPath=/">定期購買一覧</a>
{{ 'layout.customer.log_out' | t | customer_logout_link }}
</div>
*貼り付ける箇所がわからない場合は、お問い合わせください。
- 「5. 注文履歴ページの表示」から、「インストール」をクリック。
正常にインストールできると、「インストールしました」と表示されます。

以上でインストールが完了します。