※基本のテーマの編集手順はこちら
通常カートページへの設置手順
1. 導入手順を進め、Dawnを選択し、アプリでテーマを拡張するをクリックします。
2. ストアのカスタマイズ画面 > カートマークをクリックして、カート画面のカスタマイズ画面を開きます。
3. 左側メニューのブロックを追加 > アプリより、本アプリを選択してください。
4. プレビューを見ながら、モジュールの位置を調整します。
5. 保存するをクリックして完了です。
ポップアップの「購入手続きへ」ボタンを削除する方法
カートに商品を入れた際に出てくるポップアップ内、「購入手続きへ」のボタンから進むと、「今すぐ購入ボタン」と同じ原理で、配送日時を指定することができません。そのため、こちらの方法で「購入手続きへ」ボタンを削除することをお勧めいたします。
1. Shopify管理画面の左側メニュー、オンラインストア>テーマをクリックします。「現在のテーマ」内のアクション>コードを編集するを選択するとコード編集画面が表示されます。
2. 画面左側のディレクトリの中から、以下のテンプレートを探して開いてください。
cart-notification.liquid
3. 上記テンプレート内から、以下のコードを削除して保存してください。
※Dawnに今後、仕様の変更があった場合はコードが変わる可能性もございます。
<form action="{{ routes.cart_url }}" method="post" id="cart-notification-form">
<button class="button button--primary button--full-width" name="checkout">{{ 'sections.cart.checkout' | t }}</button>
</form>
このようになります。
ドロワーカートへの設置手順
ドロワーカートはテーマのカスタマイズで編集することができないため、Liquidコードを編集していただく必要がございます。
1. アプリ管理画面のテーマスニペットの再設置をクリック>ポップアップのOKをクリック
※「上書き更新…」というのは、Dawnの場合は基本的に考慮不要ですのでご安心ください。
2. Dawnのコード編集画面にて、snippets/cart-drawer.liquidを開く。
3. 373行目周辺、{%- endif -%}と<!-- Start blocks -→の間に、以下のコードを設置して保存する。
<div id="cart-delivery-datetime_section" data-os="1.0" data-timezones="{% for delivery_timezone in shop.metafields.cart_delivery_app['delivery_timezones_key'] %}'{{delivery_timezone}}',{%endfor%}"></div>
上記の配置にすると、このように↓小計の上にモジュールが設置されます。