# カート内のカスタマイズについて

**URL:** <https://community.shopify.com/t/topic/23461>\
**Category:** 総合的なディスカッション\
**Created:** [October 23, 2020, 2:23am UTC](https://community.shopify.com/t/topic/23461 "2020-10-23T02:23:24Z")\
**Posts on this page:** 2\
**Page:** 1

## AI-generated summary

常温商品と冷蔵商品を同時にカート投入した際に、警告表示とチェックアウト不可（ボタンをグレーアウト）を実現できるかが相談された。アプリでの実装が難しかったため、カート内コード編集での対応を検討している。

提案された対応は以下。
- 商品にタグを付与：「常温」「冷蔵」をそれぞれ該当商品に設定。
- テーマのコード編集：sections/main-cart-footer.liquidでcart.itemsをループし、両タグが混在する場合に「保存温度の違う商品は同時に購入できません。」という警告文をLiquidで表示。
- チェックアウト制御：新規JSファイルでjQueryを使い、特定クラス（例：cart__check）がある場合に.checkoutボタン（.cart__checkout-button）へdisabled属性を付与して押せないようにする（jQueryのCDN読み込みが必要）。

結論として、タグ判定＋Liquid表示＋JSでのボタン無効化という方法でカート画面側のカスタマイズは可能、という方向性が提示されている。

<div class="post-metadata">

**Author:** ![Sakai\_1](https://avatars.discourse-cdn.com/v4/letter/s/8dc957/32.png) [@Sakai\_1](https://community.shopify.com/u/Sakai_1)\
**Post date:** [October 23, 2020, 2:23am UTC](https://community.shopify.com/t/topic/23461/1 "2020-10-23T02:23:24Z")

</div>

以前、常温、冷蔵の商品を同時購入できない設定をするために、おすすめのアプリを教えていただいたのですが、

アプリでの実装は難しく、やはり、カート内のコードを編集し実装を試みようと思うのですが、

初心者のため、なかなか糸口が見つけられずに困っています。

実現したいこととしては、

・「これらの商品は一緒に配送できません」等の警告文を表示  
・決済に進むボタン（チェックアウトボタン？）がグレーアウトし押せない

といった方法なのですが、こういったカート内の編集は可能なのでしょうか…？

無知申し訳ございませんがご教示いただけたら幸いです。

---

<div class="post-metadata">

**Author:** ![Anonymous\_5168086324d6fa4637c896de39bb248c](https://yyz1.discourse-cdn.com/shopifyforum/user_avatar/community.shopify.com/anonymous_5168086324d6fa4637c896de39bb248c/32/28647_2.png) [@Anonymous\_5168086324d6fa4637c896de39bb248c](https://community.shopify.com/u/Anonymous_5168086324d6fa4637c896de39bb248c)\
**Post date:** [December 22, 2021, 5:46am UTC](https://community.shopify.com/t/topic/23461/2 "2021-12-22T05:46:18Z")

</div>

1. 常温の商品には「常温」、冷蔵の商品には「冷蔵」というタグをそれぞれ設定します。

2、テーマの「アクション」→「コードを編集」へ進み、sectionsフォルダ内にあるmain-cart-footer.liquidファイルを開きます。

3、下記のコードを探してください

```markup

  

```

4、上記コードの上に以下のコードを挿入します

```javascript
{% assign normalTemperature = false %}
{% assign coldStrage = false %}

{% for item in cart.items %}
{% if item.product.tags contains '常温' %}
{% assign normalTemperature = true %}
{% endif %}
{% if item.product.tags contains '冷蔵' %}
{% assign coldStrage = true %}
{% endif %}
{% endfor %}

{% if normalTemperature and coldStrage %}

保存温度の違う商品は同時に購入できません。

{% endif %}

```

5、jsファイルを新規作成して、以下のコードを記述します（jQueryを使っていますので、CDNを読み込んでおいてください）

```javascript
$(function(){
  if ($("div").hasClass("cart__check")) {
    $(".cart__checkout-button").attr("disabled", "disabled");
  }
})

```
