Articles /Pin to ProfileBookmark

How to: LIVE Stream on WebDeveloper.com with Twitch

Sep 6, 2022  •  @themolitor  •  4,225
Copy linkTweet this

Level up your WebDeveloper.com profile page (+unlock a new badge) by displaying your Twitch live stream with full chat and the ability to let WD viewers send you tips with SATS.

Connect Twitch Channel

Visit your WD profile settings to access the Connect Twitch Channel button at the bottom of the page…

Authorize Access

Clicking connect will send you over to twitch.tv to authorize the request to connect your channel…

Clicking “authorize” will allow WebDeveloper.com to save your channel ID to your profile and access the Twitch API in order to display your live stream from your WD profile page.

Success

After authorizing the request, you’ll be redirected to your profile settings page and should see something like this…

  • Refresh: this is handy if you make changes to your twitch.tv channel (e.g. change the channel name, etc) and need to update your WD profile with the new info.
  • Disconnect: this will remove all your twitch.tv data that we save to your profile (e.g. channel ID and API tokens), but does NOT disconnect from your twitch.tv profile. To do that, you’ll also need to visit twitch.tv/settings/connections

Download Twitch Studio

Twitch Studio is a one-stop-shop for managing your live stream. You can easily control which cameras are being used, manage the location of your chat notifications, display your desktop view and even create separate scenes for different uses.

Download Twitch Studio here: twitch.tv/broadcast/studio

Start LIVE Stream

As soon as you’re ready, all you have to do is hit that “Start Stream” button in Twitch Studio and you’ll be LIVE.

Your twitch.tv channel will begin broadcasting your stream and your WebDeveloper.com profile will display a “LIVE” notice next to your avatar…

Going LIVE unlocks badge!

Watch LIVE Steam

When visitors click your “LIVE avatar” they’ll see a pop-up of your stream with the ability to chat and send you SATS via the tips bar below the video player…

That’s not all…

In addition to showcasing “LIVE” profiles on the home page and other category pages, we’re also planning on adding more features to the twitch.tv platform to better integrate your WD profile.

We’re also hoping you’ll have some suggestions and feedback for us to make this feature ever better. 🤘

Front-endTechnical Writing
×

Success!

Help @themolitor spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with Github
about: ({
version: 0.1.6 BETA 11.29,
whats_new: article editor v2,
up_next: tip code demos,
coming_soon: embeddable tipping,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.6,
notes: article editor refresh

version: 0.1.5,
notes: added pins + new badge

version: 0.1.4,
notes: home refresh + tools

version: 0.1.3,
notes: added reference + demos
)...
recent_tips: (
tipper: @dert,
amount: 1000 SATS,
source: article

tipper: Anonymous,
amount: 1000 SATS,
source: article

tipper: @Loverboylove,
amount: 500 SATS,
source: article
)...