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

# Dostosuj rozmiar przycisku przyklejonego koszyka

> Dostosuj rozmiar i pozycję przycisku przyklejonego koszyka Upcart za pomocą CSS.

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

Przycisk przyklejonego koszyka Upcart można zmieniać pod względem rozmiaru i pozycji za pomocą niestandardowego CSS. Dzięki temu możesz lepiej dopasować go do brandingu swojego sklepu lub preferencji dotyczących doświadczenia użytkownika na komputerach i urządzeniach mobilnych.

Dostępne są dwa podejścia, w zależności od tego, jak dużej kontroli potrzebujesz.

***

<div id="option-1-scaled-resizing-simple-setup">
  ## Opcja 1: Skalowanie (prosta konfiguracja)
</div>

Ta metoda wykorzystuje pojedynczy współczynnik skali, aby proporcjonalnie zmniejszyć lub powiększyć przycisk i ikonę. To najprostszy sposób na dostosowanie rozmiaru przycisku przy minimalnej ilości kodu.

<div id="where-to-add-this">
  ## Gdzie to dodać
</div>

Przejdź do **Upcart > Sticky Cart > Custom CSS** i wklej poniższy kod.

```
/* Set your desired scale factor here */  
/* Recommended range: 1 (default) to 0.65 (smaller) */  
.upcart-sticky-widget {  
  transform: scale(0.55);  
}  
  
/* Scale up your quatity icon */  
/* Recommended range: 1 (default) to 1.25 (bigger) */  
.upcart-sticky-cart-quantity-icon {  
  transform: scale(calc(1.5));  
}
```

<div id="how-to-customize">
  ## Jak dostosować
</div>

* Zmień `transform`, aby zmienić rozmiar przycisku (np. `0.8`, `0.6`, `1.25` itd.)

<div id="option-2-pixel-specific-resizing-advanced-control">
  ## Opcja 2: Rozmiary w pikselach (zaawansowana kontrola)
</div>

Ta metoda pozwala kontrolować wymiary każdego elementu osobno za pomocą wartości w `px`. Użyj jej, gdy potrzebujesz precyzyjnych dostosowań, które nie opierają się na skalowaniu.

```
:root {  
  --widgetMainSize: 40px;  
  --widgetCartIconSize: 30px;  
  --widgetQuantityIconSize: 20px;  
}  
  
.upcart-sticky-widget {  
  height: var(--widgetMainSize) !important;  
  width: var(--widgetMainSize) !important;  
}  
  
[class*="styles_CartIcon"] {  
  left: -2px !important;  
  top: 4px !important;  
}  
  
.upcart-sticky-cart-quantity-icon {  
  height: var(--widgetQuantityIconSize) !important;  
  width: var(--widgetQuantityIconSize) !important;  
  top: -5px !important;  
  left: 25px !important;  
  z-index: 100 !important;  
}  
  
.upcart-sticky-widget svg {  
  display: block !important;  
  height: var(--widgetCartIconSize);  
}
```

<div id="how-to-customize-2">
  ## Jak dostosować
</div>

* Dostosuj zmienne w `:root`, aby zwiększyć lub zmniejszyć rozmiar każdego elementu
* Zmodyfikuj wartości `left` i `top` wewnątrz selektorów, aby wizualnie wyśrodkować ikonę i plakietkę

<div id="need-help">
  ## Potrzebujesz pomocy?
</div>

Jeśli nie masz pewności, która metoda jest dla Ciebie odpowiednia, lub potrzebujesz pomocy przy pisaniu niestandardowego CSS, zalecamy kontakt z ekspertem Shopify. Wsparcie Upcart nie pomaga bezpośrednio przy implementacji CSS.

[Zobacz ekspertów Shopify](https://www.shopify.com/partners/directory)
