商品情報にスキップ
1 1

Shopifyのフッターに決済アイコンを追加する

Shopifyのフッターに決済アイコンを追加する

詳細を表示する

今回はフッターに決済アイコンを追加する方法です

before

after

きっかけ

何気なくストアのフッターを見てみたら、「paidyを導入したはずなのにアイコン表示されてない!?」と気づいたのがきっかけでした

まずテーマエディターで設定を確認

テーマエディタを開いて、フッターセクションの設定を確認しました

だけどちゃんと「決済アイコンを表示する(Show payment icons)」にチェック入ってる、、

調べてみると、どうやら自動で決済アイコンが反映されない場合もあるらしく、その場合は手動(Liquidを編集)して追加が可能とのこと

Liquidを編集して決済アイコンを追加

まず「コードを編集」から該当のファイルを探します

だいたい「footer.liquid」などそれっぽい名前のはず

該当ファイルから以下のコードを探します

{% for type in shop.enabled_payment_types %}

 

コードが見つけられたら以下のように書き換えます

{% assign enabled_payment_types = 'amazon,apple_pay,visa,master,などなどここにコードを追加' | remove: ' ' | split: ',' %}
 {% for type in enabled_payment_types %}

 

主要な決済方法のコードは以下の通りです

  • visa
  • master
  • american_express
  • jcb
  • diners_club
  • lawson
  • familymart
  • ministop
  • dailyyamazaki
  • seveneleven
  • merpay
  • pay_pay
  • line_pay
  • paidy

今回の学び

設定を鵜呑みにせず、ちゃんと隅まで自分の目で確認しよう

 

参考ページ

https://komoju-ja.helpscoutdocs.com/article/624-shopify

Shopifyヘルプセンター:表示する決済アイコンを選択する

このカスタマイズは以前のShopifyテーマ向けで、Online Store 2.0のテーマには適用されません。

と書いてありますが問題なく適用されました