This is what you need to do to integrate a social wall in your OBS live-stream (for both Mac & Windows):
Set up your social wall
First things first, set up a wall with your desired content.
In Settings, go to Design and choose the layout Fluid.
Turn off Show header.
In Color scheme choose the option Custom and the Customize color scheme panel will appear. There, make the background color #00ff00 (green).
If you’re using the social wall elsewhere, just go to Design>CSS and add this code there:
body.zoom {
background-color: #00ff00;
background-image: none;
}
Then add the class to your wall URL like in this example: https://walls.io/WallsioStories?class=zoom&show_header=0
Activate automatic scrolling
Go to Behavior and activate automatic scrolling.
Set up your OBS
Install OBS - https://obsproject.com/
Create new Scene, with two Sources by clicking +
#1 Video Capture Device: choose your webcam here.
#2 Browser: simply enter the URL of your wall here, and adjust the size etc.
Above Browser click Filters, add a Chroma-Key filter, and choose the colour #00ff00 in Key Colour.
The Browser Source should be stacked above the Video Capture Source so the wall overlays the video.
Now, in the main menu click Start Virtual Camera. Done!
Social media live ticker – Beta feature for API users
🚨 Important: This integration requires access to the Walls.io API, which can be purchased as an add-on for all plans. API access is also included in our Enterprise plans and some legacy plans.
If you prefer a social media live ticker, we got you! This is how to set up a Walls.io live ticker with OBS:
Install OBS- https://obsproject.com/
You can find your API token under Settings>API. If you already have the API access enabled, you will see it already, if not, you will just have to activate it.
Create new Scene, with two Sources by clicking +:
#1 Video Capture Device: choose your webcam here.
#2 Browser: simply enter the below URL, replacing the "yourapitoken" part with your access token with the one of your wall and adjust the size etc.
The Browser Source should be stacked above the Video Capture Source, so that the ticker overlays the video.
Now, in the main menu click Start Virtual Camera.
In Zoom, you can now choose OBS Virtual Camera as a source.
In case you have further questions, don't hesitate to contact the support team via the chat or support@walls.io!