Widget tùy chỉnh
Tự làm widget TikTok LIVE
Widget TikTok LIVE là một trang web phản ứng với buổi LIVE: có quà đến, trang chuyển động, và TikTok LIVE Studio hoặc OBS hiển thị trang đó trên stream. Bạn có thể tự viết bằng HTML, CSS và JavaScript, hoặc mô tả thứ bạn muốn để AI viết — TokElements chạy nó với sự kiện LIVE của bạn.
Widget TikTok LIVE hoạt động thế nào
1 · Buổi TikTok LIVE của bạn
Người xem tặng quà, follow, like, chia sẻ và chat. Mỗi hành động đó là một sự kiện.
2 · TokElements
Kết nối với buổi LIVE qua @username công khai — không cần mật khẩu — và chuyển mọi sự kiện đến widget ngay khi xảy ra.
3 · Widget của bạn
Một trang web nhỏ: HTML cho thứ nó hiển thị, CSS cho giao diện, JavaScript cho việc nó làm khi có sự kiện.
4 · LIVE Studio hoặc OBS
Link overlay được thêm dưới dạng nguồn Link trong TikTok LIVE Studio hoặc browser source trong OBS. Mọi widget trên đó đều lên stream.
Thông báo quà chỉ trong vài dòng
Widget nhận sự kiện qua một hàm duy nhất. Widget này hiện ai đã tặng quà gì, bao nhiêu, mỗi khi có quà:
<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>Mọi người làm gì
Thông báo quà
Mỗi quà một hiệu ứng: nhỏ cho Hoa hồng, cả màn hình cho Sư tử.
Mục tiêu
Mục tiêu follow, like hoặc quà để người xem cùng lấp đầy.
Bảng xếp hạng
Top tặng quà hoặc thả tim của buổi stream, cập nhật trực tiếp.
Game
Người xem chơi bằng lệnh chat hoặc quà: vòng quay, đua xe, quiz, xếp tháp.
Chat trên màn hình
Khung chat thành một phần của stream, theo phong cách của bạn.
Bất cứ thứ gì khác
Đồng hồ đếm, bình chọn, bài đang phát, thú cưng lớn lên nhờ quà — nó là trang web, nên có thể là bất cứ thứ gì một trang web làm được.
Hoặc mô tả và để AI làm
Bạn không cần viết code. Mô tả widget — “thông báo quà phong cách cyberpunk, hiện một chú sư tử tia chớp trong 5 giây khi ai đó tặng Sư tử” — và trình tạo AI sẽ viết HTML, CSS và JavaScript, nối nó với sự kiện LIVE của bạn và hiện trên canvas xem trước. Muốn đổi gì thì cứ hỏi, hoặc mở code và tự sửa.
Từ ý tưởng đến stream
1 · Tạo tài khoản miễn phí
Đăng ký và liên kết TikTok bằng @username công khai.
2 · Làm widget
Bắt đầu từ template, viết trong trình chỉnh sửa trên trình duyệt, hoặc mô tả cho trình tạo AI. Thử bằng quà và follow giả lập.
3 · Thêm một link vào stream
Dán link overlay vào TikTok LIVE Studio dưới dạng nguồn Link, hoặc vào OBS dưới dạng browser source. Mọi widget bạn đặt đều nằm trên đó.
Câu hỏi
Tôi có thể tự làm widget cho TikTok LIVE Studio không?
Có. TikTok LIVE Studio hiển thị được trang web dưới dạng nguồn Link, nên widget là một trang web phản ứng với buổi LIVE. TokElements cung cấp sự kiện LIVE cho trang đó và lưu trữ nó, nên bạn chỉ cần viết phần hiển thị — hoặc để AI viết.
Tôi có cần biết code không?
Không. Chọn template hoặc mô tả widget cho trình tạo AI. Nếu bạn biết code, trình chỉnh sửa trên trình duyệt cho bạn HTML, CSS và JavaScript cùng sự kiện LIVE và bản xem trước.
Widget phản ứng được với sự kiện nào?
Quà (kèm số combo và giá trị xu), follow, like, chia sẻ, đăng ký, tin nhắn chat, lượt vào phòng, bình chọn và battle, cùng các tổng như số người xem và số xu.
Có chạy trong OBS không?
Có. Cùng một link overlay dùng được làm browser source trong OBS và nguồn Link trong TikTok LIVE Studio.
Tôi có cần mật khẩu TikTok không?
Không. TokElements tìm buổi LIVE qua @username công khai. Không có gì hỏi thông tin đăng nhập TikTok của bạn.
Làm widget đầu tiên ngay hôm nay.
Tài khoản miễn phí, trình chỉnh sửa trên trình duyệt, trình tạo AI và sự kiện TikTok LIVE thật — lên stream qua một link.
Menu và tính năng của TikTok LIVE Studio thay đổi theo thời gian và khác nhau tùy quốc gia. TokElements không liên kết với TikTok.