AD NOTIFICATION

An OBS widget for Twitch that notifies both you and your viewers about upcoming scheduled ads, when ads are actually starting and for how long they last.

Sucks to be a non-sub, huh?
pepeSmoke

BROWSER SOURCE URL

https://tawmae.xyz/overlays/ad-notification.html

SETUP

1. In Streamer.bot, go into the Servers/Clients → WebSocket Server tab. Check Auto Start WebSocket Server, leave Address at 127.0.0.1 and the Port at 8080. You can set a password if you want, just make sure to leave Enforce All Requests unchecked. Start the server.

Here you can check in real-time if your Websocket server is up and running:

2. Copy the Browser Source URL from above into your clipboard.

3. In OBS, create a new Browser Source, name it whatever you want. Then paste the copied URL into URL and preferably set the Width and Height to your OBS canvas size.

And then you're done Pog Clap
If you want to test it, you can create an Ad Run trigger in an empty action in Streamer.bot, rightclick that trigger and hit Simulate Event

CUSTOMIZATION

You can add URL Parameters at the end of the URL to customize certain things. The first parameter is getting added with a ?, every additional one with a &.

Example: https://tawmae.xyz/overlays/ad-notification.html?font=comic+sans+ms&color=pink

Upcoming Ad Warning

Set the warning interval for upcoming scheduled ads. Scheduled ad warnings come 5, 4, 3, 2 and 1 minute before the ad actually starts. The default settings only shows the upcoming ad alert 1 minute before. But you can include all or just specific times to get multiple warnings.

?warnings=5,4,3,2,1

?warnings=5,1

Color

Changes the color of the title and progress bar. Supports hex codes too.

color=blue

color=b81a56

Font

Changes the font used for the text. Supports standard fonts. Use a + character to replace spaces.

font=Arial

font=Comic+Sans+MS

Sound

Toggles whether a tiny sound effect is played when the overlay displays.

sound=true

Entry Direction

Toggles the position and entry direction. Default is top right and transitioning from right to left. Setting this to True will reverse it, being top left and transitioning from left to right.

reverseEntry=true

CHANGELOG

Date	Changes	Version
October 13, 2025	Added notifications for upcoming scheduled ads; added two new URL parameters for upcoming ad warnings and for the position/entry direction	1.0.2
May 17, 2025	Removed 'Ad Mid Roll' as Twitch has dumped it; added ?port and ?address params; made the entire thing a little THICCER (bigger)	1.0.1
February 02, 2025	Release	1.0.0