Skip to main content
Upcart でカートドロワーが表示されたままになる問題（画面の左側に表示される、またはストアのインターフェースの右側や下に表示されるなど）が発生している場合、翻訳アプリを使用しているかどうかに応じて、2 つの原因が考えられます。

​
カートが右側に表示される、または商品ページのインターフェースに重なって表示される。

この問題は通常、デスクトップでは次のように表示されます（右側にハイライト表示）。 Upcart のカートドロワーが開いたまま右側に重なって表示されているストアフロントの商品ページ この問題を解決するには、Upcart の HTML 設定に短いスクリプトを挿入する必要があります。 以下の手順に従ってください。
  1. Shopify 管理画面で、Upcart > Cart Editor > Settings に移動します
  2. Custom HTML の下で、Select HTML Location ドロップダウン > Scripts (Before load) を選択します Upcart の Custom HTML ロケーションドロップダウンで、下部の Scripts Before Load がハイライトされている
  3. 次のコードをコピーして貼り付けます。
    Upcart のカスタム HTML 設定は次のようになります。 Upcart の Custom HTML エディターを Scripts Before Load に設定し、window.onload の append スクリプトを貼り付けた状態
  4. 上部までスクロールして Save をクリックします。Upcart の変更を保存してから反映されるまでに最大 1 分ほどかかります。

​
なぜこれが起こるのか？

Upcart の読み込み時には、ストアページの右側の画面外に配置されることを想定しています。しかし、特定のストアテーマやサードパーティの Shopify アプリが、Upcart の配置を含むページレイアウトを変更してしまうことがあります。その結果、Upcart が異なる位置で読み込まれ、常に表示されてしまうという表示上の不具合が発生します。上記のコード変更を実装すると Upcart の位置が修正され、本来の挙動に戻ります。

​
追加の手順

Upcart によるページ読み込み時にちらつきが発生する場合は、カートドロワーを非表示にする CSS の変更を試すこともできます。ただし、これはプレビューページでも Upcart が非表示になる点にご注意ください。
エディターは Settings の Custom CSS タブにあります（タブ行に収まらない場合は More settings の中にあります）。上記のコードをそこに貼り付けてください。 CartPreview の右パネルの幅を設定してドロワーを非表示にするルールが入力された Upcart の Custom CSS エディター

​
カートが左側に固定されている

これは通常、英語のままにしておくべき Upcart の設定を翻訳アプリが翻訳してしまうことが原因です。 Upcart は、特定の設定を英単語として Shopify のメタフィールドに保存しています。たとえば、カートの位置設定は「right」または「left」として保存されます。翻訳アプリが「right」をフランス語の「droite」に変更してしまうと、Upcart はその指示を理解できず、画面の左上をデフォルト位置として常に開いたままになります。 すべてのメタフィールドを翻訳すべきではありません Upcart のメタフィールドには 2 種類あります。
  • ボタンラベルやリワードメッセージなどのテキストフィールドは翻訳しても安全です
  • カートの位置やアップセルの方向などの挙動設定は英語のままにする必要があります
挙動設定を翻訳すると、Upcart が正常に動作しなくなります。 解決方法
  1. 翻訳アプリを開き、ストアメタデータまたはメタフィールドのセクションを見つけます
  2. Upcart のメタフィールドを確認し、cartPosition や upsellsDirection などの挙動関連フィールドの翻訳を削除します
  3. ストアフロントを更新すると、カートが正しい位置に戻るはずです
注: Upcart には現在、翻訳機能が組み込まれており、この問題を完全に回避できます。まだ翻訳を設定していない場合は、そちらの使用をおすすめします。詳細はカートの翻訳をご覧ください。