> ## 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.

# Ustawienie renderowania koszyka w shadow DOM

> Ten artykuł wyjaśnia, co robi ustawienie Render Cart in Shadow DOM i jak rozwiązywać problemy związane ze stylami lub konfliktami integracji między Twoim motywem Shopify a Upcart.

<div id="what-shadow-dom-does">
  ## Co robi Shadow DOM
</div>

Gdy ustawienie **Render Cart in Shadow DOM** jest **włączone**, Upcart tworzy samodzielną przestrzeń, która oddziela jego style i skrypty od reszty Twojego sklepu.

Oznacza to, że:

* Globalny CSS Twojego motywu nie może nadpisać wyglądu Upcart.
* Style Upcart również nie będą zakłócać działania Twojego motywu.
* Koszyk pozostaje spójny na różnych urządzeniach i motywach.

Możesz myśleć o Shadow DOM jak o „ochronnej bańce” wokół koszyka, która pomaga mu wyglądać i działać tak, jak powinien.

***

<div id="how-this-happens">
  ## Skąd się to bierze
</div>

Motywy Shopify i motywy firm trzecich często zawierają globalny CSS i JavaScript, które mogą nieumyślnie wpływać na wygląd lub działanie Upcart.

Ustawienie **Render Cart in Shadow DOM** pomaga zapobiegać tym konfliktom, izolując koszyk wysuwany Upcart we własnym chronionym środowisku. Po włączeniu Shadow DOM utrzymuje spójny wygląd i układ koszyka niezależnie od aktualizacji motywu czy zmian w niestandardowym kodzie.

Jeśli jednak Twój motyw lub aplikacja firmy trzeciej potrzebuje bezpośredniego dostępu do elementów koszyka, ta izolacja może czasem powodować trudności z integracją.

***

<div id="technical-considerations">
  ## Kwestie techniczne
</div>

Jeśli Ty lub deweloper musicie modyfikować elementy wewnątrz Upcart za pomocą JavaScript, ważne jest, aby używać właściwych odwołań do dokumentu:

* Użyj `upcartDocumentOrShadowRoot`, gdy odwołujesz się do elementów **wewnątrz** Upcart.
* Użyj `document`, gdy odwołujesz się do elementów **poza** Upcart (na przykład nagłówka lub stopki motywu Shopify).

Chociaż Shadow DOM jest izolowany, Upcart nadal udostępnia sposoby interakcji z Twoim motywem i innymi aplikacjami poprzez swoje **Public API** i funkcje pomocnicze.

***

<div id="troubleshooting-and-limitations">
  ## Rozwiązywanie problemów i ograniczenia
</div>

W większości przypadków włączenie Shadow DOM automatycznie naprawi konflikty CSS i układu.\
Zawsze jednak mogą wystąpić sytuacje, w których nadal napotkasz problemy:

* **Aplikacje cenowe:** Jeśli inna aplikacja musi bezpośrednio modyfikować ceny lub zachowanie checkoutu wewnątrz koszyka, Shadow DOM może to utrudniać, ponieważ ukrywa wewnętrzną strukturę Upcart przed zewnętrznymi skryptami.
* **JavaScript na poziomie motywu:** Niestandardowe skrypty korzystające z `document.querySelector()` mogą nie znajdować elementów koszyka, gdy Shadow DOM jest włączony.

Jeśli musisz przetestować zachowanie sklepu pod kątem takich integracji, możesz tymczasowo wyłączyć to ustawienie: otwórz edytor koszyka, przejdź do **Settings → Cart settings**, rozwiń **Advanced Settings** i odznacz **Render cart in shadow DOM**.
