Eigene Widgets
Baue deine eigenen TikTok LIVE Widgets
Ein TikTok LIVE Widget ist eine Webseite, die auf dein Live reagiert: Ein Geschenk kommt an, die Seite animiert sich, und TikTok LIVE Studio oder OBS zeigt diese Seite in deinem Stream. Du kannst eines in HTML, CSS und JavaScript schreiben oder beschreiben, was du willst, und die KI schreiben lassen – TokElements führt es mit deinen Live-Events aus.
So funktioniert ein TikTok LIVE Widget
1 · Dein TikTok LIVE
Zuschauer senden Geschenke, folgen, liken, teilen und chatten. Jedes davon ist ein Event.
2 · TokElements
Verbindet sich über deinen öffentlichen @Benutzernamen mit deinem Live – ohne Passwort – und gibt jedes Event in Echtzeit an deine Widgets weiter.
3 · Dein Widget
Eine kleine Webseite: HTML für das, was sie zeigt, CSS für das Aussehen, JavaScript für das, was bei einem Event passiert.
4 · LIVE Studio oder OBS
Dein Overlay-Link kommt als Link-Quelle in TikTok LIVE Studio oder als Browserquelle in OBS. Jedes Widget darauf ist im Stream.
Ein Gift Alert in wenigen Zeilen
Widgets bekommen Events über eine einzige Funktion. Dieses zeigt, wer welches Geschenk in welcher Menge gesendet hat, sobald ein Geschenk ankommt:
<div id="alert"></div>
<script>
TE.on('gift', function (e) {
var el = document.getElementById('alert');
el.textContent = e.user.name + ' sent ' + e.gift.name + ' ×' + e.gift.repeat;
el.className = 'show'; // your CSS animates it in
setTimeout(function () { el.className = ''; }, 5000);
});
</script>Was andere bauen
Gift Alerts
Eine eigene Animation pro Geschenk: eine kleine für eine Rose, der ganze Bildschirm für einen Löwen.
Ziele
Ein Follower-, Like- oder Geschenk-Ziel, das die Zuschauer gemeinsam füllen.
Bestenlisten
Top-Schenker oder -Liker des Streams, live aktualisiert.
Spiele
Zuschauer spielen per Chat-Befehl oder Geschenk: Glücksräder, Rennen, Quizze, Turmstapeln.
Chat auf dem Bildschirm
Dein Chat als Teil des Streams, so gestaltet, wie du es willst.
Alles andere
Timer, Umfragen, Now Playing, Haustiere, die mit Geschenken wachsen – es ist eine Webseite, also kann es alles sein, was eine Seite sein kann.
Oder beschreibe es und lass die KI es bauen
Du musst keinen Code schreiben. Beschreibe das Widget – „ein Cyberpunk-Gift-Alert, der 5 Sekunden lang einen Blitz-Löwen zeigt, wenn jemand einen Löwen sendet“ – und der KI-Builder schreibt HTML, CSS und JavaScript, verbindet es mit deinen Live-Events und zeigt es auf einer Vorschau-Fläche. Ändere alles per Nachfrage oder öffne den Code und bearbeite ihn selbst.
Von der Idee zum Stream
1 · Kostenloses Konto erstellen
Registriere dich und verbinde dein TikTok über deinen öffentlichen @Benutzernamen.
2 · Das Widget bauen
Starte mit einer Vorlage, schreibe es im Browser-Editor oder beschreibe es dem KI-Builder. Teste es mit simulierten Geschenken und Follows.
3 · Einen Link zu deinem Stream hinzufügen
Kopiere deinen Overlay-Link als Link-Quelle in TikTok LIVE Studio oder als Browserquelle in OBS. Jedes Widget, das du platzierst, ist darauf.
Fragen
Kann ich eigene Widgets für TikTok LIVE Studio machen?
Ja. TikTok LIVE Studio kann eine Webseite als Link-Quelle anzeigen, ein Widget ist also eine Webseite, die auf dein Live reagiert. TokElements gibt dieser Seite deine Live-Events und hostet sie, du schreibst nur, was sie zeigt – oder lässt die KI es schreiben.
Muss ich programmieren können?
Nein. Wähle eine Vorlage oder beschreibe das Widget dem KI-Builder. Wenn du programmierst, gibt dir der Browser-Editor HTML, CSS und JavaScript mit Live-Events und Vorschau.
Auf welche Events kann ein Widget reagieren?
Geschenke (mit Combo-Anzahl und Coin-Wert), Follows, Likes, Shares, Abos, Chat-Nachrichten, Beitritte, Umfragen und Battles sowie Summen wie Zuschauer und Coins.
Funktioniert es auch in OBS?
Ja. Derselbe Overlay-Link funktioniert als Browserquelle in OBS und als Link-Quelle in TikTok LIVE Studio.
Brauche ich mein TikTok-Passwort?
Nein. TokElements findet dein Live über deinen öffentlichen @Benutzernamen. Nichts fragt nach deinem TikTok-Login.
Baue noch heute dein erstes Widget.
Kostenloses Konto, Browser-Editor, KI-Builder und Live-Events von TikTok – im Stream über einen Link.
Menüs und Funktionen von TikTok LIVE Studio ändern sich mit der Zeit und unterscheiden sich je nach Land. TokElements ist nicht mit TikTok verbunden.