Chaînes et overlays distincts - Social Stream Ninja

Séparer le chat par plateforme en 4 étapes

Exemple : une superposition affiche uniquement Twitch, une autre uniquement YouTube. Vous lisez toujours tout dans un seul Dock.

Ajoutez tous vos chats à Social Stream Ninja. Vérifiez qu'un nouveau message de chacun apparaît dans votre Dock de chat du direct (Streaming Chat Dock). Gardez ce Dock sans filtre. C'est votre vue personnelle.
Copiez votre lien généré de dock.html deux fois. La copie conserve la session, le mot de passe, la version et les réglages du serveur.
Ajoutez un filtre à la fin de chaque copie, comme &onlyfrom=twitch&hidemenu (voir le tableau ci-dessous).
Ajoutez chaque lien dans OBS comme une Source navigateur. Donnez-leur des noms clairs, comme Chat Twitch et Chat YouTube.

Conservez chaque superposition dans sa propre source de navigateur OBS. — Chaque superposition a sa propre source navigateur.

Capture Twitch + YouTube
Une session SSN Votre Dock reçoit les deux
Vues OBS Twitch uniquement et YouTube uniquement

Un seul flux peut alimenter plusieurs vues filtrées.

Options de filtre pour les superpositions de chat

Je veux afficher…	Ajouter au lien du Dock
Twitch uniquement	`&onlyfrom=twitch&hidemenu`
YouTube uniquement	`&onlyfrom=youtube&hidemenu`
Twitch et YouTube ensemble	`&onlyfrom=twitch,youtube&hidemenu`
Tout sauf Discord	`&hidefrom=discord&hidemenu`

Un exemple complet :

https://socialstream.ninja/dock.html?session=YOUR_SESSION_ID&onlyfrom=twitch&hidemenu

Utilisez onlyfrom et hidefrom ici. Les options d'autres superpositions, comme onlytype, peuvent ne pas fonctionner sur cette page. YouTube Shorts possède son propre type : ajoutez youtubeshorts si votre capture le signale. Consultez Types de sources.

Séparer Featured Chat (messages sélectionnés)

Copiez votre lien généré de featured.html deux fois.
Ajouter &onlyfrom=twitch à l'un et &onlyfrom=youtube à l'autre.
Gardez votre Dock ouvert pour choisir les messages.

Featured Chat accepte une plateforme par lien. La liste séparée par des virgules (twitch,youtube) fonctionne uniquement dans le Dock.

Le filtre décide seulement quels messages sélectionnés une page accepte. Il ne crée pas de files séparées. Un message refusé n'efface pas non plus l'écran. Au changement de segment, effacez vous-même le message en avant pour ne pas laisser l'ancien affiché.

Deux chaînes sur la même plateforme

onlyfrom=twitch désigne tout Twitch, pas une seule chaîne Twitch. Les noms de chaîne et titres de diffusion ne peuvent pas servir de noms de filtre.

Je souhaite…	Procédez ainsi
Afficher la chaîne d'origine de chaque message	Ajouter `&showchannelname` (fonctionne si la source transmet un nom de chaîne).
Faire deux émissions entièrement séparées	Utilisez des instances ou profils de capture séparés, chacun avec sa propre session et uniquement ses propres sources.
Filtrer le Dock par onglet du navigateur	`&filtertid=123` (avancé, voir ci-dessous).

Une superposition avec une autre session mais sans capture correspondante restera vide. Le paramètre label nomme la page pour le routage ; ce n'est pas un filtre de chaîne.

Comment filtertid fonctionne

Il prend l'identifiant numérique de l'onglet d'origine du message. Séparez plusieurs identifiants par des virgules.
Trouvez le tid dans les données d'un vrai message capturé. Consultez la Référence des événements et Commandes et API.
Ce n'est pas un identifiant de chaîne de la plateforme.
Les identifiants d'onglet peuvent changer à la réouverture d'une source. Les sources sans identifiant correspondant peuvent être masquées.
Il fonctionne uniquement dans le Dock, pas comme filtre de chaîne dans Featured Chat.

Tester chaque vue

