Twitch Status

1. 

   The stream status tag when online and offline.

2. 

   The stream status widget when online.

3. 

   The stream status widget when offline.

4. 

   Embedded video player with chat, with French localization.

I want to add a widget for my channel but there is no way to set my channel name

You must first add your channel in the plugin’s settings page. Then, you will be able to select your channel in the widget’s settings.

I want to add a stream status tag on my “Twitch” tab. How do I find the matching jQuery selector?

You can find the jQuery selector by using the browser developers tools (right click / inspect on element) to get the id and/or classes of the element. If you have an id, just prepend the # symbol to it and you have it. For example, if your element has ID menu-item-582, the jQuery selector would be #menu-item-582. If the menu element has a link inside it (a element), add the a element in the selector #menu-item-582 a.

If your element doesn’t have an id but a class, use the class instead. The matching selector would have a . instead of a # (ie .menu-item-582 a).

Fore more information about jQuery selectors, check out http://api.jquery.com/category/selectors/

I added the right shortcode to embed my channel’s player but all I see is a grey block

Check if you have correctly added your channel name in the settings page before.

Can I show and hide some parts of my page accordingly to my channel status?

Yes! There are 3 CSS classes twitch-is-online, twitch-is-offline and twitch-is-loading to be used in conjunction with the data-twitch-channel HTML attribute with your channel name data-twitch-channel="CHANNEL_NAME" (where CHANNEL_NAME is the name of your channel) to achieve this.

Please be aware that the channel must be added on the settings page.

For example, if your channel name is “nolife”:

Nolife is <span data-twitch-channel="nolife"><span class="twitch-is-online">online to kick ass and chew bubble gum!</span><span class="twitch-is-offline">offline. Eighters gonna 8.</span><span class="twitch-is-loading">...</span></span>

1.5.1

• Fixed metadata

1.5.0

• Updated for the new Twitch Helix API
• Minor bugfixes and improvements

1.4.2

• Chat now fits screen size when viewing embedded player + chat combo on a mobile screen.
• Fixed options page bugs

1.4.0.

• Now using HTML5 data to update elements (CSS classes are still supported for backward compatibility)
• Added shortcode [twitch-status] for status tag
• Added shortcode [twitch-player] for embedded player
• Added shortcode [twitch-chat] for embedded chatbox
• Properly rewrote some parts of code

1.3.0

• Optimized loading time of the tags and the widgets.
• Widget links are now active all the time, even when the channel is offline.
• Fixed widget links to Twitch channels.
• Improved documentation.

1.2.2

• Fixed calls to Twitch.tv API.

1.2.1

• Added CSS classes twitch-is-online, twitch-is-offline and twitch-is-loading to be used in conjunction with twitch-status-channel-CHANNEL_NAME to enable/disable some elements of the page accordingly to the channel status.
• Fixed widget size issues

1.2

• Added multiple channel support

1.1

• Added stream status widget

1.0

• First release