Skip to main content

​
概要

この機能を使うと、Shopify のエクスプレス決済オプション（Shop Pay、Apple Pay、Google Pay など）を表示し、購入者が保存済みの決済方法を使ってより速くチェックアウトできるようになります。 エクスプレス（迅速）チェックアウトボタンは、決済情報や配送情報の手動入力を省略できるため、リピーターのお客様がより早く購入を完了するのに役立ちます。これらのボタンはカート内のメインの Checkout ボタンの下に表示され、Shopify によって提供されます。 Upcart はこれらのボタンを視覚的・構造的にサポートしますが、その動作と表示は Shopify が制御します。 📘 詳しくは、迅速なチェックアウトに関する Shopify のドキュメントと迅速チェックアウトボタンに関する Shopify のリリースノートをご覧ください。 Upcart のチェックアウトボタンの下に表示された Shop Pay、PayPal、Google Pay のエクスプレスボタン

​
エクスプレス決済を表示させる

Upcart 内に迅速チェックアウトボタンを表示するには、Shopify テーマがストアフロント上にそれらをすでに含んでいる必要があります。これは次の方法で行えます：
  1. テーマコードにスニペットを追加する
    • オンラインストア > テーマ > コードを編集に移動します
    • layout/theme.liquid ファイルを開きます
    • 開始 <body> タグを見つけます（</body> ではありません）
    • そのタグの下に、以下のコードを貼り付けます：
  2. ファイルを保存します
以下は、どのように見えるべきかの例です： theme.liquid の body タグの下に追加された additional checkout buttons の Liquid スニペット これが完了すると、Upcart はエクスプレス決済オプションを検出してレンダリングできるようになります。 💡 コードの編集を避けたい場合は、開発者または Shopify Expert にご相談ください。

​
Payment gateways（決済ゲートウェイ）

Payment gateways カードはレガシー版の Express Payments モジュールに属するもので、ストアがまだ旧バージョンを使用している場合にのみ表示されます。Upcart がカートに表示できるエクスプレスゲートウェイの一覧が表示され、それぞれのオン/オフの切り替えと表示順の設定ができます。6 つのゲートウェイが一覧に表示されます：
  • Shop Pay
  • PayPal
  • Apple Pay
  • Amazon Pay
  • Meta Pay
  • Google Pay — 一覧には表示されますが、Coming Soon と表示されており選択できません
Google Pay は意図的に保留されています。カートが変更されても更新されないため、クリック前にカートを編集したお客様には古い価格が表示されてしまうからです。他の 5 つは有効化と並べ替えが可能です。有効なゲートウェイは順序付きリストに並び、各行の横にある上下の矢印で順序を変更できます。無効なゲートウェイはその下に表示され、クリックすると再び追加されます。
ここでゲートウェイを有効にしても、表示が保証されるわけではありません。Shopify ストアでそのゲートウェイが有効になっていない場合や、お客様が対象外の場合、実際のカートではゲートウェイは非表示になります。たとえば Apple Pay のボタンは、対応するデバイスとブラウザでのみ表示されます。ゲートウェイの有効化方法と各ゲートウェイの利用条件については、Shopify の迅速なチェックアウトのドキュメントをご覧ください。

​
迅速チェックアウトボタンのデザイン

ボタンのセットアップが完了したら、Upcart 内での表示方法をカスタマイズできます。

​
ボタンの高さ

  • Default button height（デフォルトのボタンの高さ）と Mobile button height（モバイルのボタンの高さ）は、それぞれ 25 px から 55 px の範囲で個別に設定できます
  • それぞれに数値フィールドとスライダーがあり、同じ値に連動しています。使いやすい方をご利用ください

​
チェックアウトボタンの配置

  • エクスプレスボタンの配置方法を選択します：
    • Left（左揃え）
    • Right（右揃え）
    • Center（中央揃え）
    • Space Between（両端揃え）

​
行間

  • 縦に並んだボタン間の垂直方向の間隔を、0 px から 40 px の範囲で設定します

​
高度な表示オプション

有効にすると、サブスクリプション商品がカートに入っているときに通常表示される購入者の同意メッセージが非表示になります。関連情報を別の場所ですでに提供している場合、視覚的なごちゃつきを減らすのに役立ちます。

​
カートを Shadow DOM でレンダリングする

これを有効にすると、Shopify テーマの CSS が Upcart のスタイリングに干渉するのを防げます。
これにより、すべてのブラウザとデバイスで一貫したデザインが保証されます。 これを有効にすると、Settings > Cart settings > Advanced Settings の同じ設定も適用されます。

​
テーマの互換性に関する注意事項

  • Shopify は現在、迅速チェックアウトボタンに対して厳格なスタイリングルールを適用しています。
  • Upcart の新バージョンはこれらのルールを完全にサポートしており、Shopify のスタイリング動作に従います。
⚠️ 現行モジュールでは、上部に Revert To Old Version バナーと Revert To Legacy Express Payments ボタンが表示されます。これは古いテーマにのみ必要なものです。元に戻すと、Shopify スタイリング適用前の動作に戻ってしまうため、テーマが本当に必要としない限り触れないでください。 元に戻す場合は、以前のモジュールで保存したスタイリングオプションのチェックをすべて外し、新バージョンに干渉しないようにしてください。