Envoyez un message fictif Twitch et un message fictif YouTube dans une session de test. Utilisez Créer des messages de test.
Vérifiez que les deux apparaissent dans votre Dock et que chaque superposition de chat affiche uniquement sa plateforme.
Mettez chaque message en avant, puis effacez-le. Vérifiez chaque page de messages en avant après avoir changé de plateforme.
Répétez avec un vrai message de chaque source. Les messages fictifs n'ont pas de vrais identifiants d'onglet.

Problème	À essayer
Une vue est vide	Retirez le filtre un instant. Si le chat réapparaît, vérifiez le type exact de source ou l'identifiant d'onglet.
Toujours vide sans le filtre	Voir dépannage des sessions et du routage.
Renommer la source OBS n'a rien changé	Renommer ne change pas le lien enregistré. Modifiez l'URL elle-même.

Chat et alertes dans un onglet du navigateur

Combiner les incrustations empile vos liens de superposition dans un onglet ou une source navigateur OBS. Pratique pour lire le chat sur votre téléphone pendant un direct IRL.

Collez le lien de votre Dock de chat du direct (Streaming Chat Dock) dans le calque du bas.
Collez le lien de votre Boîte d'alertes multistream dans le calque du haut. Gardez les liens complets, avec session, mot de passe et options de connexion.
Laissez Fond SSN transparent coché.
Activez Autoriser les appuis et le défilement sur ce calque pour le chat. Désactivez-les pour les alertes afin qu'elles ne bloquent pas le chat.
Appuyez sur Aperçu, puis Afficher le code QR et scannez-le avec votre téléphone. Ou appuyez sur Copier le lien combiné pour le coller dans une source navigateur.

La vue combinée n'a pas de commandes de configuration. Elle affiche uniquement vos superpositions.

Options du calque

Je souhaite…	Procédez ainsi
Ajouter des superpositions	Jusqu'à huit liens.
Placer un calque devant ou derrière	Utilisez les boutons fléchés.
Redimensionner ou déplacer un calque	Ouvrir Taille et position. Réglez largeur, hauteur, gauche et haut en pixels (`450`) ou en pourcentage (`100%`).
Remettre un calque en plein écran	Rétablir le plein écran. Une largeur et une hauteur vides remplissent le navigateur ; gauche et haut vides partent du coin supérieur gauche.
Créer une colonne de chat à gauche (1920×1080)	Calque du chat : largeur `450`, hauteur `1080`, gauche `0`, haut `0`. Les autres calques restent en plein écran.
Modifier un lien combiné plus tard	Utilisez le lien modifiable ou ajoutez `?edit=1` avant le `#`.
Recommencer	Effacer la configuration enregistrée.

Les dimensions en pixels restent fixes lors du redimensionnement du navigateur. Les pourcentages s'adaptent. Chaque superposition conserve son contenu et ses réglages.

Enregistrement, téléphones et confidentialité

Vos liens et options de calque sont enregistrés automatiquement dans ce navigateur, même inachevés. La navigation privée peut ne pas les conserver.
Le lien combiné et le code QR contiennent toute la disposition. Configurez-la sur ordinateur, scannez une fois, puis ajoutez-la aux favoris du téléphone. L'ouverture enregistre aussi la configuration dans le navigateur du téléphone.
Les modifications sur ordinateur ne mettent pas à jour un ancien lien. Copiez ou scannez le nouveau lien après modification. Rien ne se synchronise via l'identifiant de session.
Gardez les liens combinés et codes QR aussi privés que vos liens de superposition.
La capture SSN doit rester active et le téléphone doit pouvoir joindre les mêmes serveurs que les liens originaux. localhost ou 127.0.0.1 désigne le téléphone lui-même.
Les liens très longs peuvent ne pas tenir dans un code QR. Vous pouvez toujours copier le lien.

Exemple OBS : colonne de chat à gauche avec effets plein écran

Aucun CSS nécessaire. Chaque calque a sa propre zone. Réglez la source navigateur OBS sur 1920×1080. Ajoutez d'abord les calques du bas et saisissez uniquement des nombres (sans virgules ni « px ») dans Taille et position.

Couche	Largeur	Hauteur	Gauche	Haut
1. Chat en direct / Dock	450	1000	0	80
2. Compteur Hype	450	80	0	0
3. Mur d'émojis / émoticônes	1920	1080	0	0
4. Chat mis en avant (Featured Chat)	1470	1080	450	0
5. NinjaBacker (facultatif)	1920	1080	0	0

