diff --git a/astro.config.mjs b/astro.config.mjs index 08bace4..f2be589 100644 --- a/astro.config.mjs +++ b/astro.config.mjs @@ -199,7 +199,9 @@ export default defineConfig({ icon: 'comment', items: [ { label: 'Overview', slug: 'chatbot' }, + { label: 'Add to Your Channel', slug: 'chatbot/platforms' }, { label: 'Getting Started', slug: 'chatbot/getting-started' }, + { label: 'User Management', slug: 'chatbot/user-management' }, { label: 'Guides', items: [ @@ -207,6 +209,8 @@ export default defineConfig({ { label: 'Lurk Command', slug: 'chatbot/guides/lurk-command' }, { label: 'Countdown Command', slug: 'chatbot/guides/countdown-command' }, { label: 'Viewer Input', slug: 'chatbot/guides/viewer-input' }, + { label: 'Bot Detection Command', slug: 'chatbot/guides/bot-detection' }, + { label: 'Run Ads via Chatbot', slug: 'chatbot/guides/run-ads' }, { label: 'All guides', slug: 'chatbot/guides' }, ], }, @@ -254,6 +258,7 @@ export default defineConfig({ { label: 'All guides', slug: 'selive/guides' }, ] }, { label: 'Troubleshooting', slug: 'selive/troubleshooting' }, + { label: 'Uninstalling SE.Live', slug: 'selive/uninstall' }, ], }, { @@ -266,19 +271,25 @@ export default defineConfig({ { label: 'Guides', items: [ - { label: 'Build your first custom widget', slug: 'overlays/first-custom-widget' }, + { label: 'Add to your broadcast software', slug: 'overlays/broadcast-software' }, + { label: 'AlertBox alert variations', slug: 'overlays/alertbox-variations' }, + { label: 'Add a chat overlay', slug: 'overlays/chat-widget' }, + { label: 'KappaGen', slug: 'overlays/kappagen' }, + { label: 'Widget Data', slug: 'overlays/widget-data' }, { label: 'Custom code in AlertBoxes', slug: 'overlays/custom-code-in-alertbox' }, ], }, { label: 'Custom Widgets', items: [ + { label: 'Build your first custom widget', slug: 'overlays/first-custom-widget' }, { label: 'Code Editor', slug: 'overlays/widget-structure' }, { label: 'SE_API Reference', slug: 'overlays/custom-widget' }, { label: 'Widget Events', slug: 'overlays/events' }, { label: 'Session Data Reference', slug: 'overlays/session-data' }, ], }, + { label: 'Troubleshooting', slug: 'overlays/troubleshooting' }, { label: 'Editor Shortcuts', slug: 'overlays/overlay-editor-shortcuts' }, ], }, diff --git a/src/content/docs/chatbot/getting-started.mdx b/src/content/docs/chatbot/getting-started.mdx index a15fd70..792e46f 100644 --- a/src/content/docs/chatbot/getting-started.mdx +++ b/src/content/docs/chatbot/getting-started.mdx @@ -21,6 +21,10 @@ import ChatExample from '@components/ChatExample.astro'; This guide walks you through the two most common ways to put the StreamElements Chatbot to work: creating your first custom command and setting up your first timer. +:::note[Bot not in your channel yet?] +Commands and timers only work once the bot has joined your channel — see [Add the Chatbot to Your Channel](/chatbot/platforms) first if you haven't done that yet. +::: + ## Your first command Commands are the main way users will interact with the bot in your chat. They can be used to trigger actions, or to display information to your users. In this example we will create a command that shows how long it has been since a user was last seen in chat. diff --git a/src/content/docs/chatbot/guides/bot-detection.mdx b/src/content/docs/chatbot/guides/bot-detection.mdx new file mode 100644 index 0000000..b9217fd --- /dev/null +++ b/src/content/docs/chatbot/guides/bot-detection.mdx @@ -0,0 +1,46 @@ +--- +title: Check if a User Is a Known Bot +sidebar: + label: Bot Detection Command +description: "Build a !bot command that checks whether a Twitch username is a known bot, using the $(customapi) variable and a third-party lookup service." +platforms: [twitch] +keywords: + - StreamElements bot detection + - known bot command + - Twitch bot check command +--- + +import { Steps } from '@astrojs/starlight/components'; +import ChatExample from '@components/ChatExample.astro'; + +This command checks whether a username is a known bot, using [`$(customapi)`](/chatbot/variables/customapi) to query **Blocklist Buddy**, a community-run lookup service covering CommanderRoot's and TwitchInsights' known-bot lists. + +:::note +Blocklist Buddy is a third-party, community-maintained service — not operated by StreamElements. It could change or become unavailable without notice. +::: + + + +1. From the [bot command dashboard](https://streamelements.com/dashboard/bot/commands), open the "Custom commands" tab and click "Add new command". + +2. Name the command `bot`, and set the reply to: + + ```streamelements + $(customapi https://zoeballz.uk/_Blocklist_Buddy/known_bot.php?user=$(sender)&bot=$(1)&channel=$(channel)) + ``` + +3. Click "Activate command". + + + +Test it with `!bot `: + + + +## Related + +- [`$(customapi)`](/chatbot/variables/customapi): the variable this command is built on. +- [Custom Commands](/chatbot/commands/custom): everything else you can do with custom commands. diff --git a/src/content/docs/chatbot/guides/index.mdx b/src/content/docs/chatbot/guides/index.mdx index 49039d2..e661b7e 100644 --- a/src/content/docs/chatbot/guides/index.mdx +++ b/src/content/docs/chatbot/guides/index.mdx @@ -35,4 +35,14 @@ These guides combine chatbot commands, variables, and settings into complete fea href="/chatbot/guides/viewer-input" description="Capture words from chat, add fallbacks and validation, and encode input for URLs." /> + + diff --git a/src/content/docs/chatbot/guides/run-ads.mdx b/src/content/docs/chatbot/guides/run-ads.mdx new file mode 100644 index 0000000..f9b283e --- /dev/null +++ b/src/content/docs/chatbot/guides/run-ads.mdx @@ -0,0 +1,44 @@ +--- +title: Run Ads via the Chatbot +sidebar: + label: Run Ads via Chatbot +description: "Run Twitch ads automatically on a timer, or manually with a chat command, using the StreamElements Chatbot." +platforms: [twitch] +keywords: + - StreamElements run ads + - Twitch commercial command + - automatic ads Twitch +--- + +import { Steps } from '@astrojs/starlight/components'; + +Both timers and commands can send Twitch's `/commercial` action, letting the chatbot start an ad break for you. + +:::note[Prerequisite] +Add the StreamElements bot as an **Editor** on your [Twitch roles page](https://dashboard.twitch.tv/community/roles) — without Editor access, it can't run ads on your behalf. +::: + +## Automatically, on a timer + + + +1. Create a new [timer](/chatbot/timers) with the response: + + ``` + /commercial 30 + ``` + + Replace `30` with your preferred ad duration in seconds: `30`, `60`, `90`, `120`, `150`, or `180`. + +2. Set the **online interval** to how often you want ads to run. For example, an interval of 10 minutes with a `30`-second duration runs a 30-second ad every 10 minutes you're live. + + + +## Manually, with a command + +Create a [custom command](/chatbot/commands/custom) — for example `!ad` — with the response `/commercial 30`. Typing `!ad` (restrict this to moderators) runs a 30-second ad on demand. + +## Related + +- [Timers](/chatbot/timers): the full timer reference, including offline interval and conditions. +- [Custom Commands](/chatbot/commands/custom): managing commands from the dashboard or chat. diff --git a/src/content/docs/chatbot/index.mdx b/src/content/docs/chatbot/index.mdx index a2f6c00..97d7262 100644 --- a/src/content/docs/chatbot/index.mdx +++ b/src/content/docs/chatbot/index.mdx @@ -19,11 +19,21 @@ import { CardGrid, LinkCard } from '@astrojs/starlight/components'; The StreamElements Chatbot is a chatbot for Twitch and YouTube Live. It provides custom commands, automated timers, spam filters, and interactive modules, all configured from your StreamElements dashboard. + + + + + + + +1. Open your [bot settings page](https://streamelements.com/dashboard/bot/settings) and click **Join**. + +2. In your Twitch chat, type: + + ``` + /mod streamelements + ``` + + + +### FAQ + +**Can the bot use my subscriber emotes?** +Only if it has an active subscription to your channel — you or someone else needs to gift it one. + +**The bot isn't responding.** +Make sure it isn't banned: type `/unban streamelements` in your chat. If events are also missing from your Activity Feed, see [Events missing from the Activity Feed](#events-missing-from-the-activity-feed) below. Otherwise see [Troubleshooting](/chatbot/troubleshooting). + +### Events missing from the Activity Feed + +Twitch now requires chat access to deliver some events, so a banned or parted bot can cause them to stop appearing in your Activity Feed. If that happens: + + + +1. Unban and mod the bot (`/unban streamelements` then `/mod streamelements`) so other bots can't re-ban it. +2. Log out of the StreamElements dashboard and log back in with your Twitch account, to refresh the permissions needed to read subscription and other events. +3. Part and re-join the bot from your channel to confirm it's present. You can disable its timers and commands afterward if you don't want it posting. + + + + + + + +:::note[Before you start] +Your stream must be **public** and **live** — the bot can't join a private, unlisted, or offline stream. +::: + + + +1. Open [YouTube Studio](https://studio.youtube.com/). +2. Go to **Settings > Community**. +3. Under moderators, add either of these as a moderator: + - `https://youtube.com/c/streamelements` + - `https://www.youtube.com/channel/UCjerlCIbLPQwSnYlClkjDXg` +4. While live, view **Live chat** rather than **Top chat** — Top chat can hide the bot's messages. + + + +### FAQ + +**Can I change the bot's display name?** +No, this isn't possible on YouTube. + +**Some chatbot features are missing.** +Giveaways, the Stream Store, Viewer Queue, and Media Requests all depend on the Loyalty system, which isn't currently available for YouTube accounts. + +**Some events don't show up in Chat Alerts or the Activity Feed.** +Events are only captured while you're live, and tracking doesn't work correctly if you run two streams at the same time. + +**The bot didn't join my channel when I went live.** +Confirm your stream is public, that you're shown as live in the StreamElements dashboard, and that you added the correct StreamElements channel as a moderator. + + + + + + + +1. Open your [bot settings page](https://streamelements.com/dashboard/bot/settings) and click **Join**. +2. In your Kick chat, type: + + ``` + /mod @StreamElements + ``` + + + +### FAQ + +**Can the bot use my subscriber emotes?** +Only if it has an active subscription to your channel — you or someone else needs to gift it one. + +**The bot isn't responding.** +Type `/unban @StreamElements` in your chat, and confirm the bot is still connected to your Kick account under bot settings. + +**Why isn't the bot posting alerts or responding to commands?** +Usually one of: the bot is offline (try reconnecting it), it's missing moderator status in your chat, or there's a typo in the command name. + +**Can the bot automatically ban or time out users?** +Not on its own — but moderators can trigger bulk timeouts or bans with [`!nuke`](/chatbot/commands/default/nuke) and [`!nukeusername`](/chatbot/commands/default/nukeusername). + + + + + +## Next steps + +- [Create your first command or timer](/chatbot/getting-started) +- [Troubleshooting](/chatbot/troubleshooting) diff --git a/src/content/docs/chatbot/troubleshooting.md b/src/content/docs/chatbot/troubleshooting.md index 9bd372a..95f417b 100644 --- a/src/content/docs/chatbot/troubleshooting.md +++ b/src/content/docs/chatbot/troubleshooting.md @@ -16,6 +16,7 @@ This section helps you quickly resolve common issues you might encounter with th - Check that the bot is currently active in your channel. Go to your StreamElements dashboard and ensure the bot is turned on. - Ensure the bot is not banned or ignored in your channel. Sometimes the bot might have been accidentally banned, which prevents it from posting messages. - Check that the bot has not been muted with [`!bot mute`](/chatbot/commands/default/bot). A muted bot sends no command responses or timer messages; use `!bot unmute` to restore it. +- If the bot was never added to your channel, or lost moderator status, see [Add the Chatbot to Your Channel](/chatbot/platforms) for per-platform setup, including what to do if the bot is missing from your Activity Feed. ## Commands not working diff --git a/src/content/docs/chatbot/user-management.mdx b/src/content/docs/chatbot/user-management.mdx new file mode 100644 index 0000000..c469092 --- /dev/null +++ b/src/content/docs/chatbot/user-management.mdx @@ -0,0 +1,48 @@ +--- +title: User Management +description: "StreamElements Chatbot permission levels, and how to manually assign a user to a group from the dashboard." +keywords: + - StreamElements user levels + - chatbot permission levels + - Regular user Twitch bot + - Super Moderator StreamElements +--- + +Every command has a required **user level** — the minimum permission a viewer needs to use it. Most viewers get a level automatically based on their platform role: + +| Group | Level | How it's assigned | +|---|---|---| +| Everyone | 100 | Default for every chat user | +| Subscriber | 250 | Automatic for your platform subs | +| Regular | 300 | Set manually, see below | +| VIP | 400 | Automatic for Twitch VIPs | +| Moderator | 500 | Automatic for your platform mods | +| Super Moderator | 1000 | Set manually, see below | + +The broadcaster always sits above every level and can trigger any command, regardless of its required level. + +These are the same six values used throughout the chatbot — in [`!level`](/chatbot/commands/default/level), and in `!command options -level` (see [`!command`](/chatbot/commands/default/command)). + +## Setting a command's user level + +Set a command's required level from its **Advanced settings** in the dashboard, or with [`!command options`](/chatbot/commands/default/command): + +```streamelements +!command options !socials -level 500 +``` + +## Adding a user to Regular or Super Moderator + +Regular and Super Moderator aren't tied to a platform role, so you assign them yourself: + +- **From the dashboard:** go to **Chatbot > User Management**, click **Add new bot user**, enter their username, and assign a group. +- **From chat:** moderators and the broadcaster can use [`!level`](/chatbot/commands/default/level): + + ```streamelements + !level RegularViewer 300 + ``` + +## Related + +- [`!level`](/chatbot/commands/default/level): check or set a user's level from chat. +- [Custom Commands](/chatbot/commands/custom): set a command's level when creating or editing it. diff --git a/src/content/docs/overlays/alertbox-variations.mdx b/src/content/docs/overlays/alertbox-variations.mdx new file mode 100644 index 0000000..148ade8 --- /dev/null +++ b/src/content/docs/overlays/alertbox-variations.mdx @@ -0,0 +1,79 @@ +--- +title: AlertBox Alert Variations +sidebar: + label: Alert Variations +description: "Customize AlertBox images, sounds, and messages per event, create alert variations for gifted subs and big tips, and set up text-to-speech." +keywords: + - AlertBox variations + - StreamElements TTS + - subscriber alert variations + - tip alert variations +--- + +import { Steps } from '@astrojs/starlight/components'; + +An AlertBox plays a short animation whenever an event happens — a follow, a subscription, a tip. Each event type has its own image, sound, and message, and some support **variations**: different alerts for different situations, like a gifted sub versus a regular resub. + +Before you begin, add an AlertBox to an overlay — see [Getting Started](/overlays/getting-started). + +## Customize a single event + + + +1. In the overlay editor, select the AlertBox and click the gear icon next to the event you want to customize (for example, **Follow**). +2. Set the alert image or video: a static image, a GIF, or a video file. +3. Upload an alert sound. +4. Choose the layout (text over image, or text alongside it). +5. Edit the alert message. Each event exposes a small set of variables you can insert — for a follow alert, `{name}` is the new follower's username. +6. Set how long the alert stays on screen. + + + +## Event-specific settings + +**Subscriptions** come with three built-in variations: + +- **Resubscriber** — a returning subscriber. First-time subscribers get the default alert instead. +- **Gifted sub** — someone gifts a subscription to a specific viewer. +- **Community gift** — someone gifts multiple subs to the channel at once. Without this variation, one alert plays *per recipient* — so a 10-sub community gift would trigger 10 separate alerts. + +You can add further variations — for Prime subscriptions, specific tiers, or anything else — with **Add new variation > Start with blank**, then set the variation's condition (for example, **Subscription tier: Prime**). + +Optionally show the **subscriber message** viewers can attach when they resub. + +**Tips** support variations by amount — useful for a bigger alert on large tips, or a themed alert for a specific range. You'll also need tipping configured; see [SE Pay](https://streamelements.com/dashboard/tipping) or [PayPal](https://support.streamelements.com/hc/en-us/articles/16788907050258). + +**Cheers** also ship with extra variations enabled by default. If you only want one cheer alert, disable the variations — otherwise they override your default alert's changes for matching cheer amounts. + +**Raids** can be limited to raids above a certain viewer count; leave this blank to trigger on every raid. + +## Text-to-speech + + + +1. Open the settings for the event you want to read aloud (commonly subs, tips, and cheers). +2. Scroll to **TTS settings** and enable **text-to-speech**. +3. Choose a voice from the dropdown. + + + +**Announce action** also reads the action itself before the message — for example, "sk1ll donated $5" before reading the donation message. + +## Using one AlertBox across every scene + +If each of your scenes has its own overlay, duplicating the AlertBox into every scene means duplicate sounds unless you manage it carefully. To use a single AlertBox everywhere instead: + + + +1. Create a new overlay (1080p) named something like "alertbox". +2. Open the overlay containing your existing AlertBox, select it, and duplicate it into the new "alertbox" overlay. +3. Delete or hide the AlertBox in your other overlays, so it doesn't play twice. +4. In OBS, copy the "alertbox" browser source and paste it into every scene that needs it. + + + +## Related + +- [Add an overlay to your broadcast software](/overlays/broadcast-software) +- [KappaGen](/overlays/kappagen): trigger an emote explosion alongside your alerts. +- [Widget Data](/overlays/widget-data): edit or correct the data your alerts and labels pull from. diff --git a/src/content/docs/overlays/broadcast-software.mdx b/src/content/docs/overlays/broadcast-software.mdx new file mode 100644 index 0000000..b150056 --- /dev/null +++ b/src/content/docs/overlays/broadcast-software.mdx @@ -0,0 +1,74 @@ +--- +title: Add an Overlay to Your Broadcast Software +sidebar: + label: Add to OBS / XSplit +description: "Add a StreamElements overlay to OBS Studio or XSplit as a browser source, and use multiple overlays at once." +keywords: + - add overlay to OBS + - StreamElements browser source + - XSplit overlay + - overlay URL +--- + +import { Steps, Tabs, TabItem } from '@astrojs/starlight/components'; + +Every StreamElements overlay is a web page. To show it on stream, add its URL as a browser source in your broadcast software. + +:::caution[Keep the URL private] +An overlay URL contains a token that identifies your account. Don't share it publicly or show it on stream — anyone with the URL can view (and on some pages, edit) your overlay. +::: + +## Get the overlay URL + + + +1. Go to [My Overlays](https://streamelements.com/dashboard/overlays). +2. Open the overlay's menu (the three dots) and select **Copy URL**. + + You can also copy it from inside the overlay editor, using the link icon in the top-right corner. + + + +## Add it to your broadcast software + + + + + + + +1. In the **Sources** panel, click **+** and select **Browser**. +2. Choose **Create new**, name it (for example "Stream Overlay"), and click **OK**. +3. Set these properties, then click **OK**: + - **URL:** the overlay URL you copied above. + - **Width:** `1920` (unless you changed your overlay's resolution). + - **Height:** `1080` (unless you changed your overlay's resolution). + - **FPS:** `30` or `60`, depending on your stream settings. + - Leave **Custom CSS** as default. + + + +Repeat this for each overlay you want to use — the same steps work on OBS for Mac. + + + + + +Add the overlay as a **Browser Source** using the same URL, width, and height as above. + +:::note[Overlays not showing up?] +XSplit versions older than 4.5.2306.2701 use an outdated Chromium Embedded Framework (CEF) and can't load current StreamElements overlays. Update XSplit to the latest version, or update its CEF package, to fix this — see [Troubleshooting](/overlays/troubleshooting#xsplit) for links. +::: + + + + + +## Using multiple overlays + +You can add as many overlays as you like — repeat the steps above for each one. Give each scene its own overlay (or overlays), or reuse a single overlay across scenes for elements like a unified AlertBox — see [AlertBox alert variations](/overlays/alertbox-variations) for that setup. + +## Related + +- [Troubleshooting](/overlays/troubleshooting): overlays not appearing, stuttering, or missing sound. +- [AlertBox alert variations](/overlays/alertbox-variations): customize what plays for follows, subs, tips, and more. diff --git a/src/content/docs/overlays/chat-widget.mdx b/src/content/docs/overlays/chat-widget.mdx new file mode 100644 index 0000000..4265aa9 --- /dev/null +++ b/src/content/docs/overlays/chat-widget.mdx @@ -0,0 +1,38 @@ +--- +title: Add a Chat Overlay +sidebar: + label: Chat Overlay +description: "Add your stream chat to your overlay with the Your Stream's Chat widget, and customize its appearance." +platforms: [twitch] +keywords: + - Twitch chat overlay + - StreamElements chat widget + - stream chat on overlay +--- + +import { Steps } from '@astrojs/starlight/components'; + +Add a chat widget to your overlay so viewers watching in fullscreen never lose sight of chat. + + + +1. Create a new overlay and choose your resolution (1080p recommended). +2. Click **+** to add a widget, then choose **Stream Tools > Your Stream's Chat**. +3. Customize its appearance: + - Resize the chat box to fit your layout. + - Set the theme to **Custom** for full control over styling. + - Pick a font, and adjust text color and size. + - Add a text shadow if the box sits over a bright background. +4. Save the overlay, name it, and copy its URL from the link icon at the top. + + + +Then [add the overlay to OBS or XSplit](/overlays/broadcast-software) like any other. + +## Emote support + +The widget renders Twitch emotes, including animated ones, plus third-party emotes from BTTV, FFZ, and 7TV. Unlisted 7TV emotes are the one exception — they won't appear. + +## Related + +- [Add an overlay to your broadcast software](/overlays/broadcast-software) diff --git a/src/content/docs/overlays/getting-started.mdx b/src/content/docs/overlays/getting-started.mdx index 7010166..439b981 100644 --- a/src/content/docs/overlays/getting-started.mdx +++ b/src/content/docs/overlays/getting-started.mdx @@ -90,9 +90,23 @@ To create a Custom Widget: +## Show it on stream + +An overlay only appears once you add its URL to your broadcast software as a browser source — see [Add an Overlay to Your Broadcast Software](/overlays/broadcast-software) for OBS and XSplit steps. + ## Next steps + + + + + + + + + +1. Go to [Overlays](https://streamelements.com/dashboard/overlays) and create a new overlay (or open an existing one). +2. Click **Add widget**, hover **Alerts**, and select **KappaGen**. +3. Drag the widget's bounding box to cover the whole canvas, so emotes can appear anywhere on screen. + + + +:::tip +Give KappaGen its own dedicated overlay for easier control over layering and visibility. +::: + +## General settings + +- **Enable Seasonal Hats** adds seasonal decorations (like a Santa hat) to emotes. +- **Emote Size** — keep this moderate. Very large sizes can cause stream delays. + +## Chat Emotes + +Shows emotes sent in chat, with an animation style you choose from five presets. + +- **Combo mode** shows emote combos from the [Emote Combos module](/chatbot/modules/emotecombo) when it's enabled. +- You can restrict triggering to subscribers only, and set how many emotes per user per second are allowed and how long each stays on screen. + +### Custom emotes + +Open the cog icon next to **Custom Emotes** to add your own. If the file is an animated GIF, check the corresponding box. You can also trigger a custom emote by a regex pattern instead of exact text, if you're comfortable writing one. + +If new or updated emotes aren't showing up, run `!emotes reload` in chat and allow up to 24 hours for KappaGen's cache to catch up. + +## Emotesplosions + +Triggered by chat events or the `!kappagen` command. Configure: + +- **Animation Option** — one of five animation styles. +- **Alert Types** — which events trigger an explosion. +- **Emotes to Show** — how many emotes appear per explosion. +- **Select Emotes** — which emotes are eligible. + +## Related + +- [`!kappagen`](/chatbot/commands/default/kappagen): the chat command that triggers Emotesplosions. +- [`!emotes`](/chatbot/commands/default/emotes): reload or list available emotes. +- [Add an overlay to your broadcast software](/overlays/broadcast-software) diff --git a/src/content/docs/overlays/session-data.md b/src/content/docs/overlays/session-data.md index 9cd37ec..ec93fd2 100644 --- a/src/content/docs/overlays/session-data.md +++ b/src/content/docs/overlays/session-data.md @@ -9,7 +9,7 @@ keywords: - Stream overlay development --- -The session `data` object holds per-feature totals, goals, and latest-event details for your channel — the same values visible in the [Session Dashboard](https://streamelements.com/dashboard/session). Custom widgets receive it through the [onWidgetLoad and onSessionUpdate events](/overlays/events): +The session `data` object holds per-feature totals, goals, and latest-event details for your channel — the same values visible in the [Widget Data dashboard](/overlays/widget-data). Custom widgets receive it through the [onWidgetLoad and onSessionUpdate events](/overlays/events): - In `onWidgetLoad`, `data` is available at `obj.detail.session.data` - In `onSessionUpdate`, `data` is available at `obj.detail.session` diff --git a/src/content/docs/overlays/troubleshooting.md b/src/content/docs/overlays/troubleshooting.md new file mode 100644 index 0000000..f8d540c --- /dev/null +++ b/src/content/docs/overlays/troubleshooting.md @@ -0,0 +1,37 @@ +--- +title: Troubleshooting +description: "Fix overlays not appearing in OBS, stuttering, missing sound, and XSplit compatibility issues." +keywords: + - StreamElements overlay troubleshooting + - overlay not showing OBS + - overlay stuttering + - XSplit overlay not working +--- + +## Overlay not appearing + +- Check the browser source resolution matches your overlay — usually **1920x1080**. +- Try toggling **Browser Source Hardware Acceleration** (OBS: **Settings > Advanced**) — enable it if it's off, or disable it if it's on. +- Re-copy the overlay URL and re-paste it into the source's Properties: open [My Overlays](https://streamelements.com/dashboard/overlays), open the overlay's menu, click **Copy URL**, then paste it into the browser source's Properties in OBS. +- Confirm alerts aren't muted or paused in your Activity Feed. + +## Overlay stuttering + +Usually the same fixes as above — try toggling hardware acceleration first, then confirm the source resolution and FPS match your stream settings. + +## No sound from alerts + +See the Audio Issues section of [SE.Live Troubleshooting](/selive/troubleshooting) — the same browser-source audio setup applies whether or not you use SE.Live. + +## XSplit + +Overlays require a recent Chromium Embedded Framework (CEF) version. If overlays fail to load in XSplit: + +- Update to **XSplit 4.5.2306.2701 or newer**, which ships with an up-to-date CEF, or +- Update the CEF package manually if you can't upgrade XSplit yet. + +If neither resolves it, [contact support](https://streamelements.com/contact). + +## Still stuck? + +[Reach out to our support team](https://support.streamelements.com/hc/en-us/requests/new) for further help. diff --git a/src/content/docs/overlays/widget-data.mdx b/src/content/docs/overlays/widget-data.mdx new file mode 100644 index 0000000..4949136 --- /dev/null +++ b/src/content/docs/overlays/widget-data.mdx @@ -0,0 +1,37 @@ +--- +title: Widget Data Dashboard +sidebar: + label: Widget Data +description: "View and edit the data behind your overlay widgets: recent follower/sub/tip labels, goal progress, session totals, and aggregates." +keywords: + - StreamElements widget data + - session dashboard + - overlay labels + - goal widget data +--- + +:::note[Looking for the developer reference?] +This page covers the dashboard for viewing and correcting your account's widget data. If you're writing custom widget code and need the `session.data` object's keys, see the [Session Data Reference](/overlays/session-data) instead. +::: + +The Widget Data dashboard controls the information your overlay widgets display — Label widgets ("latest follower"), goal widgets, and more. It's useful for correcting a misspelled username or an incorrect amount without waiting for a new event. + +## Accessing it + +Open the [Widget Data dashboard](https://streamelements.com/dashboard/session) directly, or reach it from the Overlay Editor's **Session Data** tab. + +If you use SE.Live, you can add it as a custom dock: **View > Docks > Custom Browser Docks...**, then use the dashboard link above as the URL. + +## Sections + +- **Labels** — the data behind Latest/Recent widgets. Edit or clear a username and amount under **Latest Data**, or remove individual entries from **Recent Data**. +- **Goals** — progress for Follower, Subscriber, Tip, and Cheer goal widgets. Values update automatically as events come in, but you can set or clear them manually. Goals don't reset between sessions on their own. +- **Session Data** — event counts and session "tops" (biggest tip, biggest cheer, etc.) for the current session. Sessions reset automatically 15 minutes after you go offline, or you can reset one manually. +- **Totals** — read-only totals pulled directly from your connected channel (followers, subscribers, cheers, tips). +- **Aggregates** — totals across a longer period (the last 7 or 30 days). Not directly editable, but they reflect account-level changes. +- **Settings** — choose whether aggregates use a rolling window (last 7/30 days) or calendar periods (last week/month), and control session resets. + +## Related + +- [Session Data Reference](/overlays/session-data): the same data, as keys for custom widget code. +- [AlertBox alert variations](/overlays/alertbox-variations) diff --git a/src/content/docs/selive/getting-started.mdx b/src/content/docs/selive/getting-started.mdx index 536c0f6..8a09bab 100644 --- a/src/content/docs/selive/getting-started.mdx +++ b/src/content/docs/selive/getting-started.mdx @@ -3,13 +3,17 @@ title: Install and connect SE.Live description: Download SE.Live, install it in OBS Studio, and connect your StreamElements account. --- -## Install +## Requirements + +- OBS Studio 31.x or newer. +- SE.Live is available for Windows and in beta for macOS. +- For Twitch dual format, follow the separate [dual format setup](/selive/guides/twitch-dual-format) requirements. -SE.Live is available for Windows and in beta for macOS. On Windows, use OBS Studio 31.x or newer. For Twitch dual format, follow the [dual format setup](/selive/guides/twitch-dual-format) requirements. +## Install 1. Download the installer for your operating system from the [SE.Live page](https://streamelements.com/selive). Choose the Mac beta for macOS. -2. Close OBS, then run the installer. -3. Reopen OBS and look for the **StreamElements** menu. +2. Close OBS, then run the installer, choosing your install folder. +3. Reopen OBS **as Administrator** and look for the **StreamElements** menu. ## Connect @@ -18,6 +22,39 @@ SE.Live is available for Windows and in beta for macOS. On Windows, use OBS Stud Open chat and activity through **StreamElements → SE.Live Docks**. If the docks are missing, follow the [troubleshooting steps](/selive/troubleshooting#missing-docks). +If you're prompted to complete setup again inside SE.Live, choose **Do it later** and **Leave** to dismiss it. + +Use OBS's **Profiles** and **Scene Collection** features to save your dock layout and connected accounts. If you switch profiles, log out (**StreamElements → Logout**) and back in with the correct account afterward. + +## The StreamElements menu + +The StreamElements menu in OBS gives you quick access to: + +- **Stream Setup** — configure stream details and settings. +- **Edit Widgets Data** — manage and customize widgets directly from SE.Live. +- **Setup Bot & Tipping** — initial setup for the chat bot and tipping. +- **Browse Overlays** — jump to your overlays in the StreamElements dashboard. +- **SE.Live Docks** — toggle the Activity Feed, Chat, or Media Request docks. +- **Import** — bring in settings from another service. +- **SE.Live Versions** — switch between stable and latest builds. +- **Cloud Backup / Manage Cloud Backup** — back up or restore your OBS profiles and scene collections to your StreamElements account (see below). +- **Check for Updates** — verify whether a newer SE.Live version is available. +- **Help** — report issues or reach the StreamElements Discord via live chat. +- **Logout** — sign out of SE.Live. + +### Cloud Backup + +Back up your OBS profiles and scene collections to your StreamElements account: + +1. Go to **StreamElements → Cloud Backup → Backup Settings and Content**. +2. Name the backup, select which profiles and scene collections to include, and click **Backup**. + +To restore, go to **StreamElements → Cloud Backup → Manage Cloud Backups**, open the backup you want, select what to restore, and click **Restore** — OBS restarts once it's done. + +:::note +Backups are capped at 100MB total. Keep large files like videos out of the backup and store them locally instead. +::: + For the full setup walkthrough, see the [SE.Live support guide](https://support.streamelements.com/hc/en-us/articles/18771457842066). ## Next steps diff --git a/src/content/docs/selive/guides/multistreaming.mdx b/src/content/docs/selive/guides/multistreaming.mdx index 5868982..a273ad9 100644 --- a/src/content/docs/selive/guides/multistreaming.mdx +++ b/src/content/docs/selive/guides/multistreaming.mdx @@ -6,7 +6,11 @@ description: Connect streaming outputs, choose audio tracks, and go live on mult import GuideScreenshot from '../../../../components/GuideScreenshot.astro'; import outputs from '../img/multistream-outputs.png'; -Each output sends your stream to a platform. SE.Live sends these streams from your computer, so your upload connection must handle their combined bitrate. Three outputs at 6,000 Kbps need 18,000 Kbps, plus room for overhead. +Each output sends your stream to a platform. SE.Live sends these streams from your computer, so your upload connection must handle their combined bitrate. Three outputs at 6,000 Kbps need 18,000 Kbps, plus room for overhead. For best performance, use a system built from 2019 onward. + +:::note +X (Twitter) support isn't fully operational yet — StreamElements is prioritizing it, so follow their social channels for updates. +::: ## Connect your outputs @@ -23,7 +27,7 @@ Each output sends your stream to a platform. SE.Live sends these streams from yo 2. Check each channel name and assigned canvas. Use a [custom canvas](/selive/guides/canvas) for a separate layout. 3. Under **Broadcast Settings**, set each stream's title, category, and platform options, such as YouTube privacy. -TikTok requires LIVE access before you can stream to it. +A TikTok output always appears by default, even before you have LIVE access — connecting your account here fast-tracks TikTok's review process. Once you're logged in and granted LIVE access, the output switches to **On** automatically. ## Go live @@ -35,4 +39,19 @@ To stop one output while the others keep streaming, turn off its toggle in the M For horizontal and vertical streams on Twitch, use [Twitch dual format](/selive/guides/twitch-dual-format). On YouTube, use [YouTube dual stream](/selive/guides/youtube-dual-stream). -[More about multistreaming](https://support.streamelements.com/hc/en-us/articles/18771457842066-SE-Live-The-Complete-Guide-Setup-Features-Multistreaming-Troubleshooting). +## FAQ + +**Where are my TikTok chat and events?** +TikTok hasn't yet opened the APIs needed to support it in the Activity Feed and Multi-Chat. Events currently appear in your chat dock without alerts — open the stand-alone TikTok Chat dock from the StreamElements menu. + +**Can I add more than one output for the same platform?** +Yes — for example, one horizontal and one vertical output for YouTube, which gets two outputs per channel automatically since it supports both simultaneously. For TikTok, add the second stream as a Custom RTMP output. + +**Do I need to re-enter my stream key every time I open OBS?** +No, SE.Live remembers connected accounts and reconnects automatically. + +**Can I use custom resolutions, bitrates, or audio channels per platform?** +Yes to all three — set up a separate canvas per platform for custom resolutions, configure bitrates per platform or canvas, and set audio channels in each output's settings. + +**Can I create and link multiple canvases?** +Yes, and you can link them together. More active canvases and outputs use more system resources. diff --git a/src/content/docs/selive/guides/overlays-and-alerts.mdx b/src/content/docs/selive/guides/overlays-and-alerts.mdx index e145afd..ebb16b4 100644 --- a/src/content/docs/selive/guides/overlays-and-alerts.mdx +++ b/src/content/docs/selive/guides/overlays-and-alerts.mdx @@ -14,6 +14,12 @@ import alertbox from '../img/alertbox-menu.png'; +## Test it and plan your scenes + +Type in your chat to confirm chat and alerts appear correctly once the overlay's in OBS. Most creators set up a handful of scenes — `In Game`, `BRB`, `Stream Starting`, `Just Chatting` — each with its own layout, and use Label widgets to show recent activity (subs, tips) on screen. + +The [Themes Gallery](https://streamelements.com/dashboard/themes) has ready-made themes and Super Themes if you'd rather start from a complete look than build one widget at a time. + ## Add it to OBS 1. In **My Overlays**, open the overlay's three-dot menu and select **Copy URL**. You can also use the link icon in the overlay editor. @@ -22,13 +28,15 @@ import alertbox from '../img/alertbox-menu.png'; 4. Set **Width** and **Height** to match the overlay. A 1920 × 1080 overlay needs those same source dimensions; use your overlay's dimensions for a vertical layout. 5. Save, then place the browser source above sources that would cover it. -Keep the overlay URL private. +:::caution[Keep the URL private] +The overlay URL contains a token tied to your account — don't expose it to viewers or share it publicly, and be careful editing your overlay in the browser, since the URL is visible in the address bar. +::: ## Customize alerts In the overlay editor, select the AlertBox and open the gear beside an event type to change its image, sound, text, layout, and duration. Save your changes. -Check enabled variations too: changing a default alert does not change every variation. Customize or disable variations you do not want. See [Setting Up Twitch Alerts](https://support.streamelements.com/hc/en-us/articles/16789217829778-Setting-Up-Twitch-Alerts-with-StreamElements-Overlays) for examples. +Check enabled variations too: changing a default alert does not change every variation. Customize or disable variations you do not want — see [AlertBox alert variations](/overlays/alertbox-variations) for the full breakdown of subscriber, tip, cheer, and raid variations, plus text-to-speech setup. ## Use alerts across scenes diff --git a/src/content/docs/selive/guides/scenes-and-sources.mdx b/src/content/docs/selive/guides/scenes-and-sources.mdx index d12bc64..f7d0c31 100644 --- a/src/content/docs/selive/guides/scenes-and-sources.mdx +++ b/src/content/docs/selive/guides/scenes-and-sources.mdx @@ -32,6 +32,10 @@ Reusing a source uses fewer resources than creating another instance. For browse Open the canvas settings with the gear icon. Choose the canvas you want to edit, then check its name, resolution, and assigned outputs. Save any changes. +:::note[Advanced Encoding Options (beta)] +In the Advanced section at the bottom of canvas settings, you can choose an encoding method per canvas, or overwrite the global encoding settings for a specific output. +::: + ## Link scenes Link a canvas scene to its matching OBS scene. For example, link a vertical **Just Chatting** scene to your horizontal **Just Chatting** scene. @@ -40,4 +44,6 @@ Link a canvas scene to its matching OBS scene. For example, link a vertical **Ju 2. Select **Link scene**, then choose the OBS scene. 3. Switch to the canvas scene and check that the linked OBS scene changes too. +Once linked, switching scenes in your Multistreaming tool changes every linked platform automatically — including through Stream Deck, with no extra configuration needed. + [More about scenes and sources](https://support.streamelements.com/hc/en-us/articles/25445654050450-Creating-and-Managing-Scenes-and-Sources-in-SE-Live). diff --git a/src/content/docs/selive/guides/twitch-dual-format.mdx b/src/content/docs/selive/guides/twitch-dual-format.mdx index 292ec26..61a09b7 100644 --- a/src/content/docs/selive/guides/twitch-dual-format.mdx +++ b/src/content/docs/selive/guides/twitch-dual-format.mdx @@ -36,4 +36,18 @@ Click **Start Streaming** in OBS. Open your stream on a phone and check it in po To return to horizontal-only streaming, set **Additional Canvas** to **None**. +## FAQ + +**Do I need Twitch's approval to use dual format?** +Yes — beyond installing SE.Live, you also need to be accepted into Twitch's own Dual Output Beta. StreamElements doesn't control that approval; if you stream without it, OBS shows an error when you try to go live. See [Twitch's Dual Output Beta info](https://help.twitch.tv/s/article/dual-format-vertical-video?language=en_US) for how to apply. + +**OBS is crashing while I use dual format.** +Try rolling back to OBS 31 — OBS 32 has known stability issues affecting several plugins, including SE.Live. + +## Known issues + +Deleted canvases can still appear in Twitch's canvas selection dropdown, marked **Inactive**. There's currently no way to remove them — this is a known OBS bug, with no fix ETA yet. + +## Get help + [Get help with dual format setup](https://support.streamelements.com/hc/en-us/requests/new). diff --git a/src/content/docs/selive/guides/youtube-quickstart/build-your-overlay.mdx b/src/content/docs/selive/guides/youtube-quickstart/build-your-overlay.mdx index 7a2f9ad..6795351 100644 --- a/src/content/docs/selive/guides/youtube-quickstart/build-your-overlay.mdx +++ b/src/content/docs/selive/guides/youtube-quickstart/build-your-overlay.mdx @@ -64,4 +64,6 @@ Save the overlay. You'll add its URL to OBS next. + + diff --git a/src/content/docs/selive/guides/youtube-setup.mdx b/src/content/docs/selive/guides/youtube-setup.mdx index 747c831..c116c3b 100644 --- a/src/content/docs/selive/guides/youtube-setup.mdx +++ b/src/content/docs/selive/guides/youtube-setup.mdx @@ -22,7 +22,7 @@ import { Steps } from '@astrojs/starlight/components'; 3. **Add your YouTube stream key:** open **Settings → Stream**, choose **YouTube / YouTube Gaming**, and paste your stream key — find it via **Get stream key**, or under [youtube.com/live_dashboard](https://www.youtube.com/live_dashboard) → **Encoder setup**. Never share your stream key. -4. **Add a YouTube overlay:** in the [Themes Gallery](https://streamelements.com/dashboard/themes), open the **Theme** tab and choose the **YouTube Theme** (the static option gives the best CPU performance). Create and name it, then open it in **My Overlays**. Select the AlertBox, open its settings, and deselect every checkbox except **SuperChat** — YouTube's other event types aren't supported yet. Copy the overlay's URL, create a new browser source in SE.Live, paste it in, set the resolution to 1920x1080, and check **Shutdown when source not visible**. +4. **Add a YouTube overlay:** in the [Themes Gallery](https://streamelements.com/dashboard/themes), open the **Theme** tab and choose the **YouTube Theme** (the static option gives the best CPU performance). Create and name it, then open it in **My Overlays**. Select the AlertBox, open its settings, and deselect every checkbox except **SuperChat** — YouTube's other event types aren't supported yet (see [Add the Chatbot to Your Channel](/chatbot/platforms) for the current list). Copy the overlay's URL, create a new browser source in SE.Live, paste it in, set the resolution to 1920x1080, and check **Shutdown when source not visible**. 5. **Add the StreamElements chatbot as a moderator:** copy the StreamElements Chatbot URL from onboarding, then paste and approve it under your YouTube dashboard's **Settings → Community**. @@ -32,4 +32,5 @@ You're ready to go live. ## Related +- [Add the Chatbot to Your Channel](/chatbot/platforms): the chatbot side of YouTube setup, including which features aren't available on YouTube. - [Add overlays and alerts](/selive/guides/overlays-and-alerts) diff --git a/src/content/docs/selive/index.mdx b/src/content/docs/selive/index.mdx index 0042798..2e59250 100644 --- a/src/content/docs/selive/index.mdx +++ b/src/content/docs/selive/index.mdx @@ -15,4 +15,5 @@ SE.Live brings StreamElements chat, activity, and streaming tools into OBS Studi + diff --git a/src/content/docs/selive/troubleshooting.mdx b/src/content/docs/selive/troubleshooting.mdx index 1311be9..7da2090 100644 --- a/src/content/docs/selive/troubleshooting.mdx +++ b/src/content/docs/selive/troubleshooting.mdx @@ -13,6 +13,14 @@ Open **StreamElements → SE.Live Docks**. If docks remain missing, use **Stream Retry with Google Chrome. If a VPN or browser extension blocks login, temporarily pause it and retry, then restore it. +## Can't log in with an X (Twitter) account + +Remove two-factor authentication from your X account, then log in to SE.Live again. + +## Stream Deck plugin not recognized + +The [SE.Live Stream Deck plugin](https://marketplace.elgato.com/product/streamelements-selive-61e7874a-5238-4182-9e66-1b78d86795bc) is sensitive to OBS's install path. Install OBS to its default location to avoid the plugin not being recognized. + ## Overlays or alerts do not appear 1. Copy the overlay URL again from **My Overlays → three-dot menu → Copy URL** and paste it into the browser source's **Properties**. @@ -25,11 +33,15 @@ If you hear an alert but cannot see it, move its browser source above sources co ## Alert audio +**Not hearing alerts at all?** First confirm your audio device works outside OBS (Discord, Spotify, etc.), then check **Settings → Audio**: set your main output as **Desktop Audio**, and your microphone as **Mic/Auxiliary Audio**. Layer order also matters — an alert overlay's browser source needs to sit above other sources, or you may hear the alert without seeing it. + +**Changing the alert volume:** + 1. Open the browser source's **Properties** and enable **Control audio via OBS**. 2. Adjust its volume in the OBS mixer. 3. To hear it locally, open **Advanced Audio Properties** and set its monitoring to **Monitor and Output**. -Check your audio routing if this produces duplicate sound. +Check your audio routing if this produces duplicate sound. Still stuck? The [OBS Discord](https://discord.gg/obsproject) covers general OBS audio routing questions. ## Update loops @@ -37,16 +49,31 @@ Update OBS to its latest stable release, then reinstall [SE.Live](https://stream ## Crashes or hangs -Update OBS and SE.Live, then temporarily disable other plugins and retry. Complete the BugSplat report if it appears. Support can guide you through trace logs or a memory dump if needed. +Update OBS and SE.Live, then temporarily disable other plugins and retry. Complete the BugSplat report if it appears — it sends a diagnosis report to StreamElements automatically. + +If crashes persist, add `--setrace` to your OBS shortcut's target field (right-click the shortcut → **Properties**) before reproducing the crash, then share both the resulting trace and your regular crash logs when you [contact support](https://support.streamelements.com/hc/en-us/requests/new). + +**If OBS hangs without producing a crash log** (Windows, requires OBS 31.x+): reproduce the hang without closing OBS, open Task Manager (**Ctrl+Shift+Esc** → **Details**), right-click `obs64.exe`, and select **Create memory dump file**. If this fails, retry Task Manager as Administrator, and only create one dump at a time. + +:::note +SE.Live isn't supported inside a portable OBS installation — use a regular install for full compatibility. +::: + +## Uninstalling SE.Live + +See [Uninstalling SE.Live](/selive/uninstall) for the full removal steps, including how to back up your OBS profile first. ## Streaming performance Check the combined bitrate of your [multistreaming outputs](/selive/guides/multistreaming). Also check for [unused Backtrack buffers](/selive/guides/backtrack#limit-resource-use), which consume encoding resources even while idle. +If your stream lags or drops frames when streaming to multiple platforms at once, switch to **GPU encoding** — CPU encoding struggles once you're sending three or more simultaneous outputs. + Use the OBS guide that matches the problem: - [Stream connection troubleshooting](https://obsproject.com/kb/stream-connection-troubleshooting) for disconnects and dropped frames. - [Encoding performance troubleshooting](https://obsproject.com/kb/encoding-performance-troubleshooting) for choppy video and encoder overload. +- [Laptop troubleshooting](https://obsproject.com/wiki/Laptop-Troubleshooting) if window, game, or display capture sources show a black screen. ## Get help with your setup diff --git a/src/content/docs/selive/uninstall.mdx b/src/content/docs/selive/uninstall.mdx new file mode 100644 index 0000000..0409855 --- /dev/null +++ b/src/content/docs/selive/uninstall.mdx @@ -0,0 +1,44 @@ +--- +title: Uninstalling SE.Live +description: "Remove the SE.Live plugin from Windows, and back up your OBS profile first if you plan to reinstall." +keywords: + - uninstall SE.Live + - remove SE.Live plugin + - OBS profile backup +--- + +import { Steps } from '@astrojs/starlight/components'; + +## Back up your profile first (optional) + +If you might reinstall later, save your OBS profile before uninstalling: + + + +1. Open File Explorer and go to `%appdata%\obs-studio\basic`. +2. Copy both folders inside it to another location. + + + +After reinstalling, paste the folders back into that same directory to restore your setup. + +## Uninstall + + + +1. Open the **Start Menu** and search for **Control Panel**. +2. Open **Programs and Features** (Large Icons view) or **Uninstall a Program** (Category view, under Programs). +3. Find **StreamElements SE.Live** in the list and select it. +4. Click **Uninstall** and follow the prompts. + + + +Rebooting your PC afterward is recommended. + +### If uninstalling fails + +Install OBS over your current installation folder, then try uninstalling SE.Live again. If it still fails, reinstall OBS from the [latest version](https://obsproject.com/download) and retry. + +## Related + +- [Troubleshooting](/selive/troubleshooting)