Plusieurs chaînes et incrustations distinctes

1. Réunir la capture dans une session

Ajoutez les sources de chat souhaitées dans SSN et vérifiez qu'un nouveau message de chacune atteint le même Dock de chat du direct (Streaming Chat Dock) non filtré. Gardez ce Dock comme vue opérateur.

Copiez les liens générés afin de préserver leurs paramètres de session, mot de passe, version et serveur. Ajoutez chaque vue du public comme source navigateur OBS distincte. Donnez aux sources OBS des noms descriptifs tels que Chat Twitch et Chat YouTube.

2. Séparer le chat défilant par plateforme

Pour le chat défilant, faites deux copies de votre URL générée dock.html . Ajoutez ces options aux copies correspondantes :

Par exemple, avec une connexion par défaut :

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

Utilisez onlyfrom et hidefrom pour ces pages. Ne supposez pas qu'une option telle que onlytype provenant d'une autre incrustation fonctionne ici. Utilisez youtubeshorts séparément lorsque la capture signale ce type. Voir Types de sources.

3. Séparer les messages sélectionnés

Pour les messages sélectionnés plutôt que le chat défilant, dupliquez votre lien généré featured.html et ajoutez &onlyfrom=twitch à une copie et &onlyfrom=youtube à l'autre. Gardez le Dock opérateur ouvert pour sélectionner les messages.

Le paramètre actuel Featured Chat onlyfrom accepte un seul type de source. L'exemple du Dock avec valeurs séparées par des virgules ci-dessus ne doit pas être copié dans ce champ de Featured Chat.

4. Deux chaînes sur la même plateforme

onlyfrom=twitch sélectionne Twitch comme plateforme, pas une chaîne Twitch précise. Les noms de chaînes et titres de directs sont des métadonnées, pas des noms de filtres URL interchangeables. Ajoutez &showchannelname pour afficher les noms de chaînes lorsqu'ils sont fournis par la source.

Pour le filtrage avancé du Dock, &filtertid=123 accepte l'identifiant numérique de l'onglet d'origine ; plusieurs identifiants séparés par des virgules sont pris en charge. Inspectez de vraies données capturées pour obtenir leur tid (voir Référence des événements et Commandes et API). N'utilisez pas ici un identifiant de chaîne de plateforme. Les identifiants d'onglets peuvent changer à la réouverture des sources, et les sources sans identifiant correspondant peuvent être exclues. C'est une option du Dock, pas un filtre général de chaîne Featured Chat.

Pour des productions entièrement indépendantes, utilisez des instances/profils de capture distincts avec des sessions différentes et ouvrez seulement les sources prévues pour chaque production. Donner une autre session à une incrustation sans capture correspondante la laisse inactive. Le champ d'une incrustation label identifie une page pour le routage ; ce n'est pas un filtre de chaîne.

5. Vérifier chaque vue du public

1. Envoyez un message de test Twitch fictif et un message de test YouTube fictif dans une session isolée avec Créer des messages de test.
2. Vérifiez que les deux apparaissent dans le Dock opérateur et que chaque incrustation défilante affiche uniquement sa source prévue.
3. Mettez chaque message en avant et testez le bouton d'effacement. Vérifiez toutes les pages de mise en avant visibles après un changement de plateforme.
4. Répétez avec un vrai message de chacune de vos sources connectées, car les messages synthétiques ne peuvent pas déterminer les véritables identifiants d'onglets des sources.

Si une vue est vide, retirez temporairement son filtre. Si le chat revient, vérifiez le type exact de source ou l'identifiant d'onglet. S'il reste vide, utilisez le dépannage des sessions et du routage. Changer le nom d'une source OBS ne met pas à jour son URL enregistrée.

6. Chat et alertes dans un seul onglet

Utilisez Combiner les incrustations pour superposer des URL d'incrustations existantes dans un seul onglet ou une seule source navigateur OBS. C'est utile pour lire le chat sur un téléphone pendant un direct IRL.

