Connecter une source navigateur OBS : de l’ajout de l’URL au réglage du son

La source navigateur est la fonction la plus courante pour connecter des widgets et des overlays à OBS Studio. En collant l’URL fournie par un service, vous pouvez afficher sur votre stream des éléments web comme des alertes de donation, un chat ou un objectif.

La première configuration peut prêter à confusion : où coller l’URL, quelles dimensions choisir et le public entendra-t-il le son ? Si l’image ou l’audio manque, il faut également distinguer un problème d’URL d’un réglage audio d’OBS.

Ce guide présente tout le processus : ajouter une source navigateur, régler son URL et ses dimensions, puis configurer le monitoring audio. L’exemple utilise une alerte de message DORODORA, mais les mêmes étapes fonctionnent avec tout chat ou widget de stream fourni sous forme d’URL.

Ouvrir la console de stream DORODORA

Ce qu’il vous faut

Préparez ces trois éléments :

• Un compte DORODORA et une page de donation
• La dernière version d’OBS Studio
• Une scène réservée au test de l’alerte

Vous pouvez modifier directement une scène de diffusion, mais une scène de test vide est plus sûre. Vérifiez-y la taille, la position et le volume TTS, puis réutilisez la source terminée dans vos scènes habituelles sans modifier leur disposition.

La configuration en bref

1. Activez les messages et le TTS dans la console DORODORA.
2. Copiez la Source navigateur (URL).
3. Ajoutez une source navigateur à une scène OBS.
4. Saisissez l’URL et les dimensions.
5. Envoyez une alerte de test et contrôlez l’image et le son.
6. Ajustez le monitoring audio et le volume si nécessaire.

Une fois la connexion enregistrée dans OBS, il n’est plus nécessaire de recoller l’URL avant chaque stream.

1. Copier l’URL de l’alerte depuis DORODORA

Ouvrez la console de stream DORODORA. Dans les réglages à droite, dépliez Message (TTS).

Vérifiez les options suivantes :

• Activer : active les alertes de messages.
• Activer le TTS : lit les messages de donation à voix haute.
• Activer les voix personnalisées : permet aux donateurs de choisir une voix personnalisée.

Après toute modification, cliquez sur Enregistrer pour l’appliquer.

Cliquez sur le champ Source navigateur (URL) pour copier l’adresse. Elle est différente de la page de donation partagée avec le public : il s’agit d’une adresse de widget réservée à OBS.

Ne montrez jamais l’URL de la source navigateur dans un stream, une vidéo ou une publication. Masquez-la aussi entièrement dans vos captures.

2. Ajouter une source navigateur dans OBS

Ouvrez OBS Studio et sélectionnez la scène qui doit afficher l’alerte. Dans le panneau Sources, cliquez sur +, puis choisissez Navigateur ou Browser selon la langue de l’interface.

Cliquez sur + sous le panneau Sources. Source de l’image : OBS Sources Guide

Choisissez Browser dans la liste. Source de l’image : OBS Sources Guide

Donnez à la source un nom facile à reconnaître, par exemple :

Alerte de donation DORODORA

Si la même source existe déjà dans une autre scène, réutilisez-la avec Ajouter existante. Une source commune est plus simple à gérer que plusieurs copies indépendantes.

3. Régler l’URL et les dimensions

Dans les propriétés, collez l’URL DORODORA dans URL. Laissez Fichier local désactivé.

Le plus simple est d’utiliser les dimensions du canevas de base. Pour un stream en 1080p :

Largeur : 1920
Hauteur : 1080

Pour du 720p, utilisez 1280 × 720. La valeur exacte se trouve dans Paramètres → Vidéo → Résolution de base (canevas).

Saisissez l’URL, la largeur et la hauteur. Source de l’image : OBS Browser Source

Option	Réglage de départ	Raison
Fréquence d’images personnalisée	Désactivée	Les 30 FPS par défaut suffisent pour le premier test.
CSS personnalisé	Valeur par défaut	Conserve le fond transparent et supprime les marges.
Arrêter la source lorsqu’elle n’est pas visible	Désactivé	Évite de déconnecter le widget lors d’un changement de scène.
Actualiser lorsque la scène devient active	Désactivé	Évite de recharger une alerte en cours.

D’après la documentation d’OBS, l’option d’arrêt décharge la page lorsque la source est masquée ou que vous quittez la scène. L’option d’actualisation recharge la page au retour. Une alerte en temps réel doit généralement rester connectée : commencez donc avec ces deux options désactivées.

Si Contrôler l’audio via OBS est disponible, activez-le. Le TTS apparaîtra séparément dans le mélangeur audio, avec son propre volume, mode muet et monitoring.

Cliquez ensuite sur OK.

4. Placer et dimensionner l’alerte

Sélectionnez la source pour afficher un cadre rouge dans l’aperçu OBS. Faites-le glisser pour modifier sa taille ou sa position.

Si vous avez utilisé les dimensions du canevas complet, ajustez la source à l’écran :

• Windows : clic droit, puis Transformer → Ajuster à l’écran.
• macOS : clic droit, puis Transformer → Ajuster à l’écran.
• Raccourci : Ctrl+F sous Windows ou Cmd+F sous macOS.

Si le widget définit déjà la position de l’alerte, ne recadrez pas la source. Le canevas complet limite les risques de couper une animation.

Placez la source navigateur au-dessus du jeu ou du fond dans la liste Sources. Les éléments les plus hauts sont affichés devant ; une alerte située sous la capture du jeu peut fonctionner tout en restant invisible.

5. Envoyer une alerte de test

