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のテーマには適用されません。

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