# Jak přidat overlay KickBotu do OBS

> Přidej jakýkoli overlay KickBotu (chat, alerty nebo TTS) do OBS Studia, Streamlabs Desktop nebo Meld Studia jako zdroj prohlížeče. Velikost, zvuk i řešení problémů.

Source: https://kickbot.com/cs/docs/getting-started/add-browser-source-obs

Každý overlay KickBotu je webový odkaz. Aby se ukázal na tvém streamu na Kicku, zkopíruj odkaz z dashboardu KickBotu a přidej ho do streamovacího programu jako **zdroj prohlížeče** (browser source). Funguje to stejně pro chat overlay, alerty, TTS, alerty na donaty i AI obrázky, v OBS Studiu, Streamlabs Desktop, Meld Studiu a dalších programech, které zdroje prohlížeče podporují. Nic nemusíš instalovat.

## Najdi odkaz na overlay

Každá funkce má vlastní odkaz. Zkopíruješ ho na stránce, kterou uvádí tabulka.

| Overlay | Kde zkopírovat odkaz | Další pomoc |
|---|---|---|
| Chat overlay, alerty, počítadla a další widgety | **Widgety** > **Uložené widgety**, po instalaci widgetu z Knihovny widgetů | [Knihovna widgetů](https://kickbot.com/cs/docs/widgets/widget-library), [chat overlay](https://kickbot.com/cs/docs/widgets/chat-overlay) |
| Převod textu na řeč | **TTS** > **Nastavení**, **Zdroj prohlížeče pro OBS** | [Nastavení TTS](https://kickbot.com/cs/docs/tts/set-up-tts) |
| Alerty na donaty | **Donaty** > **Widget** | [Alerty na donaty](https://kickbot.com/cs/docs/tipping/tip-alerts) |
| AI obrázky | **Chatbot** > **AI obrázky**, **Widget** | [AI obrázky](https://kickbot.com/cs/docs/ai/ai-images) |

> **Caution:** Odkazy na overlaye si nech pro sebe. Odkaz funguje každému, kdo ho má. Nevkládej ho do chatu a neukazuj ho na streamu.

## Vyber velikost

Widget z Knihovny widgetů ukazuje svou velikost v části **Velikost na streamu**, třeba 800 × 600 px. Tuto šířku a výšku použij pro zdroj prohlížeče. Stejnou velikost uvidíš u widgetu i v **Uložených widgetech**.

![Karta O tomto widgetu v Knihovně widgetů s Velikostí na streamu 800 × 600 px](https://kickbot.com/docs/images/getting-started/add-browser-source-obs/01-size-on-stream.webp "Hodnoty z Velikosti na streamu použij jako šířku a výšku zdroje prohlížeče.")

Pokud stránka žádnou velikost neukazuje, nastav zdroj prohlížeče na velikost svého plátna, třeba 1920 × 1080. Pak zdroj ve scéně posuň nebo zmenši. Většina overlayů má průhledné pozadí, takže na streamu je vidět jen obsah.

## OBS Studio

1. V poli **Sources** (zdroje) ve své scéně klikni na **+** a vyber **Browser** (prohlížeč).
2. Zadej název, třeba „KickBot chat“, a potvrď.
3. V okně vlastností vlož odkaz na overlay do pole **URL**.
4. Nastav **Width** (šířka) a **Height** (výška) na velikost overlaye.
5. U overlayů se zvukem (TTS, alerty, alerty na donaty) zapni **Control audio via OBS** (ovládat zvuk přes OBS). Zdroj se pak ukáže v **Audio Mixer** (mixér zvuku), kde mu můžeš změnit hlasitost.
6. Klikni na **OK**. Přetáhni zdroj na plátně tam, kde ho chceš mít.

Další možnosti zdroje prohlížeče v OBS:

- **Shutdown source when not visible** (vypnout zdroj, když není vidět): vypne overlay, když jeho scéna zrovna neběží naživo. U alertů a TTS tuto možnost nech vypnutou, ať ti nic neuteče, když jsi na jiné scéně.
- **Refresh browser when scene becomes active** (obnovit prohlížeč, když se scéna aktivuje): načte overlay znovu při každém přepnutí na scénu. Zpráva, která se zrovna přehrává, se při novém načtení zastaví.
- **Refresh cache of current page** (obnovit mezipaměť aktuální stránky): tlačítko, které overlay hned načte znovu. Použij ho, když změníš nastavení v KickBotu, nebo když overlay vypadá špatně.

Všechny možnosti popisuje OBS ve svém [návodu ke zdroji prohlížeče](https://obsproject.com/kb/browser-source).

> **Dobré vědět:** Když chceš stejné overlaye ve více scénách, dej je do jedné scény, třeba „KickBot overlaye“. Tuto scénu pak přidej jako zdroj do ostatních scén. Každý odkaz tak přidáš jen jednou.

## Streamlabs Desktop

1. V zobrazení studia klikni na **+** vedle **Sources** (zdroje).
2. Vyber **Browser Source** (zdroj prohlížeče), zadej název a klikni na **Add Source** (přidat zdroj).
3. V nastavení zdroje vlož odkaz na overlay do pole URL a nastav šířku a výšku.
4. Zavři nastavení a posuň zdroj na místo.

Streamlabs Desktop má stejné možnosti **Shutdown source when not visible** a **Refresh browser when scene becomes active** jako OBS. Viz článek Streamlabs o [zdrojích prohlížeče](https://streamlabs.com/content-hub/post/introducing-browser-source-interaction-for-streamlabs-desktop). Pokud overlay neslyšíš, zkontroluj, že není ztlumený v mixéru zvuku.

## Meld Studio

1. V panelu **Layers** (vrstvy) klikni na **+** a vyber **Browser** (prohlížeč).
2. Vlož odkaz na overlay do pole **URL** v panelu **Inspector**.
3. Změň velikost vrstvy na plátně, nebo v Inspectoru nastav W a H.
4. U overlayů se zvukem zapni pod polem URL **Add an audio track for the source** (přidat zvukovou stopu pro zdroj). Meld u vrstev prohlížeče zvukovou stopu sám nepřidá.

Odkaz můžeš vložit i rovnou na plátno v Meldu a vznikne vrstva prohlížeče. Ikona obnovení vedle pole URL overlay načte znovu. Meld popisuje vrstvy ve své [dokumentaci k vrstvám](https://meldstudio.co/docs/layers/).

## Řešení problémů

**Zdroj je prázdný.**
- Spousta overlayů něco ukáže, jen když je co ukazovat. Chat overlay je prázdný, dokud někdo nenapíše do chatu. Alert se ukáže, jen když nastane událost.
- Zkopíruj odkaz z dashboardu znovu a vlož ho do zdroje. Smazaný a znovu nainstalovaný widget má nový odkaz.
- Načti overlay znovu: v OBS přes **Refresh cache of current page**, v Meldu ikonou obnovení.
- Zkontroluj, že zdroj není skrytý (ikona oka) a že není v seznamu pod jiným zdrojem.

**TTS nebo alerty nemají zvuk.**
- OBS: ve vlastnostech zdroje zapni **Control audio via OBS** a zkontroluj, že zdroj není ztlumený v **Audio Mixer**.
- Meld: zapni **Add an audio track for the source**.
- Zkontroluj nastavení hlasitosti funkce v KickBotu, třeba hlasitost TTS v [Nastavení TTS](https://kickbot.com/cs/docs/tts/set-up-tts).
- Když chceš overlay při streamování v OBS slyšet i ty, otevři **Edit** > **Advanced Audio Properties** (pokročilé vlastnosti zvuku) a u zdroje nastav **Audio Monitoring** (odposlech zvuku) na **Monitor and Output** (odposlech a výstup). Diváci ho slyší tak jako tak.

**Změny v KickBotu se na streamu neprojeví.** Načti overlay znovu přes **Refresh cache of current page**. Některé overlaye si čtou nastavení, jen když se načítají.

**Overlay je oříznutý nebo moc malý.** Nastav šířku a výšku zdroje na velikost overlaye, jak ji ukazuje **Velikost na streamu**. Velikost měň ve vlastnostech zdroje, ne roztažením zdroje na plátně, ať text zůstane ostrý.

## Časté dotazy

**Jak přidám Kick chat do OBS?**

Nainstaluj chat widget z Knihovny widgetů, zkopíruj jeho odkaz v **Uložených widgetech** a přidej ho do OBS jako zdroj **Browser** ve velikosti, kterou widget ukazuje. Viz [chat overlay](https://kickbot.com/cs/docs/widgets/chat-overlay).

**Fungují overlaye KickBotu se Streamlabs a Meldem?**

Ano. Funguje jakýkoli streamovací program, který podporuje zdroje prohlížeče, včetně OBS Studia, Streamlabs Desktop a Meld Studia.

**Můžu jeden odkaz na overlay použít ve více scénách?**

Ano. Přidej stejný zdroj do každé scény, nebo dej overlaye do jedné scény a tu přidej do ostatních.

**Zpomalují overlaye můj počítač?**

Overlaye jsou lehké webové stránky. Práce, třeba tvorba TTS zvuku, probíhá na serverech KickBotu. Zdroj prohlížeče jen ukazuje a přehrává výsledek.