表示する決済アイコンを選択する

このページはSep 15, 2024に印刷されています。最新のバージョンについては、https://help.shopify.com/ja/manual/online-store/themes/themes-by-shopify/vintage-themes/customizing-vintage-themes/add-credit-card-iconsをご覧ください。

すべての無料のShopifyテーマには、フッターに決済アイコンを表示するオプションが含まれています。表示されるアイコンはストアの決済設定とお客様の地域および通貨で決まります。決済アイコンは、テーマエディタで有効にできます。決済設定を変更せずに決済アイコンを追加または削除する場合は、テーマコードを編集します。

フッターにあるクレジットカードのアイコン

目次

フッターの決済アイコンを有効にする

カスタマイズの最初のステップでは、次の手順でフッターの決済アイコンを有効にします。

  1. テーマエディタに移動します。

  2. [フッター] をクリックします。

  3. [決済アイコンを表示する] チェックボックスをオンにします。

  4. [保存] をクリックします。

決済アイコンのコードを編集する

この手順では、決済アイコンをフッターに割り当てる方法を変更します。テーマには、管理画面の [決済設定] セクションで有効にした決済ゲートウェイサービスに関連付けられており、現在のお客様の地域および通貨で利用できるアイコンがデフォルトで表示されます。このカスタマイズを行って、表示する決済アイコンを手動で追加または削除します。

手順：

  1. 管理画面から [オンラインストア] > [テーマ] に移動します。
  2. 編集するテーマを見つけて、[...] ボタンをクリックしてアクションメニューを開き、[コードを編集する] をクリックします。
  3. [セクション] ディレクトリで、[footer.liquid] をクリックします。テーマにこのファイルが含まれていない場合、[レイアウト] ディレクトリの [theme.liquid] をクリックします。
  4. ファイルで次のコードを探します。 
{% for type in shop.enabled_payment_types %}
  1. そのコードを次のコードに置き換えます： 
{% assign enabled_payment_types = 'visa,master,american_express,paypal' | remove: ' ' | split: ',' %}
{% for type in enabled_payment_types %}
  1. 貼り付けたコードには、決済サービスのリストが、以下のようにカンマ区切りで表示されています。visa,master,american_express,paypal このリストに含めた決済サービスの決済アイコンがオンラインストアに表示されます。ニーズに合わせて決済サービスのリストを編集できます。利用可能な値のリストを確認して、リストから必要なアイコンの名前を.svg拡張子を付けずにコピーします。一般的な値は以下のとおりです：- afterpay - american_express - apple_pay - bitcoin - dankort - diners_club - discover - dogecoin - dwolla - facebook_pay - forbrugsforeningen - google_pay - ideal - jcb - klarna - klarna-pay-later - litecoin - maestro - master - paypal - shopify_pay - sofort - unionpay - visa
  2. [保存] をクリックします。
  1. Shopifyアプリで [...] ボタンをタップします。
  2. 販売チャネルセクションで、[オンラインストア] をタップします。
  3. [テーマを管理する] をタップします。
  4. 編集するテーマを見つけて、[...] ボタンをクリックしてアクションメニューを開き、[コードを編集する] をクリックします。
  5. [セクション] ディレクトリで、[footer.liquid] をクリックします。テーマにこのファイルが含まれていない場合、[レイアウト] ディレクトリの [theme.liquid] をクリックします。
  6. ファイルで次のコードを探します。 
{% for type in shop.enabled_payment_types %}
  1. そのコードを次のコードに置き換えます： 
{% assign enabled_payment_types = 'visa,master,american_express,paypal' | remove: ' ' | split: ',' %}
{% for type in enabled_payment_types %}
  1. 貼り付けたコードには、決済サービスのリストが、以下のようにカンマ区切りで表示されています。visa,master,american_express,paypal このリストに含めた決済サービスの決済アイコンがオンラインストアに表示されます。ニーズに合わせて決済サービスのリストを編集できます。利用可能な値のリストを確認して、リストから必要なアイコンの名前を.svg拡張子を付けずにコピーします。一般的な値は以下のとおりです：- afterpay - american_express - apple_pay - bitcoin - dankort - diners_club - discover - dogecoin - dwolla - facebook_pay - forbrugsforeningen - google_pay - ideal - jcb - klarna - klarna-pay-later - litecoin - maestro - master - paypal - shopify_pay - sofort - unionpay - visa
  2. [保存] をクリックします。
  1. Shopifyアプリで [...] ボタンをタップします。
  2. 販売チャネルセクションで、[オンラインストア] をタップします。
  3. [テーマを管理する] をタップします。
  4. 編集するテーマを見つけて、[...] ボタンをクリックしてアクションメニューを開き、[コードを編集する] をクリックします。
  5. [セクション] ディレクトリで、[footer.liquid] をクリックします。テーマにこのファイルが含まれていない場合、[レイアウト] ディレクトリの [theme.liquid] をクリックします。
  6. ファイルで次のコードを探します。 
{% for type in shop.enabled_payment_types %}
  1. そのコードを次のコードに置き換えます： 
{% assign enabled_payment_types = 'visa,master,american_express,paypal' | remove: ' ' | split: ',' %}
{% for type in enabled_payment_types %}
  1. 貼り付けたコードには、決済サービスのリストが、以下のようにカンマ区切りで表示されています。visa,master,american_express,paypal このリストに含めた決済サービスの決済アイコンがオンラインストアに表示されます。ニーズに合わせて決済サービスのリストを編集できます。利用可能な値のリストを確認して、リストから必要なアイコンの名前を.svg拡張子を付けずにコピーします。一般的な値は以下のとおりです：- afterpay - american_express - apple_pay - bitcoin - dankort - diners_club - discover - dogecoin - dwolla - facebook_pay - forbrugsforeningen - google_pay - ideal - jcb - klarna - klarna-pay-later - litecoin - maestro - master - paypal - shopify_pay - sofort - unionpay - visa
  2. [保存] をクリックします。

Shopifyで販売を開始する準備はできていますか?

無料体験を試す