Set up a widget in OBS
Add your 7Overlay browser source to a scene and get it stream-ready.
Before you start
Finish the widget configuration and copy the Browser Source URL displayed by 7Overlay. Do not substitute a control, share, or Custom API URL.
Add a Browser Source
- 1Open the target scene
In OBS, select the scene in which the widget should appear.
- 2Create a Browser Source
Under Sources, choose Add → Browser and give the source a useful name.
- 3Paste the URL
Paste the exact Browser Source URL copied from the widget page.
Use the calculated widget size
Next to the Browser Source URL, 7Overlay displays a calculated Width and Height. Enter those values in the OBS Browser Source properties. The calculation is a recommendation based on the current preview and can be a few pixels off, especially after changing text, font, shadow, paint, emotes, or layout.
If content is clipped, add a little width or height. When exact sizing is not important, 1920 × 1080 is a valid broad fallback, but it is not the widget-specific recommendation.
Recheck the size after design changes
The displayed recommendation can change when the widget design changes. Recheck Width and Height and update the OBS source if necessary. For URL-generated widgets, also copy the newly generated Browser Source URL when the configuration changes the URL.