Les 80 pixels du haut contiennent Hype, avec la colonne de chat en dessous. Vous voulez le chat sur toute la hauteur derrière Hype ? Réglez la hauteur de Live Chat sur 1080 et le haut sur 0. D'autres tailles de scène nécessitent d'autres valeurs.

Collez les liens complets de vos superpositions. Copiez-les depuis vos sources navigateur existantes pour conserver session, mot de passe, styles et réglages de connexion. Laissez Fond SSN transparent coché. Les recadrages, transformations, filtres et CSS personnalisé d'OBS ne sont pas dans le lien et ne sont pas repris.
Centrez Hype dans la colonne. Dans le lien de hype.html , utilisez &align=center. Remplacez tout align=left ou align=right, et retirez alignright. Pour un rendu compact, essayez &combineall&hidetitle&style=compact&scale=0.75 (remplacez les valeurs existantes). Augmentez la hauteur du calque Hype si votre style demande plus d'espace.
Gardez Featured Chat à côté de la colonne de chat. Définissez Gauche = 450 et Largeur = 1470 ensemble (450 + 1470 = 1920). Déplacer à droite un calque de 1920 pixels de large couperait son bord. Ajoutez &center à featured.html pour centrer les messages courts dans cette zone. Pour centrer sur toute la scène, utilisez Gauche 0, Largeur 1920 et &center.
Placez NinjaBacker en dernier (facultatif). Collez son lien de superposition pour spectateurs comme calque supérieur, avec son animation d'entrée par la droite. Le combinateur définit la zone et l'ordre ; NinjaBacker définit son animation. Le fond doit être transparent et le site doit autoriser l'intégration. Ce calque ne faisait pas partie de l'exemple testé.
Prévisualisez à 1920 × 1080. Envoyez un message avec des emojis, mettez un message en avant depuis votre Dock et activez les données Hype dans SSN. Le chat normal ne choisit pas tout seul un message à mettre en avant.
Copiez le nouveau lien combiné dans OBS. Réglez cette source navigateur sur largeur 1920, hauteur 1080. La taille de l'aperçu ne règle pas cela. Ajustez-la à votre scène sans recadrage. Après chaque modification, recopiez le lien ; l'ancien conserve l'ancienne disposition.

Sortie combinée testée : Hype centré au-dessus d'une étroite colonne de chat à gauche, émojis sur toute la scène et message mis en avant en bas, à droite du chat. — Test réel dans Chromium avec quatre superpositions SSN et un flux de test. L'image est transparente ; le fond sombre est ajouté ici pour la lisibilité. Cliquez pour l'afficher en taille réelle. Vos polices et couleurs proviennent des réglages de vos superpositions.

Performances : une seule source navigateur exécute toujours toutes les superpositions qu'elle contient. Moins de sources OBS ne garantit pas moins de processeur ou de mémoire. Fermez l'aperçu une fois terminé et comparez OBS avec les anciennes sources désactivées. Les performances sur Mac M1 et votre lien NinjaBacker n'ont pas été testés. Vous pouvez garder Live Chat séparé et combiner seulement le reste.

Si une couche est vide ou recouvre le chat

Problème	À essayer
Un calque est vide	Ouvrez d'abord son lien original seul. Les alertes restent vides jusqu'à l'arrivée d'un événement. La combinaison ne capture rien de nouveau.
Un calque a un fond opaque	La transparence automatique fonctionne pour `dock.html`, `featured.html`, `multi-alerts.html`, et `minecraft.html`. Les autres pages nécessitent leur propre réglage de transparence. Certains sites externes bloquent l'intégration.
Impossible d'appuyer sur le chat ou de le faire défiler	Un calque transparent peut quand même bloquer les appuis. Désactivez Autoriser les appuis et le défilement sur les calques au-dessus du chat qui n'en ont pas besoin.
Aucun son sur le téléphone	Les téléphones peuvent nécessiter un appui avant de lire du son. Autorisez les appuis sur ce calque et touchez-le. Testez sur le téléphone réel avant de vous y fier.

Plusieurs chaînes et incrustations distinctes