サムネイル

Shopify ストアの決済方法(支払い方法)を条件に応じて非表示にするカスタマイズ方法を徹底解説!

目次

はじめに

今回の記事では、Shopify ストアの決済方法(支払い方法)カスタマイズについてや Shopify ストアの決済方法(支払い方法)を条件に応じて非表示にするカスタマイズ方法を解説します。

参考記事

Shopify ストアの決済方法(支払い方法)カスタマイズについて

Shopify ストアの決済方法(支払い方法)カスタマイズとは、顧客に表示される決済オプションを調整できる機能です。決済方法(支払い方法)の並び順、表示・非表示、決済方法名を条件に応じてカスタマイズすることができます。

要件として、 Shopify ストアの決済方法(支払い方法)をカスタマイズ(表示・非表示など)するには、ベーシックプラン、スタンダード、プレミアム、Plus のいずれかのプランを契約する必要があります。

決済方法(支払い方法)を条件に応じて非表示にするメリット

トラブルを未然に防ぐことができる

特定の商品に対して適切な決済方法を提供することで、購入プロセスを最適化し、トラブルを未然に防ぐことが可能です。例えば、高価な商品には分割払いを推奨するなど、商品特性に合った決済方法を提示できます。

支払いリスクを最小限に抑えることができる

注文金額に応じて決済方法を制限することで、高額な取引に適した決済方法を選択させ、支払いリスクを最小限に抑えることができます。例えば、少額の購入には手数料の低い決済方法を、大口注文には信頼性の高い決済方法を設定することが可能です。

地域や国に基づく制限ができる

地域や国によって利用可能な決済方法を制限することで、顧客が使用できない支払い方法を非表示にし、チェックアウトプロセスをスムーズに進行させます。これにより、地域ごとの規制や通貨に対応しやすくなり、トラブルを避けることができます。

カスタマーエクスペリエンスを向上できる

顧客にとって利用可能な決済方法を整理し、わかりやすい支払いオプションを提供することで、カスタマーエクスペリエンスが向上します。複雑な選択肢を排除し、簡単でストレスのない購入体験を提供することができます。

キャンペーンやプロモーションの効果を最大化できる

特定のキャンペーンやプロモーションに合わせて決済方法を変更することで、販売戦略を強化できます。例えば、特定の期間中に特定の決済方法のみを利用可能にすることで、プロモーションの効果を最大化できます。

決済方法(支払い方法)を条件に応じて非表示にする方法

決済方法(支払い方法)を条件に応じて非表示にする方法は、「決済方法(支払い方法)を非表示にできる Shopify アプリをインストールする」方法と「Shopify Plus を契約して決済方法(支払い方法)を非表示にできるカスタムアプリを作成する」方法の 2 パターンがあります。

決済方法(支払い方法)を非表示にできる Shopify アプリをインストールする

決済方法(支払い方法)を条件に応じて非表示にするために、Shopify アプリをインストールする方法があります。この方法は、コードの編集やプログラミングの知識を必要とすることなく、決済方法(支払い方法)を非表示にすることができます。普段、プログラミングをされていない方におすすめの方法です。

以下の手順で決済方法(支払い方法)を非表示にします。

  1. 決済方法(支払い方法)を非表示できるアプリのインストール
  2. 決済方法(支払い方法)を非表示できるアプリの設定

今回は、「シンプル決済カスタマイズ|お手軽条件ごとの決済方法」を使用して決済方法(支払い方法)を非表示にします。
シンプル決済カスタマイズ|お手軽条件ごとの決済方法

1. 決済方法(支払い方法)をカスタマイズできるアプリのインストール

Shopify App Store から「シンプル決済カスタマイズ|お手軽条件ごとの決済方法」をインストールします。

シンプル決済カスタマイズ|お手軽条件ごとの決済方法をインストール

Shopify ストアでアプリのインストールポップアップが表示されるので、「インストール」ボタンをクリックします。
インストールボタンをクリック

以下の画面が表示されれば、アプリのインストールは完了です。
アプリのインストールは完了

2. 決済方法(支払い方法)を非表示できるアプリの設定

Shopify で指定した条件下で特定の決済方法を非表示にできるアプリについて徹底解説|ご利用ガイド」を参考にアプリの設定を行います。

「決済カスタマイズ設定を追加」をクリックします。

「決済カスタマイズ設定を追加」をクリック

決済方法(支払い方法)非表示の設定名を入力します。

決済方法(支払い方法)非表示の設定名を入力

決済方法(支払い方法)を非表示にする条件を設定します。

