How to Set Up Pixel Chat for OBS?

joe

New member
I have been struggling with how to set up Pixel Chat for OBS, and the call to action is getting lost on the overlay as well as browser settings. Don't know what am I'm missing/pasting the widget link in?

Is it possible to tell the steps or how they made it work?
 
In order to configure Pixel Chat in OBS, log in or create an account in Pixel Chat, select and customize a single, and then copy its generated browser URL. In OBS, connect a Browser Source, and paste the URL, set the size and press the OK button. Check in your chat to ensure that it works.
 
If you’re stuck on how to set up Pixel Chat for OBS, the most common mistake is pasting the widget link in the wrong source.

Here’s what worked for me:
  1. Open OBS → Sources → + → Browser Source
  2. Paste the Pixel Chat widget URL there (not Media Source)
  3. Set width/height to match your canvas (e.g., 1920×1080)
  4. Enable “Refresh browser when scene becomes active”
  5. Make sure the Pixel Chat overlay layer is ABOVE your gameplay source
Once I did this, the CTA showed up correctly.
 
It took me an unseeingly longer time than I would prefer to admit before I could understand how to install Pixel Chat with OBS.

It turns out that the problem was browser settings - OBS has its browser, and ad blockers, or browser accounts do not pay attention.

It simply worked after the re-copying and pasting of the widget link in a Browser Source.
 
The process of configuring how to set up Pixel Chat for OBS is like OBS is intentionally trying to make you mad.

A single misplaced check box and the overlay disappears into the nothingness.

Outside tip: Sanity, good Source, layer order: You are welcome.
 
The follow-up checklist on how to set up Pixel Chat for OBS:
  • Browse not Image or Media but Browser Source.

  • Turn off Shutdown source not visible.

  • Optional Match overlay Image over pulls to stream overlay Image over pulled stream: overlay streams share the address space size with all exact stream images, yet only one stream is actually created (Erose, 2012).

  • Check pixel chat dashboard: overlay on.

  • Refreshing source of browser after a save.
The majority of CTA problems are related to either scaling or source order as opposed to the widget itself.
 
Back
Top