FIELD NOTE 07 / TROUBLESHOOTING

Fix a blank OBS Browser source.

Check the file path, rendering size, source order, and refresh settings to find why a local browser scene is blank or stale.

By the FWG Studio team · 6 min read
Published

01 / Check the file OBS is loading

Separate artwork that is missing from artwork that is visible but still. A file-path mistake needs a different fix from a scene exported with motion turned off. These checks are for a local HTML overlay; remote alert services can have separate account, network, or service problems.

Find the exact HTML file selected in the source’s Properties. Does it still exist there? If you renamed or moved it, select it again. Enable Local file before browsing to the file. The official Browser source reference explains this setting.

For a Studio pack, extract the ZIP first. Open PERSONALIZE.html, choose your settings, and use Download OBS scene. Point OBS at that exported HTML. The included browser-source.html is a default scene with placeholders.

Open the same scene file in a desktop browser as a comparison. If it is wrong there too, check the export first. If it looks right there, continue with the OBS checks; the desktop preview alone does not verify the OBS result.

02 / Make sure the scene can be seen

Check the active OBS scene and its Sources list. The eye icon must show the Browser source as visible. A full-screen source above it can cover it even when the HTML loaded correctly. OBS documents source visibility and stacking order.

Create a temporary test scene containing only this Browser source if the current layout makes the cause unclear. If the artwork appears there, compare visibility, stacking, and transforms with the original scene.

Do this test off-air. Keep a familiar static BRB scene available while recovering your normal layout. Change one thing at a time so you can tell which check helped.

03 / Check the rendering area and position

For a saved Studio scene, use a Browser rendering area of 1920 × 1080. These dimensions describe the web page’s viewport. They are separate from the position and size of the source on your canvas.

If only a corner appears, inspect the source’s transform and crop. In the temporary test scene, try Transform → Reset Transform, then Fit to Screen. Check the result before applying the same change to a carefully arranged live layout. The OBS Sources Guide explains transforms and fitting.

04 / Decide whether stillness is intentional

An exported Studio scene can be deliberately still. Check whether you saved it with motion off and whether a reduced-motion preference is active. To change the export, reopen the personalizer, select the setting you want, and download a new scene file.

Watch the background artwork over several seconds. The text and selected state are supposed to remain fixed. Decorative animation does not count down to your stream or advance it to another state.

For the format distinction, see animated HTML scenes versus PNGs. The free sample’s PNGs are static by design.

05 / Reload the file after changing it

After replacing a scene file, open the Browser source’s Properties and use Refresh cache of current page. The Browser source reference describes this control as reloading the page’s content.

Two other settings affect returning to a scene: Shutdown source when not visible unloads the page while hidden; Refresh browser source when scene becomes active reloads it on activation. Choose these deliberately and test a switch away and back. A reload can restart animation, so enabling both is not a general cure for every problem.

06 / Verify the fix and gather useful evidence

Make a short local recording with the recovered scene. Switch away, return, and play it back. Check the actual recording for missing artwork, unexpected resets, and readable text.

If the issue remains, note your OBS version, operating system, exact symptom, and whether the same file works in the temporary test scene. The official OBS Log Analyzer can examine a log for common configuration problems; follow its instructions after reproducing the issue. Review what you share and keep private details out of public screenshots. An analyzer result is a lead to investigate, rather than proof that every overlay problem has been identified.

For help with a Studio purchase or pack file, contact Studio support with those observations.

Keep a simple fallback ready

The free Gridline sample includes a static Starting Soon PNG and About panel, with no email or account. Use the Starting Soon PNG as an Image source when testing a static alternative.

Comparing formats for a new setup? Preview Gridline, then inspect the complete pack’s files. The paid pack includes the local HTML scene and personalizer; the free sample contains static PNGs.

FWG Studio / Your selection

Your cart

Your cart is empty. Pick a look, or try the free Gridline sample first.

Browse the packsDownload the free sample