1. Collez votre URL générée Streaming Chat Dock dans la couche inférieure et votre URL Multi-Stream Alert Box dans la couche supérieure. Conservez la session, le mot de passe et les options de connexion dans les deux liens.
2. Laissez Fond SSN transparent coché. Activez « Autoriser les appuis et le défilement sur ce calque » pour le chat et désactivez cette option pour les alertes afin qu’elles ne bloquent pas l’interaction avec le chat.
3. Sélectionnez Aperçu, puis Afficher le code QR et scannez-le avec l'appareil photo de votre téléphone. Ou sélectionnez Copier le lien combiné pour coller le résultat dans une source navigateur. La vue combinée n'a pas de commandes de configuration.

Vous pouvez ajouter jusqu'à huit URL et utiliser les flèches pour déplacer une couche derrière ou devant une autre. Les couches remplissent le navigateur par défaut. Développez Taille et position sur une couche pour définir sa largeur, sa hauteur et ses décalages gauche et haut en pixels (par exemple, 450) ou en pourcentages (par exemple, 100%). Des largeur et hauteur vides remplissent le navigateur ; des décalages vides démarrent en haut à gauche. Rétablir le plein écran efface le placement de cette couche. Chaque incrustation conserve son propre contenu et ses paramètres.

Pour une colonne de chat à gauche sur une source navigateur OBS de 1920 × 1080, réglez la largeur de la couche de chat sur 450, la hauteur sur 1080, la gauche sur 0, et le haut sur 0. Les autres couches peuvent rester en plein écran. Pour placer Hype au-dessus du chat et Featured Chat décalé à droite, utilisez la recette de disposition OBS ci-dessous. Les tailles en pixels restent fixes quand le navigateur change de taille ; les pourcentages suivent sa largeur ou sa hauteur.

Utilisez le lien modifiable pour rouvrir la configuration avec vos URL et positions remplies. Pour modifier un lien combiné plus tard, ajoutez ?edit=1 avant son #.

Vos liens et options de couches sont enregistrés automatiquement dans ce navigateur, y compris les configurations inachevées. Rouvrez Combiner les incrustations pour continuer les modifications, ou sélectionnez Effacer la configuration enregistrée pour recommencer. Le stockage du navigateur peut être indisponible ou temporaire en navigation privée.

Le lien combiné et le code QR contiennent la disposition complète et les URL. Configurez sur ordinateur, scannez une fois sur mobile, puis enregistrez la vue combinée en favori. L'ouvrir enregistre aussi cette configuration dans le navigateur du téléphone. Les modifications sur ordinateur ne mettent pas automatiquement à jour un ancien lien : copiez ou scannez le nouveau lien après modification. Cette fonction ne synchronise pas les paramètres via votre identifiant de session.

Gardez les liens combinés et les codes QR aussi privés que les liens individuels d'incrustation. La capture SSN doit toujours fonctionner et le téléphone doit pouvoir atteindre les serveurs utilisés par les URL d'origine. Une adresse localhost ou 127.0.0.1 désigne l'appareil qui ouvre le lien. Les URL très longues peuvent dépasser la capacité des codes QR ; le lien combiné reste copiable.

Recette OBS : une colonne de chat à gauche avec des effets plein écran

Cette disposition ne nécessite pas de CSS. Chaque couche possède sa propre zone de navigateur. Réglez la source navigateur OBS globale sur 1920×1080, puis utilisez ces valeurs dans la section de chaque couche Taille et position. Saisissez seulement les nombres, sans virgule ni « px ». Ajoutez les couches dans cet ordre, en commençant par celle du bas :

Les 80 premiers pixels sont réservés à Hype, laissant une colonne de chat de 450 pixels de large dessous. Pour que le chat occupe toute la hauteur derrière Hype, réglez la hauteur de Live Chat sur 1080 et le haut sur 0. Les autres tailles de scène nécessitent d'autres valeurs en pixels.

