「カートに追加する」の横にカートアイコンを表示させたい。

[mongorian346]

商品詳細ページにて、

自分のには「カートに追加する」ボタンにアイコンが表示されていません。

これは元々なのか、何かのエラーでこうなっているのか、

どちらにせよここにカートアイコンを表示させるためにどうすればいいですか？

 

[Qcoltd · Accepted solution]

ご質問いただいている、添付画像赤枠にカートアイコンを表示させることは可能です。

ご使用のテーマが不明なため、Dwanテーマを例に解説させていただきます。

Dwanテーマでない場合は下記手順のファイル名等が異なる場合があります。

カートアイコン表示手順

1. 管理画面より「オンラインストア > テーマ > カスタマイズボタンの横にある「…」 > コードを編集」からコード編集画面を開きます。
2. コード編集画面の「ファイルを検索」エリアに、『main-product.liquid』と入力しソートされたファイルを開きます。
3. main-product.liquidファイル内で、『<span>』を検索してください。
4. 3で検索した『<span>』の前の行に下記コードを記載

<style>
  .cart_icon {width:20px; height:20px; margin-right: 10px; }
  /* 上記：カートアイコンのサイズ、テキストとの空き幅調整 */
  .product-form__submit:disabled .cart_icon{display:none}
  /* 上記：売り切れなどボタンが押せない場合カートアイコンを非表示 */
</style>
<img  src="管理画面でアップロードした画像のURL" class="cart_icon">

追加例イメージ

表示例イメージ

ご参考まで。

(キュー小坂)

[mongorian346]

回答ありがとうございます。(テーマはDAWN)

教えて頂いた箇所に指定コードを書き込んだところ、以前実装した追尾するカート部分には反映されたのですが、メインの部分には反映されなかったです。

２つの部分は使用しているコードは同じなのですが、なぜか片方しか反映されないです。色々試してみたんですが、原因がよくわかりません。

[mongorian346]

反映しなかった部分はセクションのbuy-buttons.liquidで同じ手順を踏むと反映されました。