> ## Documentation Index
> Fetch the complete documentation index at: https://docs.aftersell.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Upcart x Zepto Product Personalizer 連携

> Zepto Product Personalizer を Upcart と併用する際のリダイレクトや価格更新の問題を解決する方法を、セルフサービスの手順で紹介します。

<div id="overview">
  # 概要
</div>

Zepto Product Personalizer は Upcart と互換性がありますが、最適に動作させるにはいくつかの設定調整が必要になる場合があります。このガイドでは、よくある 2 つの問題（カートへのリダイレクトと価格の更新）とその解決方法を説明します。

<div id="1-zepto-redirects-to-the-cart-page-not-upcart">
  # 1: Zepto がカートページにリダイレクトする（Upcart ではなく）
</div>

デフォルトでは、Zepto は Upcart のサイドカートを表示する代わりに、お客様をカートページにリダイレクトします。

**解決方法:**

1. **Zepto** > **Settings** > **Add to Cart Settings** に移動します
2. \*\*「Action after a product is added to the cart」\*\*というセクションを見つけます
3. \*\*「Stay on the product page and show a success message」\*\*を選択します
4. 変更を保存します

Zepto 内の該当設定の場所は次のとおりです。

<img src="https://mintcdn.com/aftersell/uVGuDiyXpd6WOLO4/images/upcart/zepto-add-to-cart-settings.gif?s=308efe1faa8d9c56884aee560a8474ca" alt="Zepto の Add to Cart Settings で Stay on the product page and show a success message を選択" width="1154" height="720" data-path="images/upcart/zepto-add-to-cart-settings.gif" />

***

<div id="sometimes-the-product-price-doesnt-update-in-upcart-after-personalization-this-is-often-due-to-zepto-using-shadow-dom-which-can-prevent-upcart-from-detecting-price-changes">
  # パーソナライズ後に Upcart で商品価格が更新されないことがあります。これは多くの場合、Zepto が Shadow DOM を使用しているため、Upcart が価格の変更を検出できないことが原因です。
</div>

**解決方法:**

1. **Upcart** > **Cart Editor** > **Settings** > **Cart settings** に移動し、**Advanced Settings** を展開します
2. **Shadow DOM** というチェックボックスをオフにします
3. 変更を保存します
4. 他のアプリやテーマ機能の挙動に影響する可能性があるため、十分にテストしてください

💡 **注意:** Shadow DOM を無効にするとこの問題は解決する場合がありますが、テーマとの CSS の競合が発生する可能性があります。トレードオフの詳細については、[Shadow DOM 設定](/ja/upcart/render_cart_in_shadow_dom_setting)のドキュメントをご覧ください。

詳細については、[Zepto のドキュメント](https://productpersonalizer.com/docs/)も参照してください

<div id="whats-shadow-dom">
  ## ⚠️ Shadow DOM とは？
</div>

Shadow DOM は Upcart の高度な設定で、ページ上の他のコード（テーマやアプリなど）から Upcart を分離することで、スムーズな動作を実現するものです。ただし、Zepto のように、カートが価格を正しく更新できるようにするためにこの「壁」を取り払う必要がある場合もあります。

***

<div id="need-more-help">
  # さらにサポートが必要な場合
</div>

まだ問題が解決しない場合:

* **Zepto の設定については**、\*\*[Zepto サポート](mailto:support@product-personalizer.zendesk.com)\*\*にお問い合わせください
* 他の箇所が正常に動作しない場合は、すべての設定が保存され、テストされているかもう一度確認してください。
* 高度なカスタマイズのサポートが必要な場合は、[Shopify エキスパート](https://www.shopify.com/partners/directory)への相談をおすすめします
