# Instrukcja OBS Studio

> W OBS Studio kliknij „+” w panelu Źródła, wybierz „Przeglądarka”, wklej link widżetu z Banner Studio i wpisz szerokość oraz wysokość pokazane w oknie eksportu. Tło jest przezroczyste, a dane odświeżają się co 2 minuty.

## Przygotowanie linku widżetu

Link widżetu ma postać `https://twoja-domena/widget?riotId=…&platform=…&style=…`. Zawiera wyłącznie ustawienia wyglądu i Riot ID – nigdy klucz API. Wygenerujesz go przyciskiem **Generuj link OBS** w [Studio](https://lolbanner.vxh.pl/).

> Znak `#` w Riot ID jest w linku zapisany jako `%23`. Nie zmieniaj tego ręcznie – bez kodowania przeglądarka potraktuje resztę adresu jako fragment i nie wczyta gracza.

## Jak dodać źródło „Przeglądarka” w OBS Studio

1. W OBS wybierz scenę, do której chcesz dodać baner.
2. W panelu **Źródła** kliknij **+** i wybierz **Przeglądarka** (Browser).
3. Nazwij źródło, np. „Ranga LoL”, i potwierdź.
4. Wklej link widżetu w pole **URL**. Pole „Plik lokalny” zostaw odznaczone.
5. Wpisz **Szerokość** i **Wysokość** dokładnie takie, jak w oknie „Generuj link OBS” (zależą od układu i skali).
6. Kliknij **OK**, a potem przeciągnij baner w wybrane miejsce sceny.

Pole „Własny CSS” może zostać domyślne. Widżet ma przezroczyste tło, więc baner nakłada się na grę lub kamerę bez ramki.

## Jakie wymiary ustawić?

Wymiary zależą od układu i skali. Dla skali 100% są to:

| Układ | Kod stylu | Opis | Wymiary (px) |
| --- | --- | --- | --- |
| **Prime** | `crest` | Pełny profil ranked | 820 × 180 |
| **Broadcast** | `lane` | Pasek transmisyjny | 980 × 130 |
| **Compact** | `compact` | Obok kamerki | 620 × 140 |
| **Showcase** | `card` | Karta gracza | 360 × 340 |
| **Split** | `split` | Dwie strony rankingu | 760 × 200 |
| **Minimal** | `minimal` | Czysta typografia | 640 × 120 |
| **Tower** | `tower` | Układ pionowy | 290 × 420 |
| **Scoreboard** | `scoreboard` | Wyniki na pierwszym planie | 820 × 210 |
| **Slim** | `slim` | Cienki pasek | 560 × 84 |
| **Wide** | `wide` | Długi pasek dolny | 1100 × 100 |
| **Info** | `info` | Karta z siatką statystyk | 320 × 350 |
| **Stripe** | `stripe` | Skośny pasek esportowy | 720 × 104 |
| **Badge** | `badge` | Plakat z dużym emblematem | 240 × 420 |
| **Ticket** | `ticket` | Bilet z odrywanym końcem | 660 × 132 |
| **Deck (animowany)** | `deck` | Karty statystyk zmieniają się same | 520 × 128 |
| **Orbit (animowany)** | `orbit` | Okrągły licznik LP | 300 × 448 |
| **Marquee (animowany)** | `marquee` | Przewijana taśma transmisyjna | 920 × 64 |
| **Hextech (animowany)** | `hex` | Obracająca się świecąca ramka | 560 × 170 |
| **Tabs (animowany)** | `tabs` | Zakładki zmieniają treść | 560 × 150 |
| **Radar (animowany)** | `radar` | HUD z echami ostatnich gier | 500 × 170 |
| **Flip (animowany)** | `flip` | Obracane karty jak tablica odlotów | 640 × 118 |
| **Ladder (animowany)** | `ladder` | Drabina wszystkich rang | 780 × 128 |

Jeśli włączysz formę, KDA, CS lub top championów, do wysokości dochodzi stopka banera (ok. 56–120 px, zależnie od układu i sposobu prezentacji). Przy skali innej niż 100% pomnóż wymiary przez skalę (np. Prime przy 120% to 984 × 216). Okno eksportu liczy to za Ciebie. Szczegóły w [układach banerów](https://lolbanner.vxh.pl/docs/uklady-banerow).

## Odświeżanie danych

Widżet pobiera nowe dane co **2 minuty**, a serwer dodatkowo buforuje odpowiedź Riot API przez około 90 sekund, aby nie przekraczać limitów. Po zakończonym meczu ranga i LP mogą pojawić się z krótkim opóźnieniem po stronie Riot.

Aby wymusić odświeżenie, w OBS kliknij źródło prawym przyciskiem → **Właściwości** → **Odśwież pamięć podręczną bieżącej strony**.

## Baner się nie wyświetla?

- Sprawdź komunikat w źródle: „Nie znaleziono gracza…” oznacza błędny Riot ID lub serwer.
- Upewnij się, że wklejony link jest kompletny i zaczyna się od `https://`.
- Zweryfikuj wymiary źródła – zbyt małe obetną baner.

Pełna lista przyczyn: [rozwiązywanie problemów](https://lolbanner.vxh.pl/docs/rozwiazywanie-problemow).

## Najczęstsze pytania

### Jakie źródło wybrać w OBS dla banera rankingu?

Wybierz źródło „Przeglądarka” (Browser) i wklej w pole URL link widżetu wygenerowany w Banner Studio.

### Czy tło banera jest przezroczyste?

Tak. Widżet ma przezroczyste tło, więc nakłada się na scenę bez ramki. Krycie samego banera ustawiasz suwakiem „Krycie tła”.

### Jak często odświeża się ranga w OBS?

Co 2 minuty. Serwer dodatkowo buforuje dane Riot API przez ok. 90 sekund.

### Dlaczego Riot ID w linku ma %23?

%23 to zakodowany znak #. Dzięki temu przeglądarka poprawnie odczytuje tag gracza.

Źródło: https://lolbanner.vxh.pl/docs/obs-studio · Zaktualizowano: 2026-10-05