決済方法(支払い方法)を非表示にする条件は、特定の商品、顧客タグ、注文金額、注文累計額、注文累計回数があるので、ストアにあった条件を設定してください。

決済方法(支払い方法)を非表示にする条件を設定

非表示にする決済方法(支払い方法)を選択します。

非表示にする決済方法(支払い方法)を選択

非表示にする決済方法(支払い方法)の表示

保存すると決済カスタマイズ設定管理に、決済方法(支払い方法)非表示設定が追加されます。

非表示設定一覧

決済方法(支払い方法)を非表示できるアプリの設定は完了です。

Shopify Plus を契約して決済方法(支払い方法)を非表示にできるカスタムアプリを作成する

Shopify Plus を契約している方は、クレジットカードの表示・非表示を直接カスタマイズする追加機能を利用できます。しかし、特定の商品や顧客タグなどの条件をつけて表示・非表示をすることができません。

特定の条件に応じて、決済方法(支払い方法)を非表示にするには、カスタムアプリを作成する必要があります。

カスタムアプリの作成は、Shopify の知識やプログラミングの知識が必要なため、普段、プログラミングをされていない方にはおすすめしません。

カスタムアプリの作成

公式ドキュメントを参考にカスタムアプリを作成します。

カスタムアプリの機能作成

Shopify から提供されている、Payment Customization API を使用して、機能を作成する必要があります。

Payment Customization API についての詳細は下記の記事をご覧ください。

Payment Customization API を使用した extensions を作成します。

extensions のファイルを作成できたら、各ファイルを条件によって決済方法(支払い方法)を非表示できるよう編集します。

公式ドキュメントの例)

input.graphql

query Input {
  cart {
    cost {
      subtotalAmount {
        amount
        currencyCode
      }
    }
  }
  paymentMethods {
    id
  }
}

output.json

{
  "operations": {
    "hide": {
      "paymentMethodId": "gid://shopify/PaymentCustomizationPaymentMethod/1"
    }
  }
}

extensions の実装が完了したら、Vercel や Heroku にアプリをデプロイします。

アプリとストアを紐づければ実装完了です。

まとめ

今回の記事では、Shopify ストアの決済方法(支払い方法)カスタマイズについてや Shopify ストアの決済方法(支払い方法)を条件に応じて非表示にするカスタマイズ方法を解説しました。現状、Shopify アプリをインストールする方法がベストプラクティスかと思います。

シンプル決済カスタマイズ|お手軽条件ごとの決済方法」を使用して決済方法(支払い方法)を非表示にします。
シンプル決済カスタマイズ|お手軽条件ごとの決済方法

参考記事

おすすめ Shopify アプリ

シンプルマイページバナー|お手軽顧客アカウント画像のアイコン

シンプルマイページバナー|お手軽顧客アカウント画像

顧客アカウントページにバナーを表示。画像をアップロードして URL を貼るだけで表示されます。

シンプルチェックアウト注文制限|お手軽購入制限ルールのアイコン

シンプルチェックアウト注文制限|お手軽購入制限ルール

カートとチェックアウトで不要な注文を柔軟なルールでブロック。45種類の条件を組み合わせ、コード不要。

シンプル栄養成分・アレルギー表示|食品表示のアイコン

シンプル栄養成分・アレルギー表示|食品表示

商品ページに栄養成分表示とアレルゲン情報を表示。お客様が安心して買い物できるようになります。

シンプルQRコード|お手軽QRコード作成・印刷アプリのアイコン

シンプルQRコード|お手軽QRコード作成・印刷アプリ

商品・コレクション・割引用のQRコードを作成。タグやチラシ、ポスターに印刷できます。

シンプルダークモード|お手軽配色切り替え・目に優しい表示のアイコン

シンプルダークモード|お手軽配色切り替え・目に優しい表示

ストアにダークモードボタンを追加。買い物客がワンタップで配色を切り替えられます。

シンプルソーシャルギフト|LINE・SNSで贈れるプレゼントのアイコン

シンプルソーシャルギフト|LINE・SNSで贈れるプレゼント

住所を知らなくてもギフトを贈れます。受取人が自分で配送先を入力します。

シンプルカスタムマウスカーソル|お手軽ポインターカスタマイズのアイコン

シンプルカスタムマウスカーソル|お手軽ポインターカスタマイズ

ストアのマウスカーソルを変更。形・絵文字・自分の画像から選べます。

シンプル低在庫アラート|在庫管理・在庫切れ通知・欠品防止のアイコン

シンプル低在庫アラート|在庫管理・在庫切れ通知・欠品防止

在庫が減ったらすぐ通知。商品・バリエーション・ロケーション別に設定できます。

関連記事