株式会社オートプロジェクト

Columnコラム
カテゴリーから探す
アーカイブから探す
2023年5月12日
ShopifyでカートにCookie情報を持たせる方法

ShopifyでカートにCookie情報を持たせる方法を紹介します。

    1. Cookieを追加したいページのリキッドファイルの最下部に以下のコードを追記します。
    document.cookie = "my_custom_cookie="10"; path =/";
    1. カート情報のフッター部分に以下のコードを追記します。今回はテーマDawnを使用しているため、main-cart-footer.liquidの<div class=”cart__blocks”>下に追記します。
      <input id="power" class="field__input" type="hidden" name="attributes[power]" form="cart" value="{{cart.attributes['power']}}" required>
    1. 保持しているCookie情報を上で追記したinputタグのvalue属性として持たせたいので、cart.jsに以下のコードを追記します。
var myCookie = document.cookie.replace(/(?:(?:^|.*;\s*)my_custom_cookie\s*\=\s*([^;]*).*$)|^.*$/, "$1");
if( myCookie ){
  document.getElementById('power').value = myCookie;
}
  1. 1~3の手順を踏んだ上で、決済が完了し管理画面から注文の詳細を確認すると、画像のように追加の詳細として情報が保存されます。