1. Collez vos URL d'incrustation complètes. Copiez-les depuis les propriétés de vos sources navigateur existantes en conservant la session, le mot de passe, les styles et les paramètres de connexion. Laissez Fond SSN transparent coché. Le recadrage, les transformations, les filtres OBS et son champ Custom CSS ne font pas partie de l'URL et ne sont pas transférés.
2. Centrer Hype dans la colonne. Sur l’URL de hype.html , définissez align=center (remplacez une valeur existante de align=left ou align=right, et retirez alignright si présente). Avec une URL contenant déjà ?session=..., ajoutez &align=center. Un style compact de départ facultatif est &combineall&hidetitle&style=compact&scale=0.75; remplacez les valeurs existantes plutôt que de les dupliquer. Augmentez la hauteur de la couche Hype si le style choisi nécessite plus de place.
3. Garder Featured Chat à l'écart de la colonne de chat. Définissez Left = 450 et Width = 1470 ensemble: 450 + 1470 = 1920. Déplacer une couche de 1920 pixels de large de 450 pixels vers la droite couperait son bord droit. Featured Chat place toujours son message près du bas de sa propre zone. Pour centrer les messages courts dans cette zone, ajoutez &center à son featured.html URL. Pour centrer les messages sur toute la scène, utilisez plutôt Left = 0, Width = 1920 et &center.
4. Garder NinjaBacker au-dessus de Featured Chat. Collez son URL d'incrustation publique comme dernière couche, avec son paramètre existant d'animation d'entrée par la droite. Le combinateur contrôle sa zone et l'ordre des couches ; l'incrustation NinjaBacker contrôle son animation et son placement interne. Son fond doit être transparent et son site doit autoriser l'intégration. Cette couche facultative ne faisait pas partie du test d'exemple à quatre incrustations.
5. Prévisualisez à 1920 × 1080. Envoyez un message de test contenant des émojis, mettez un message en avant depuis votre Dock et activez les données Hype dans SSN. Le chat ordinaire seul ne sélectionne pas de message Featured Chat. Vérifiez chaque incrustation séparément si elle reste vide.
6. Copiez le nouveau lien combiné dans OBS. Réglez la largeur de cette source navigateur sur 1920 et sa hauteur sur 1080. La taille de l'aperçu du combinateur ne définit pas les dimensions OBS. Adaptez la nouvelle source à votre scène sans recadrage. Après chaque modification de disposition, recopiez le nouveau lien combiné ; un ancien lien OBS conservera son ancienne disposition.

Performances : une seule source navigateur exécute toujours chaque incrustation intégrée et ses connexions. La combinaison réduit le nombre de sources OBS mais ne garantit pas une moindre utilisation du processeur ou de la mémoire. Fermez l'aperçu navigateur une fois terminé et comparez les performances OBS avec les anciennes sources désactivées. Les performances macOS/OBS sur M1 et votre URL NinjaBacker précise restent à vérifier sur votre installation. Vous pouvez garder Live Chat séparé et combiner seulement les autres incrustations si cela fonctionne mieux.

Si une couche est vide ou recouvre le chat

• Ouvrez d'abord chaque URL d'origine séparément. Les alertes restent normalement vides jusqu'à l'arrivée d'un événement ; combiner des pages ne capture pas de nouveaux événements.
• La transparence automatique prend en charge dock.html, featured.html, multi-alerts.html, et minecraft.html. Les autres pages nécessitent leurs propres paramètres de fond transparent. Certains sites externes bloquent entièrement l'intégration.
• Une couche transparente peut quand même bloquer les appuis. Désactivez Autoriser les appuis et le défilement sur toute couche au-dessus du chat qui n'a pas besoin d'interaction.
• Les navigateurs mobiles peuvent exiger une interaction avec la page avant de lire du son. Si nécessaire, activez l'interaction de cette couche et appuyez dessus ; les restrictions de lecture automatique du navigateur restent applicables. Vérifiez l'audio sur le téléphone réel avant de vous y fier.