Many of the projects in this section use local HTML files instead of being hosted on my server. This prevents any possible downtime or problems if my website goes down, increases privacy, and speeds up response time. Adding these sources is a simple process:
Download the relevant HTML file and move it to a permanent folder where you won't accidentally delete it. I suggest a "Twitch" subfolder in your Documents folder, for example.
Open OBS, go to the scene you wish to add the tool to, and click the Plus Sign (+) in the Sources list.
Choose the Browser item from the menu and name the layer appropriately.
In the Properies, click the "Local file" checkbox and then click the "Browse" button that appears.
Navigate to and select the HTML file you just saved, then click Open.
Set the Width and Height as appropriate
Some tools are invisible, but may have "Login" button options which will require some space temporarily. You may go back and set the width and height to a smaller size such as 1 pixel afterward.
You may also scale smaller resolutions up, such as a browser size of 1280x720 upscaled to 1920x1080 to improve the tool's efficiency.
Set the "Page permissions" to "No access to OBS" - none of these tools require direct OBS access.
Check the "Use custom frame rate" checkbox and set a custom frame rate of 30 or 60 if there are visual delays or excessive CPU usage.
Check the "Shutdown source when not visible" for the purposes of disabling the tool temporarily or disabling functionality when hidden.
Check the "Refresh browser when scene becomes active" to prevent strange behavior when the tool is shown after being hidden (such as a bunch of events simultaneously).
Click OK and adjust the location and size of the tool on screen as appropriate.