Quick Setup Guide
Integrate with OBS Studio
Follow these simple steps to display your custom StreamerChat overlay directly on your stream.
1
Generate Your Link
Go to your Streaming Setup dashboard. Configure your theme, font size, and channel. Once you are happy, click Initialize & Generate Link.
Dashboard > Streaming Setup > Cloud Link
Initialize & Generate Link
https://streamerchat.de/overlay?id=...
Properties for 'Chat Overlay'
URL
https://streamerchat.de/overlay?id=...
Width
500
Height
700
Custom CSS
body { background-color: rgba(0, 0, 0, 0); margin: 0px auto; overflow: hidden; }
Refresh browser when scene becomes active
Cancel
OK
2
Add Browser Source
- 1.Open OBS Studio and in your Sources dock, click + and select Browser.
- 2.Paste your generated URL into the URL field.
- 3.Set Width to 500 and Height to 700.
💡 Pro Tip: These dimensions are just a starting point! You can resize and scale the source directly in the OBS preview to fit your layout perfectly.
- 4.Check "Refresh browser when scene becomes active".
- 5.Click OK. Your chat is now live!
Pro Tip
You don't need to update the URL in OBS when you change settings. Just click Update Cloud Design in your dashboard, and your OBS overlay will automatically refresh with the new style!