# Constructor de widgeturi

> Fă-ți propriul widget pentru streamul de pe Kick cu HTML, CSS și JavaScript în Constructorul de widgeturi KickBot, testează-l și publică-l în bibliotecă.

Source: https://kickbot.com/ro/docs/widgets/widget-builder

Cu Constructorul de widgeturi îți faci propriul overlay pentru streamul de pe Kick, cu HTML, CSS și JavaScript. KickBot trimite evenimentele live de pe Kick (follow-uri, sub-uri, sub-uri cadou, KICKs, raiduri, mesaje din chat și altele) direct în codul tău, așa că nu trebuie să te conectezi la niciun API. Poți folosi widgetul pe propriul stream și îl poți publica, ca alți streameri să-l instaleze din Biblioteca de widgeturi. Îl deschizi la [kickbot.com/dashboard/widget-builder](https://kickbot.com/dashboard/widget-builder).

Constructorul este pentru cei care știu să scrie puțin cod. Dacă vrei doar un overlay gata făcut, folosește [Biblioteca de widgeturi](https://kickbot.com/ro/docs/widgets/widget-library). Pentru referința de cod (evenimente, date și setări), vezi [Referința pentru Constructorul de widgeturi](https://kickbot.com/ro/docs/widgets/widget-builder-reference).

![Pagina principală a Constructorului de widgeturi KickBot, cu butonul Widget nou, un widget cu URL ascuns și secțiunea Referință](https://kickbot.com/docs/images/widgets/widget-builder/01-home.webp "Constructorul de widgeturi îți arată widgeturile și URL-urile lor pentru OBS.")

## Fă un widget nou

1. Deschide [kickbot.com/dashboard/widget-builder](https://kickbot.com/dashboard/widget-builder) și apasă pe **Widget nou**.
2. Alege **Gol** sau pornește de la un șablon: **Viewer Count**, **Simple Follower Goal** sau **Basic Chat Widget**. Un șablon copiază codul acelui widget KickBot, ca să-l poți schimba.
3. Scrie **Numele widgetului**. Pentru un widget gol, setează și **Lățime** și **Înălțime** în pixeli (implicit 800 × 600).
4. Apasă pe **Creează widget**. Se deschide editorul.

![Fereastra Widget nou, cu Gol și șabloanele Viewer Count și Simple Follower Goal](https://kickbot.com/docs/images/widgets/widget-builder/02-new-widget.webp "Pornește de la un widget gol sau de la un șablon.")

> **Note:** Pe planul gratuit poți avea cel mult 10 widgeturi în Constructorul de widgeturi. Cu Premium nu ai nicio limită. Widgeturile pe care le instalezi din bibliotecă nu se pun la socoteală.

## Editorul

Editorul are trei părți: setările în stânga, codul la mijloc și o previzualizare live în dreapta.

![Editorul Constructorului de widgeturi, cu Setări de bază și Variabile pentru utilizator în stânga, tabul HTML la mijloc și previzualizarea în dreapta](https://kickbot.com/docs/images/widgets/widget-builder/03-editor.webp "Setările, codul și previzualizarea în editorul Constructorului de widgeturi.")

- **Setări de bază**: numele, plus lățimea și înălțimea la care se afișează widgetul.
- **Variabile pentru utilizator**: setări pe care streamerii le pot schimba fără cod, de exemplu o culoare, un text sau un număr pentru obiectiv. Vezi [Variabile pentru utilizator](https://kickbot.com/ro/docs/widgets/widget-builder-reference#user-variables).
- **Trimite evenimente de test**: butoane care trimit un eveniment de test (Sub, Sub cadou, KICKs, Follow, Raid, Mesaj și altele) în previzualizare.
- **Vizibilitate**: îți arată dacă widgetul e privat sau publicat și are butonul **Publică widgetul**.
- **Cod**: taburi pentru **HTML**, **CSS** și **JavaScript**. Cu **Aranjarea editorului**, sus, alegi să vezi un singur fișier (**Simplu**) sau două fișiere deodată (**Unul lângă altul** sau **Unul sub altul**).
- **Previzualizare**: arată widgetul la dimensiunea lui, micșorat cât să încapă. Se actualizează pe măsură ce scrii. Butonul de reîncărcare îl pornește din nou, iar butonul de pop-out îl deschide într-o fereastră separată (util ca să deschizi consola browserului).

Editorul îți salvează singur munca în timp ce scrii. **Salvează** salvează totul deodată, iar textul de sub buton arată când s-a salvat ultima dată. **Ieși** te duce înapoi la lista de widgeturi.

Editorul are nevoie de un ecran lat. Pe telefon, KickBot îți cere să-l deschizi pe calculator. Widgetul tău e salvat, așa că poți continua de acolo.

## Testează-ți widgetul

1. Deschide **Trimite evenimente de test**.
2. Apasă pe un eveniment, de exemplu **Follow** sau **Mesaj**.
3. Urmărește cum reacționează previzualizarea.

Evenimentele de test au aceeași formă ca evenimentele reale, dar cu date de exemplu. Ajung doar în previzualizarea de pe această pagină, niciodată în OBS sau pe stream. Ca să testezi cu evenimente reale, adaugă widgetul în OBS și intră live sau roagă un prieten să-ți dea follow.

## Folosește widgetul pe stream

Fiecare widget pe care îl faci apare și în [Widgeturi salvate](https://kickbot.com/dashboard/saved-widgets), cu „Widgetul tău” sub nume. URL-ul lui rulează mereu cea mai nouă versiune a codului tău.

1. Pe pagina Constructorului de widgeturi, apasă pe **Copiază URL-ul** la widgetul tău.
2. În OBS, adaugă o sursă **Browser**, lipește URL-ul și setează lățimea și înălțimea la dimensiunea widgetului.
3. Apasă pe **OK**.

Dacă schimbi codul cât widgetul e în OBS, reîncarcă sursa browser ca să se încarce noul cod. Când schimbi valoarea unei variabile pentru utilizator în Widgeturi salvate și apeși pe **Salvează**, OBS reîncarcă singur widgetul. Pentru mai mult ajutor, vezi [Adaugă un overlay KickBot în OBS](https://kickbot.com/ro/docs/getting-started/add-browser-source-obs).

> **Caution:** Păstrează URL-ul doar pentru tine. Oricine îl are îți poate arăta widgetul pe ecranul lui.

## Publică în Biblioteca de widgeturi

Publică un widget când vrei ca alți streameri să-l găsească și să-l instaleze.

1. În editor, deschide **Vizibilitate** și apasă pe **Publică widgetul**.
2. Adaugă o **Imagine principală** și cel puțin încă o imagine. Poți adăuga cel mult 10 imagini în total, fiecare de cel mult 10 MB. Merge cel mai bine la 1920 × 1080.
3. Scrie o **Descriere**: ce arată widgetul și cum se configurează.
4. Trimite-l. Fereastra arată **Trimis la verificare**.

Echipa KickBot verifică fiecare widget. Dacă e aprobat, apare în Biblioteca de widgeturi, cu numele tău de pe Kick drept creator. De obicei, verificarea durează mai puțin de 24 de ore.

> **Caution:** Poți publica un widget o singură dată. După aceea, editorul arată „Acest widget e publicat. Ca să-l modifici, contactează suportul.” Testează-ți bine widgetul înainte să-l publici.

## Șterge un widget

Pe pagina Constructorului de widgeturi, deschide meniul **⋯** al unui widget și apasă pe **Șterge**. Asta îi șterge codul și setările și nu se poate anula.

## Membrii echipei

Membrii echipei au nevoie de permisiunea **Constructor de widgeturi** ca să deschidă editorul și să facă widgeturi. Ca să vadă URL-urile widgeturilor, au nevoie de **Configurare widgeturi**. Vezi [Gestionează echipa](https://kickbot.com/ro/docs/account/team).

## Întrebări frecvente

**Trebuie să știu să programez?**

Da, puțin HTML, CSS și JavaScript. Dacă nu scrii cod, instalează un widget din [Biblioteca de widgeturi](https://kickbot.com/ro/docs/widgets/widget-library) și schimbă-i setările.

**Pot edita un widget KickBot din bibliotecă?**

Nu poți schimba codul unui widget din bibliotecă. Pornește un widget nou de la șablonul **Viewer Count**, **Simple Follower Goal** sau **Basic Chat Widget** și primești o copie a codului pe care o poți schimba.

**Poate widgetul meu să încarce fonturi, imagini sau alte scripturi?**

Da. HTML-ul, CSS-ul și JavaScript-ul tău rulează într-o pagină web obișnuită în OBS, așa că poți folosi fonturi web, imagini și scripturi de pe alte site-uri. Folosește variabile pentru utilizator de tip **Imagine/GIF**, **Video** sau **Audio** ca streamerii să-și poată încărca propriile fișiere.

**Pot face widgeturi cu API-ul KickBot?**

Da. API-ul KickBot poate lista, crea și actualiza widgeturile tale. Vezi [referința API pentru widgeturi](https://kickbot.com/docs/api/reference/widgets).