Widgets personalizados
Crea tus propios widgets para TikTok LIVE
Un widget de TikTok LIVE es una página web que reacciona a tu directo: llega un regalo, la página se anima y TikTok LIVE Studio u OBS muestra esa página en tu live. Puedes escribirlo en HTML, CSS y JavaScript, o describir lo que quieres y dejar que la IA lo escriba: TokElements lo ejecuta con los eventos de tu directo de TikTok.
Cómo funciona un widget de TikTok LIVE
1 · Tu TikTok LIVE
Tu audiencia envía regalos, sigue, da me gusta, comparte y chatea. Cada una de esas acciones es un evento.
2 · TokElements
Se conecta a tu directo con tu @usuario público, sin contraseña, y pasa cada evento a tus widgets en el momento en que ocurre.
3 · Tu widget
Una pequeña página web: HTML para lo que muestra, CSS para cómo se ve y JavaScript para lo que hace cuando llega un evento.
4 · LIVE Studio u OBS
El enlace de tu overlay entra como fuente de Enlace en TikTok LIVE Studio o como fuente de navegador en OBS. Todos los widgets que contiene salen en tu directo.
Una alerta de regalo en pocas líneas
Los widgets reciben los eventos a través de una sola función. Esta muestra quién envió qué regalo y cuántos, cada vez que llega uno:
<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>Qué crea la gente
Alertas de regalos
Una animación distinta para cada regalo: una pequeña para una Rosa, toda la pantalla para un León.
Metas
Una meta de seguidores, likes o regalos que tu audiencia llena entre todos.
Rankings
Quienes más regalan o más likes dan en el directo, actualizándose en vivo.
Juegos
Tu audiencia juega con comandos de chat o regalos: ruletas, carreras, quizzes, torres.
Chat en pantalla
Tu chat como parte del directo, con el estilo que tú quieras.
Cualquier otra cosa
Temporizadores, encuestas, música que suena ahora, mascotas que crecen con los regalos: es una página web, así que puede ser todo lo que una página pueda ser.
O descríbelo y deja que la IA lo cree
No tienes que escribir código. Describe el widget (“una alerta de regalo cyberpunk que muestre un león de rayos durante 5 segundos cuando alguien envíe un León”) y el creador con IA escribe el HTML, el CSS y el JavaScript, lo conecta a los eventos de tu directo y lo muestra en un lienzo de vista previa. Cambia lo que quieras pidiéndolo, o abre el código y edítalo tú.
De la idea al directo
1 · Crea una cuenta gratis
Regístrate y vincula tu TikTok con tu @usuario público.
2 · Crea el widget
Empieza desde una plantilla, escríbelo en el editor del navegador o descríbeselo al creador con IA. Pruébalo con regalos y follows simulados.
3 · Añade un enlace a tu directo
Copia el enlace de tu overlay en TikTok LIVE Studio como fuente de Enlace, o en OBS como fuente de navegador. Todos los widgets que coloques salen en él.
Preguntas
¿Puedo crear mis propios widgets para TikTok LIVE Studio?
Sí. TikTok LIVE Studio puede mostrar una página web como fuente de Enlace, así que un widget es una página web que reacciona a tu directo. TokElements le da a esa página los eventos de tu live y la aloja, de modo que solo escribes lo que muestra, o dejas que lo escriba la IA.
¿Necesito saber programar?
No. Elige una plantilla o describe el widget al creador con IA. Si programas, el editor del navegador te da el HTML, el CSS y el JavaScript con eventos en vivo y vista previa.
¿A qué eventos puede reaccionar un widget?
A regalos (con el combo y el valor en monedas), follows, likes, comparticiones, suscripciones, mensajes de chat, entradas, encuestas y batallas, además de totales como espectadores y monedas.
¿Funciona también en OBS?
Sí. El mismo enlace de overlay funciona como fuente de navegador en OBS y como fuente de Enlace en TikTok LIVE Studio.
¿Necesito mi contraseña de TikTok?
No. TokElements encuentra tu directo con tu @usuario público. Nada te pide tus datos de acceso de TikTok.
Crea tu primer widget hoy.
Cuenta gratis, editor en el navegador, creador con IA y eventos de TikTok en vivo, todo en tu directo con un solo enlace.
Los menús y las funciones de TikTok LIVE Studio cambian con el tiempo y varían según el país. TokElements no está afiliado a TikTok.