Comment ajouter une source Navigateur web dans OBS ?
Une fois le nom de ta chaîne tapé sur la page de configuration et Copier cliqué, suis ces étapes dans OBS Studio :
- Sélectionne la scène où le widget doit apparaître.
- Dans le dock Sources, clique sur + et choisis Navigateur web dans la liste.
- Donne un nom à la source, par exemple "Boîte de chat", et clique sur OK.
- Dans la fenêtre des propriétés qui s'ouvre, vide le champ URL et colle l'URL du widget que tu as copiée.
- Saisis les valeurs du tableau ci-dessous dans les champs Largeur et Hauteur.
- Clique sur OK et fais glisser la source où tu veux dans la scène.
La page de configuration de la Boîte de chat affiche ces étapes avec la taille recommandée quand tu copies l'URL. Si tu veux être sûr, ouvre d'abord l'URL dans un onglet normal du navigateur et vérifie qu'elle marche.
Quelle taille pour chaque widget ?
Chaque widget a une taille de source recommandée. Saisis ces valeurs dans les champs Largeur et Hauteur dans OBS.
| Widget | Largeur × Hauteur | Note |
|---|---|---|
| Boîte de chat | 400 × 600 | Une colonne de chat verticale. Une source plus grande affiche plus de messages, le texte garde la même taille. |
| Liste d'événements | 420 × 520 | Une colonne pour la liste. Les nouveaux événements glissent en haut ou en bas, et une source plus grande l'agrandit. |
| Mur d'emotes | 1920 × 1080 | Un canevas 1080p complet. Les emotes apparaissent n'importe où sur l'écran. |
| Combo d'emotes | 600 × 400 | De la place pour une grande emote et son compte, avec le meilleur combo en dessous. Elle reste vide tant que le chat ne lance pas de combo. |
| Sub Sprout | 800 × 600 | La plante et le pot poussent dans cette zone. |
| Overlay HUD IRL | 1920 × 1080 | Un canevas 1080p complet. L'argent et la mini-carte se placent chacun dans le coin que tu as choisi, et s'adaptent aussi à un canevas vertical. |
| Météo | 1920 × 1080 | Une zone 1080p complète. La météo se place dans le coin choisi et tient aussi sur une zone verticale. |
| Objectif de followers | 800 × 260 | Une bande large pour la barre d'objectif, avec de la place au-dessus pour que les +1 montent. |
| Objectif de Bits et Kicks | 800 × 260 | La même bande que l'Objectif de subs : la barre d'objectif, avec de la place au-dessus pour le montant de chaque cheer. |
| Top soutiens | 440 × 380 | Un petit panneau pour le classement, taillé pour un coin de ta scène. |
| Alertes de stream | 800 × 450 | Une alerte à la fois, au centre de cette zone. Une source plus grande l'agrandit. |
| Générique de fin | 1920 × 1080 | Un canevas 1080p complet. Le générique défile de bas en haut au centre quand tu passes sur la scène. |
| Réseaux sociaux | 600 × 120 | Un pseudo à la fois, au centre de cette bande. Le texte garde sa taille, donc un long pseudo demande une source plus large. |
| Compteur | 800 × 260 | Une bande large pour les compteurs côte à côte, avec de la place au-dessus pour que les +1 montent. 440x400 pour la disposition empilée. |
| Objectif de subs | 800 × 260 | Une bande large pour la barre d'objectif, avec de la place au-dessus pour que les +1 montent. |
| Compte à rebours de stream | 1920 × 1080 | Un canevas 1080p complet, pour que l'horloge tombe au centre de ta scène de début ou BRB. |
| Message mis en avant | 720 × 240 | Une large bande pour un message à la fois. Un long message rétrécit pour tenir, et une source plus grande l'agrandit. |
| En écoute | 640 × 160 | Une large bande pour la carte ou le bandeau d'une ligne. Une source plus grande l'agrandit. |
| Cadres de stream | 1920 × 1080 | 640x360 pour une caméra, 420x720 pour le chat, 1920x1080 pour l'écran. Le cadre s'adapte à la taille que tu lui donnes. |
| Bandeau | 1920 × 1080 | Un canevas 1080p complet. Le bandeau se place dans le coin que tu as choisi. |
| Liste de tâches | 480 × 720 | Un panneau tout en hauteur pour la liste. Quand elle s'allonge, elle défile toute seule. |
| Sondage du chat | 640 × 560 | De la place pour un sondage jusqu'à 6 options. Il se place en haut ou en bas et grandit avec les options. |
| File d'attente des viewers | 440 × 600 | Une colonne pour la file d'attente : qui joue en ce moment, qui passe ensuite et combien attendent. |
| Tirage au sort | 1920 × 1080 | L'overlay du gagnant. Des confettis jaillissent des deux côtés de l'écran et le nom du gagnant apparaît au centre. |
| Subathon Timer | 800 × 300 | Une bande large pour la barre de vie, l'horloge ou l'anneau. Une source plus grande l'agrandit. |
| OBS Bridge | Pas une source | Pas un overlay visible. Garde l'outil ouvert dans un onglet du navigateur ou un dock OBS. |
| Roue | 800 × 800 | La roue tourne sur !spin depuis le chat en 800×800. Le cooldown global se décompte à l’écran, alors garde de la place pour l’attente au-dessus de la roue. |
Pour agrandir le texte de la Boîte de chat, n'étire pas la source. Utilise le réglage Taille de police sur la page de configuration : de 8 à 72 pixels, 18 par défaut.
Faut-il faire quelque chose pour rendre le fond transparent ?
Non. Boîte de chat, Mur d'emotes, Sub Sprout, Subathon Timer, Alertes de stream, Objectif de subs, Cadres de stream, Compte à rebours de stream, Sondage du chat, Réseaux sociaux, l'overlay de la Roue et l'overlay du Tirage au sort sont dessinés sur un fond transparent. Pas besoin de chroma key ni de filtre, et tu peux laisser le champ CSS personnalisé d'OBS tel quel.
Si la Boîte de chat est difficile à lire sur une scène claire, active Fond sombre. Ça ajoute une couche noire semi-transparente derrière le widget, et tu peux régler son opacité de 0 % à 100 % (50 % par défaut). Si tu veux chaque message dans sa propre boîte, active Fond par message.
Faut-il activer "Désactiver la source quand elle n'est pas visible" et "Rafraîchir le navigateur lorsque la scène devient active" ?
Laisse les deux désactivés pour les widgets Senchabot. Les deux rechargent la page de zéro, et le widget oublie tout ce qu'il gardait jusque-là :
- Boîte de chat : les messages n'arrivent que pendant que la source tourne. Si la source se coupe puis revient, l'écran repart vide et n'affiche que les nouveaux messages.
- Sub Sprout : la plante est enregistrée dans OBS, donc un rechargement garde le stade qu'elle a atteint, mais les subs qui arrivent pendant que la source est coupée ne la font pas pousser.
- Objectif de subs : le compteur est enregistré dans OBS, donc un rechargement ne le perd pas, mais les subs qui arrivent pendant que la source est coupée ne sont pas comptés.
- Subathon Timer : le temps restant est enregistré dans OBS, donc un rechargement ne le perd pas. Le timer continue de décompter pendant que la source est coupée, mais il ne voit pas les subs qui arrivent pendant ce temps.
- Sondage du chat : le sondage et ses votes sont enregistrés dans OBS, donc un rechargement ne les perd pas, mais les votes tapés pendant que la source est coupée ne sont pas comptés.
- Alertes de stream : seuls les subs, cadeaux, cheers et raids qui arrivent pendant que la source tourne ont une alerte. Tout ce qui arrive pendant qu'elle est coupée est perdu.
- Overlay du Tirage au sort : seul l'overlay ouvert à ce moment-là reçoit le gagnant. Un gagnant tiré pendant que la source est coupée n'apparaît jamais à l'écran.
- Mur d'emotes : les emotes restent 5 secondes par défaut, donc un rafraîchissement ne te coûte rien, mais il n'aide pas non plus.
Si un widget bloque, double-clique sur la source et clique sur le bouton "Rafraîchir le cache de cette page" dans la fenêtre des propriétés. Ça recharge la page une fois.
Comment modifier un widget plus tard ?
Tes réglages sont dans l'URL du widget, donc changer un réglage veut dire une nouvelle URL. Change le réglage sur la page de configuration, copie la nouvelle URL, puis double-clique sur la source dans OBS et colle-la à la place de l'ancienne dans le champ URL.
Pas besoin de tout recommencer avec Boîte de chat, Mur d'emotes, Sub Sprout, Subathon Timer, Alertes de stream, Objectif de subs, Compteur, Liste d'événements, Générique de fin, File d'attente des viewers, Top soutiens, Bandeau, Liste de tâches, Combo d'emotes, Message mis en avant, Objectif de Bits et Kicks, En écoute, Sondage du chat, Cadres de stream, Réseaux sociaux, Compte à rebours de stream, Overlay HUD IRL, Météo ou Roue. Colle ton URL actuelle dans le champ URL du widget sur la page de configuration et tes chaînes et tous tes réglages reviennent. Change ce que tu veux et copie la nouvelle URL.
OBS Bridge n'a pas de champ pour coller une URL, donc saisis à nouveau tes réglages sur sa page de configuration et copie la nouvelle URL de l'outil. Tu peux aussi changer les choix de scènes et les utilisateurs autorisés directement sur la page de l'outil et récupérer la nouvelle URL avec son bouton Copier l'URL à jour. Les anciennes URL continuent de marcher, donc pas besoin de les mettre à jour.
Que faire si le widget n'apparaît pas dans OBS ?
La plupart du temps, c'est le nom de la chaîne qui pose problème. Fais ces vérifications dans l'ordre.
Ton URL de widget contient-elle un lien à la place du nom de la chaîne ?
L'URL ne doit contenir que le nom, comme twitch=senchabot. Les champs de chaîne de la page de configuration transforment un lien collé en nom, mais une URL plus ancienne, ou modifiée à la main, peut encore contenir le lien complet, et le widget ne peut alors se connecter à aucun chat. Crée une nouvelle URL sur la page de configuration.
La chaîne existe-t-elle vraiment ?
Vérifie qu'il n'y a pas de faute dans le nom. Une chaîne qui n'existe pas sur Twitch ne renvoie pas d'erreur. Le widget reste juste vide.
Il s'est déjà passé quelque chose dans le chat ?
La Boîte de chat et le Mur d'emotes restent complètement vides et transparents tant qu'il ne se passe rien dans le chat. Envoie un message dans le chat ; pour le Mur d'emotes, il doit par défaut être fait uniquement d'emotes, mais avec Toutes les emotes activé, les emotes dans les messages normaux comptent aussi. L'overlay du Tirage au sort n'apparaît lui aussi que quand un gagnant est tiré, et disparaît après 10 secondes. Sub Sprout et le Subathon Timer, eux, s'affichent tout de suite.
Chaîne Kick introuvable ?
Quand le widget s'ouvre, il cherche la chaîne Kick sur kick.com. Si cette recherche échoue (mauvais nom, chaîne inexistante, ou Kick qui ne répond pas), les messages Kick n'arrivent pas. Tape ton nom Kick exactement comme il apparaît dans l'URL kick.com. Certains liens Kick écrivent le _ d'un nom avec un - : le champ Chaîne Kick de la page de configuration vérifie sur kick.com et passe à cette orthographe pour toi.
L'URL marche-t-elle dans un navigateur ?
Ouvre l'URL dans un onglet normal du navigateur. Si elle marche là mais pas dans OBS, vérifie le champ URL et la taille de la source.