Dans Message (TTS) de la console DORODORA, cliquez sur Tester l’alerte. Il n’est pas nécessaire d’attendre une vraie donation.

Avant le test, vérifiez que :

• OBS est lancé.
• L’icône en forme d’œil de la source est active.
• L’URL DORODORA a été collée entièrement.
• Activer et Activer le TTS ont été enregistrés.

Si l’alerte apparaît dans l’aperçu OBS et que le TTS est lu, la connexion de base est terminée.

6. Régler le volume TTS et le monitoring

Si l’alerte est visible mais silencieuse, observez d’abord le Mélangeur audio pendant un test.

Le vumètre bouge

Le son arrive bien dans OBS. Vérifiez que :

1. La source n’est pas coupée.
2. Son curseur de volume n’est pas trop bas.
3. La piste utilisée par le stream est cochée dans les Propriétés audio avancées.
4. Le Monitoring audio est réglé sur Monitoring et sortie si vous voulez aussi entendre le son.

Avec Monitoring désactivé, le public peut toujours entendre la source. Le monitoring détermine surtout si le streamer l’entend dans son casque. À l’inverse, Monitoring uniquement (sortie coupée) peut retirer le son de la diffusion. Pour le streamer et le public, utilisez généralement Monitoring et sortie.

Contrôlez le vumètre, le curseur, le mode muet et le monitoring. Source de l’image : OBS Audio Mixer Guide

Le vumètre ne bouge pas

1. Rouvrez les propriétés de la source navigateur.
2. Activez Contrôler l’audio via OBS si l’option existe.
3. Vérifiez qu’il s’agit bien de l’URL des alertes de messages.
4. Cliquez sur Actualiser le cache de la page actuelle.
5. Envoyez une nouvelle alerte de test.

L’actualisation peut interrompre une alerte en cours. Faites-la pendant les tests, pas en direct.

Si l’alerte ne s’affiche pas

La source est derrière un autre élément

Placez l’alerte DORODORA au-dessus de la capture du jeu, des images et des sources de couleur. Vérifiez aussi son icône en forme d’œil.

L’URL n’est pas la bonne

La page de donation et la source navigateur ont des rôles différents. OBS doit recevoir la Source navigateur (URL) affichée dans Message (TTS). Vérifiez les espaces et assurez-vous d’avoir copié l’adresse complète.

Les réglages n’ont pas été enregistrés

Après avoir activé les options, cliquez sur Enregistrer. Changer uniquement les interrupteurs puis quitter la page peut conserver l’ancien réglage.

L’alerte est jouée hors écran

Faites un clic droit sur la source, choisissez Transformer → Réinitialiser la transformation, puis Transformer → Ajuster à l’écran. Vérifiez aussi que ses dimensions correspondent au canevas.

Les alertes cessent après un changement de scène

Désactivez Arrêter la source lorsqu’elle n’est pas visible. Pour plusieurs scènes, réutilisez la source avec Ajouter existante.

Toujours vérifier avec un enregistrement

L’aperçu et votre casque ne garantissent pas que la sortie du stream est correcte. Enregistrez une ou deux minutes avant le direct, puis relisez le fichier.

Vérifiez que :

• L’alerte n’est pas cachée par le jeu ou la webcam.
• Le nom et le message sont lisibles.
• Le TTS n’est ni trop fort ni trop faible face au micro.
• Le jeu ne couvre pas l’alerte et le TTS.
• Le début et la fin du TTS ne sont pas coupés.
• L’alerte fonctionne encore après un changement de scène.

Le guide audio officiel d’OBS recommande également un enregistrement dans les conditions habituelles avant le direct. Le fichier final est plus fiable que les seuls vumètres.

Questions fréquentes

Puis-je partager l’URL de la source navigateur ?

Non. Partagez la page de donation DORODORA avec le public. L’URL du widget doit rester dans OBS et ne pas apparaître publiquement.

Quelle résolution utiliser ?

Commencez avec celle du canevas OBS : 1920×1080 pour un canevas 1080p ou 1280×720 pour un canevas 720p.

Si j’entends le TTS, le public l’entend-il aussi ?

Choisissez Monitoring et sortie lorsque les deux doivent l’entendre, puis confirmez avec un enregistrement de test.

Puis-je couper le TTS tout en gardant l’alerte visuelle ?

Oui. Dans Message (TTS), laissez l’alerte activée, désactivez seulement le TTS et enregistrez.

Puis-je recevoir des donations sans lancer OBS ?

Les paiements de la page de donation sont indépendants d’OBS. Sans OBS et sa source connectée, l’alerte ne s’affichera simplement pas en direct. Les événements restent consultables dans la console DORODORA.

Pour terminer

Les trois points essentiels sont la bonne URL, l’ordre des sources et la sortie audio. Activez les messages et le TTS dans DORODORA, copiez l’URL dédiée et collez-la dans une source navigateur OBS.

Envoyez ensuite une alerte de test, contrôlez le mélangeur et réalisez un enregistrement. Le son entendu par le streamer et celui envoyé au public peuvent différer selon le monitoring.

DORODORA réunit une page de donation, l’AI TTS, le Voice Cloning TTS, une URL d’alerte OBS et une console de stream. Configurez les alertes de messages pour transformer une simple notification de paiement en contenu de stream.

Configurer les alertes DORODORA

Références

• OBS Browser Source: https://obsproject.com/kb/browser-source
• OBS Sources Guide: https://obsproject.com/kb/sources-guide
• OBS Audio Mixer Guide: https://obsproject.com/kb/audio-mixer-guide