The streamer.bot website offers a "streamer deck" interface utilizing HTML that can be run on any device. Local and remote connections are available so that your mods can help you stream.
Log in to https://streamer.bot
Ensure the Streamer.bot Connection
option is enabled in your user settings (it should be enabled by default)
Enable the Streamer.bot Website
integration in Streamer.bot
Log in to the website in the top right and then click your icon to find "Decks"
Click on the "New Deck" button to generate a fresh deck.
At the top of the deck's page are 4 things of importance to note:
The options popup allows for greater configuration and styling. It has 4 sections:
General tab allows us to rename the deck as well as enable/disable remote connections and change IPs and port.
Scaling options allow for the number of button by changing the number of Rows and Columns. You can also adjust your viewport for size restrictions. Default is "Auto".
Styles tab allows for changing the background color of the overall deck and allow for custom padding and gaps between buttons.
The Security option are for allowing public or private access to the deck. Setting a deck to private and entering a users discord name and number where it says "User Access" will restrict access to only those added and the broadcaster. Setting to private without any names added secures it to the broadcaster only. Public will allow anyone with the link to access the deck (until changed to Private or deleted).
To add a user to a private deck, the user being added must have previously logged onto the website using discord and then gone to the "Decks" page, at least once. After they have done that you can paste the full Discord ID username#number (Lyfesaver#1974, VRFlad#0001 or GoWMan#6611 for example) then their name will appear in the dropdown to select it.
Decks will continue to work after streaming has stopped if Streamer.bot is still running.
Each button can be styled with images, GIFs, background and text colors, icons as well as a drop down for selecting the action to associate with it. Arguments for the button can also be set.
Give the button a Name and choose an Action, at the minimum, to create a button.
Alternatively, you can send arguments with the packet back to the bot when the button is pressed.
Click on the image to set a PNG, JPG or GIF
Give the button a background color and/or change the color of the text used for the button name.
Icons can be set using the icon name from https://icones.js.org
Clcik the "Launch Deck" button in the top right to open a new tab with your URL for the deck. This can be opened on another PC, phone, tablet or even docked into your OBS. If access allowed by other users or it's public, copy and paste the URL to share.
The following arguments are sent with all button actions and will be available in your Streamer.bot instance as variables
Name | Description |
---|---|
streamerbotUserId |
Streamer.bot user ID |
streamerbotUserDiscordId |
The Discord user ID of the redeemer |
streamerbotUserUsername |
The Streamer.bot username of the redeemer e.g. DiscordUsername#0000 |
Any additional variables you have configured at the deck or button level will also be available in your Streamer.bot actions.