Skip to content
Senchabot Extensions

Guide

How to add a Senchabot widget to OBS as a Browser Source

Senchabot widgets go into OBS as a Browser Source: click + in the Sources dock, pick Browser, paste the URL you copied from the setup page into the URL field, and set the width and height to the widget's recommended size. You don't need to log in or download anything, and the background is already transparent.

Published

Tools covered:Chat BoxEmote WallSub SproutRaffle

How do you add a Browser Source in OBS?

Once you type your channel name on the setup page and hit Copy, follow these steps in OBS Studio:

  1. Select the scene the widget should appear in.
  2. In the Sources dock, click + and pick Browser from the list.
  3. Give the source a name, for example "Chat Box", and click OK.
  4. In the properties window that opens, clear the URL field and paste the widget URL you copied.
  5. Enter the values from the table below in the Width and Height fields.
  6. Click OK and drag the source wherever you want it in the scene.

The Chat Box setup page shows these steps along with the recommended size when you copy the URL. If you want to be sure, open the URL in a regular browser tab first and check that it works.

What size should each widget be?

Every widget has a recommended source size. Enter these values in the Width and Height fields in OBS.

Recommended Browser Source sizes for Senchabot widgets
WidgetWidth × HeightNote
Chat Box400 × 600A vertical chat column. A bigger source fits more messages, the text stays the same size.
Emote Wall1920 × 1080A full 1080p canvas. Emotes show up anywhere on the screen.
Sub Sprout800 × 600The plant and pot grow inside this area.
Stream Alerts800 × 450One alert at a time, in the middle of this area. A bigger source scales it up.
Sub Goal800 × 260A wide strip for the goal bar, with room above it for the +1s to rise into.
Stream Frames1920 × 1080640x360 for a camera, 420x720 for chat, 1920x1080 for the screen. The frame fits whatever size you give it.
Stream Countdown1920 × 1080A full 1080p canvas, so the clock lands in the middle of your starting or BRB scene.
Socials600 × 120One handle at a time, in the middle of this strip. The text keeps its size, so a long handle needs a wider source.
Chat Poll640 × 560Room for a poll with up to 6 options. It sits at the top or bottom and grows with the options.
Raffle1920 × 1080The winner overlay. Confetti bursts from both sides of the screen and the winner's name appears in the middle.
Subathon Timer800 × 300A wide strip for the health bar, clock or ring. A bigger source scales it up.
OBS BridgeNot a sourceNot a visible overlay. Keep the tool open in a browser tab or an OBS dock.

To make the Chat Box text bigger, don't stretch the source. Use the Font Size setting on the setup page: 8 to 72 pixels, 18 by default.

Do you need to do anything to make the background transparent?

No. Chat Box, Emote Wall, Sub Sprout, Subathon Timer, Stream Alerts, Sub Goal, Stream Frames, Stream Countdown, Chat Poll, Socials and the Raffle overlay are drawn on a transparent background. You don't need a chroma key or a filter, and you can leave the Custom CSS field in OBS as it is.

If Chat Box is hard to read on a bright scene, turn on Dark Background. It puts a semi-transparent black layer behind the widget, and you can set its opacity anywhere from 0% to 100% (50% by default). If you want each message in its own box, turn on Message Background Box.

Should "Shutdown source when not visible" and "Refresh browser when scene becomes active" be on?

Leave both off for Senchabot widgets. Both reload the page from scratch, and the widget forgets everything it was holding up to that point:

  • Chat Box: messages only come in while the source is running. If the source shuts down and comes back, the screen starts empty and only shows new messages.
  • Sub Sprout: the plant is saved inside OBS, so a reload keeps the stage it reached, but subs that come in while the source is off don't grow it.
  • Sub Goal: the count is saved inside OBS, so a reload doesn't lose it, but subs that come in while the source is off aren't counted.
  • Subathon Timer: the time left is saved inside OBS, so a reload doesn't lose it. The timer keeps counting down while the source is off, but it can't see subs that come in during that time.
  • Chat Poll: the poll and its votes are saved inside OBS, so a reload doesn't lose them, but votes typed while the source is off aren't counted.
  • Stream Alerts: only subs, gifts, cheers and raids that come in while the source is running get an alert. Anything that arrives while it's off is missed.
  • Raffle overlay: only the overlay that is open at that moment gets the winner. A winner drawn while the source is off never shows up on screen.
  • Emote Wall: emotes stay for 5 seconds by default, so a refresh doesn't cost you anything, but it doesn't help either.

If a widget gets stuck, double-click the source and hit the "Refresh cache of current page" button in the properties window. That reloads the page once.

How do I change a widget later?

Your settings live inside the widget URL, so changing a setting means a new URL. Change the setting on the setup page, copy the new URL, then double-click the source in OBS and paste it over the old URL in the URL field.

You don't have to start over with Chat Box, Emote Wall, Sub Sprout, Subathon Timer, Stream Alerts, Sub Goal, Chat Poll, Stream Frames, Socials or Stream Countdown. Paste your current URL into the Widget URL field on the setup page and your channels and all your settings come back. Change what you want and copy the new URL.

OBS Bridge has no paste field, so enter your settings again on its setup page and copy the new tool URL. You can also change scene picks and authorized users on the tool page itself and grab the new URL with its Copy Updated URL button. Old URLs keep working, so you don't have to update them.

What should I do if the widget doesn't show up in OBS?

Most of the time the channel name is the problem. Go through these checks in order.

Did you type a link instead of the channel name?

Only type the name in the channel field: senchabot for twitch.tv/senchabot. If you paste the full link, the widget treats the link as the channel name and can't connect to any chat.

Does the channel actually exist?

Check the name for typos. A channel that doesn't exist on Twitch doesn't throw an error. The widget just stays empty.

Has anything happened in chat yet?

Chat Box and Emote Wall stay completely empty and transparent until something happens in chat. Send a message in chat; for Emote Wall it has to be a message made only of emotes by default, but with Show All Emotes on, emotes inside normal messages count too. The Raffle overlay also only appears when a winner is drawn and disappears after 10 seconds. Sub Sprout and Subathon Timer, on the other hand, show up right away.

Kick channel not found?

When the widget opens, it looks up the Kick channel on kick.com. If that lookup fails (wrong name, the channel doesn't exist, or Kick doesn't respond), Kick messages won't come in. Type your Kick name exactly as it appears in the kick.com URL.

Does the URL work in a browser?

Open the URL in a regular browser tab. If it works there but not in OBS, check the source's URL field and size.

Pick your widget and get its URL

Every setup page gives you a ready-made URL to paste into OBS.

All guides