Hey, this is Dustin from Streamlabs.
Today I'm going to show you how to set up
a chat box widget in Streamlabs OBS.
This is especially helpful to those streamers
who may stream on Twitch but archive clips
somewhere else, like YouTube, and want to
keep what is being said in chat available
for those viewers to see later.
You’re going to want to open up Streamlabs
OBS and find “Chat Box” from the left
side of your dashboard under “Widgets”.
Near the top you’ll see a preview of what
your chat box widget will look like, it’s
great to reference this as you make changes.
The first option is a theme.
There’s a few options available here, maybe
we stream a lot of retro games so we want
an oldschool look.
Next we have badges.
In the platform’s live chat it will always
show these badges, but for this widget you
can choose to have them not appear.
Let’s leave all these on.
Similarly, third party emotes like BetterTTV
and FrankeFaceZ can also be enabled.
The background color is the color used for
testing the widget.
On your stream the widget will have a transparent
background and you can put a graphic under
it to add clarity to the text color.
You can adjust font size as well.
If you’d like to keep your chat box as clean
as possible you can choose to have messages
hide after being displayed a certain amount
of time.
Let’s change it to 20 seconds.
If you’d like to have chat messages shown
always, or until they are replaced with new
ones, check “Always Show Messages”.
To clean up even more, Streamlabs OBS allows
you to hide common chat bots and commands.
You can also mute specific chatters by filling
out their names, one per line.
For the next section, if you have some knowledge
of HTML, CSS, and Javascript--or a designer
friend who does--you can customize your chat
box even more by enabling custom code.
We’ll leave this disabled and stick with
the old school theme we chose earlier.
Now click Save Settings.
In Streamlabs OBS editor, under sources go
to the plus sign, add “Chatbox” and press
“add source”.
Name it what you’d like.
When you get it just how you want it to look,
move it over to where you want it on your
scene.
Once placed, you can test the chatbox by going
into your stream chat and typing some test
messages, they will appear on the widget in
the Streamlabs OBS editor as they would on
your stream.
If you aren’t using Streamlabs OBS, you
can place the widget by pasting the URL from
the top as a browser source.
Be sure to download Streamlabs OBS by visiting
Streamlabs.com and hop into our Discord server
at Discord.gg/stream for live community support.
Check out the links in the description below.
