まずは、ショップにサブスクリプションのオプションを表示できるよう、 テーマに各設定をインストールします。
※OS 2.0非対応 テーマの場合は、こちらをご覧ください。
<aside> ⚠️ 定期購買アプリのご利用にはShopify ペイメントのご利用が必須です。 Shopify ペイメントを導入されていない方はこちらをご参照ください。
</aside>
選択したテーマに定期購買アプリを設置します。
【設定する】ボタンをクリックする。（商品詳細ページの編集画面に遷移します。）
左縦メニュー【テンプレート > 商品情報】の【ブロックを追加】をクリックする。
【アプリブロック】内にある、【プラン一覧】を設定してください。 ※（パターン１）と（パターン２）は、デザインの違いになります。お好きな方をご利用ください。
<aside> ⚠️ ウィジェットが表示されない場合は、下記をご覧ください。 商品ページに定期購買ウィジェットが表示されません。
</aside>
【設定する】ボタンをクリックする。（アカウントページの編集画面に遷移します。）
アドレスとパスワードを入力して、ログインする。
左縦メニュー【テンプレート】の【セクションを追加】をクリックする。
【アプリ】タブにある、【定期購買_契約情報】を設定してください。
<aside> 🔰 ご設定いただきありがとうございます！ 続いては「2. 定期購買のプランを作成する」をご覧ください。
</aside>
<aside> 📧 定期購買アプリの設定に関して、お困りのことがございましたら、 下記までお気軽にお問い合わせください。
メールでのお問い合わせ([email protected])
</aside>
<aside> 💡 OS2.0非対応テーマの場合
<aside> 1️⃣ どのテーマで定期販売を可能にしますか？ ※選択したテーマに定期購買アプリを設置します。
<aside> 🔻 Sense (現在のテーマ)
</aside>
</aside>
<aside> 2️⃣ 商品詳細ページから定期購入できるよう、ウィジェットを表示する
商品ページsections/product-template.liquidのformタグ内の表示したい箇所に以下のコードを追加します。
<div class="huckleberry-subscription-widget-container"></div>
</aside>
<aside> 3️⃣ カートページに定期プランを表示する
sections/cart-template.liquidのカートページを表示したい箇所に以下のコードを追加してください。
※2021年以降にテンプレートをインストールしたストアはすでに表示される可能性があります。その場合このステップは不要です。
{% unless item.selling_plan_allocation == nil %}
<span>({{ item.selling_plan_allocation.selling_plan.name }})</span>
{% endunless %}
</aside>
<aside> 4️⃣ 顧客がマイページにアクセスするための動線を設置する
templates/customers/account.liquidのコード編集画面を開く。
※ファイル名はテーマテンプレートごとに異なる可能性があります。
「定期購入履歴」へのリンクを表示したい箇所に以下のコードを追加します。
<a href="/account?hbSubscriptionPath=/">定期購買一覧</a>
Liquidの最下部に以下のコードを追加します。
<div id="huckleberry-subscription-customer-portal-wrap">
<p><a href="{{ routes.account_url }}">アカウントに戻る</a></p>
<div id="huckleberry-subscription-customer-portal"></div>
</div>
</aside>
</aside>
<aside> <img src="/icons/checklist_purple.svg" alt="/icons/checklist_purple.svg" width="40px" /> ヘルプページ