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

# Moduł nagłówka

> Dowiedz się, jak zaktualizować nagłówek w koszyku Upcart, w tym logo, style tytułu, przycisk zamykania i układ.

<div id="overview">
  # Przegląd
</div>

Moduł nagłówka pozwala Ci dostosować górną sekcję koszyka Upcart, dodając logo Twojej marki, tekst tytułu, układ, kolor tła i przycisk zamykania. Wizualne kontrolki ułatwiają stylizację nagłówka bez konieczności definiowania dokładnych rozmiarów w pikselach.

<div id="header-module-settings">
  # **Ustawienia modułu nagłówka**
</div>

<div id="general">
  ## **General**
</div>

**Height** przełącza między **Slim** a **Tall**, aby kontrolować przestrzeń pionową. **Bottom border** to **None** lub **Thin**. **Background color** przyjmuje kod hex lub wbudowany selektor kolorów i obsługuje przezroczystość.

<img src="https://mintcdn.com/aftersell/uxKAdY-e0h16xa48/images/upcart/header-module-height-and-background.gif?s=982cf4fec081aa2c1b62901e53602b80" alt="Ustawienia General modułu nagłówka Upcart z kontrolkami wysokości i koloru tła obok podglądu koszyka" width="2172" height="1080" data-path="images/upcart/header-module-height-and-background.gif" />

<div id="title">
  # **Tytuł**
</div>

Istnieją **trzy sposoby** zdefiniowania tytułu nagłówka koszyka wysuwanego: odziedziczenie domyślnej stylizacji tytułów z szablonu, wyświetlenie logo sklepu lub utworzenie w pełni niestandardowych stylów tekstu. Każda metoda oferuje elastyczność w zależności od Twoich potrzeb projektowych.

<img src="https://mintcdn.com/aftersell/uxKAdY-e0h16xa48/images/upcart/header-module-title-options.gif?s=18bfdb000570d453195ba19bd5f0288b" alt="Opcje tytułu modułu nagłówka Upcart: dziedziczenie tytułów szablonu, logo marki lub niestandardowe style tekstu" width="1960" height="1080" data-path="images/upcart/header-module-title-options.gif" />

<div id="inherit-from-theme-titles">
  ## Dziedziczenie z tytułów szablonu
</div>

Ta opcja używa domyślnych stylów nagłówków Twojego szablonu, pomagając zachować wizualną spójność designu z resztą Twojej strony. Możesz dodać własny tytuł, używając pola Text, i dynamicznie uwzględnić liczbę pozycji koszyka za pomocą `{{cart_quantity}}`. Wyrównanie tekstu można ustawić na Side lub Center, a odpowiedni poziom nagłówka H2, H3 lub H4 możesz wybrać w oparciu o strukturę treści swojego sklepu.

<div id="brand-logo">
  ## Logo marki
</div>

Jeśli wolisz użyć logo marki zamiast tekstu, możesz przesłać logo swojego sklepu bezpośrednio w tej sekcji. Wybierz wyrównanie logo do Side lub Center i skaluj je suwakiem **Logo size**, który działa w zakresie od 14 px do 48 px. Nie ma wymuszonego limitu na przesyłany plik, ale zaleca się użycie pliku PNG dla czystej przezroczystości i ostrych krawędzi. JPEG-i są również obsługiwane, ale mogą zawierać szum tła lub pogorszyć detale logo. Ze względu na wydajność staraj się utrzymywać zoptymalizowane rozmiary plików.

* Zalecamy używanie pliku **PNG** dla najlepszej jakości i obsługi przezroczystych teł.
* JPEG-i też działają, ale mogą nie wyglądać tak czysto, zwłaszcza jeśli Twoje logo ma tło lub drobne detale.

<div id="define-text-styles">
  ## Definiowanie stylów tekstu
</div>

Wybranie opcji Text daje Ci pełną kontrolę nad stylizacją tytułu niezależnie od szablonu Twojego sklepu. Możesz wprowadzić dowolny niestandardowy tytuł i uwzględnić `{{cart_quantity}}` dla dynamicznych aktualizacji. Wyrównanie tekstu można ustawić na Side lub Center, z opcjami zmiany grubości czcionki na Normal, Semibold lub Bold. Rozmiar czcionki można regulować od 14 px do 48 px za pomocą wizualnego suwaka, a opcjonalnie możesz zastosować nadpisanie koloru tekstu.

<div id="close-button">
  # Przycisk zamykania
</div>

Przycisk zamykania można dostosować, aby pasował do designu Twojego sklepu. **Location** umieszcza go po lewej (Left) lub prawej (Right) stronie koszyka. **Background**, **Icon** i **Border** przyjmują po jednym kolorze plus osobny kolor hover. **Icon size** to Small, Medium lub Large, a **Icon thickness** to Normal lub Thick. **Border** to None, Thin, Normal lub Thick.

<Note>
  Pola koloru ramki i koloru ramki po najechaniu są wyłączone, gdy **Border** jest ustawiony na **None**. Najpierw wybierz szerokość ramki, a potem ustaw jej kolory.
</Note>

<img src="https://mintcdn.com/aftersell/uxKAdY-e0h16xa48/images/upcart/header-module-close-button-settings.png?fit=max&auto=format&n=uxKAdY-e0h16xa48&q=85&s=c8f941c774ff6f7029b0833c09ca000d" alt="Ustawienia przycisku zamykania modułu nagłówka Upcart dotyczące lokalizacji, kolorów, rozmiaru ikony i ramki" width="1170" height="1166" data-path="images/upcart/header-module-close-button-settings.png" />

<div id="custom-template">
  # Niestandardowy szablon
</div>

W wersji 2.0 modułu nagłówka pod ustawieniami pojawia się edytor kodu **Custom template**, z pojedynczym szablonem **Full** obejmującym cały moduł. Używa on JSX opartego na React, a najpierw musisz zaznaczyć **Access custom templates** w **Settings > Cart settings > Advanced Settings** w Cart Editor. Zobacz [Konfigurowanie niestandardowego szablonu](/pl/upcart/setting_up_a_custom_template_in_upcart).

<div id="tips">
  # Wskazówki
</div>

* **Chcesz precyzyjnych odstępów lub rozmiarów?** Użyj [niestandardowego CSS](/pl/upcart/custom_css) dla pełnej kontroli wykraczającej poza suwaki, świetne do dokładnych marginesów, paddingów lub skalowania logo.
* **Testuj na desktopie i urządzeniu mobilnym.** Elementy nagłówka, takie jak tekst, logo i przyciski, mogą wyświetlać się różnie na różnych rozmiarach ekranów
* **Używaj właściwych poziomów nagłówków.** Wybór odpowiedniego nagłówka (H2, H3, H4) pomaga w dostępności i SEO. Dopasuj strukturę treści swojego sklepu.

Aby poznać więcej sposobów personalizacji koszyka, zajrzyj do naszej [dokumentacji pomocy Upcart](/pl). Jeśli potrzebujesz niestandardowych zmian, zalecamy kontakt z [ekspertem Shopify](https://www.shopify.com/ca/partners/directory).