Put overlays and alerts on your stream

Add a browser source in OBS, and fix the usual reasons it looks blank.

GriddleBot overlays are web pages. OBS shows them with a Browser source, exactly like any other alert service.

  1. In the app, open Stream Overlay in the sidebar and design what you want on screen. Press Save layout when you are happy with it.
  2. In the Your browser source card, click Copy.
  3. In OBS, click the + under Sources and choose Browser.
  4. Name it something like "GriddleBot overlay" and click OK.
  5. Paste the link into the URL box.
  6. Set Width and Height to the size the Your browser source card gives - usually 1920 and 1080.
  7. Click OK. Your overlay appears on the scene. Send a test event in the app to see an alert on it.

That link is a secret. Anyone who has it can see - and hear - your overlay. Do not put it on stream, in a screenshot, or in chat. If it leaks, click Get a new link and paste the new one into OBS.

If the overlay is blank

  1. Check the source is above your game capture in the Sources list, not below it.
  2. Right-click the source and choose Refresh.
  3. Make sure the width and height are not 0.
  4. If you just got a new link, the old URL is dead - paste the new one.

Nothing reaches OBS until you press Save layout (or Save alerts). After that the browser source updates itself - you do not need to refresh it, and it waits for any alert on screen to finish first so a change never cuts one off.

All setup guides  ·  Set up clips on Kick  ·  Set up song requests  ·  Run a subathon

GriddleBot home  · Features  · Download  · Pricing  · Discover