
瀏覽 完整疊加畫面視覺圖庫,或在下方探索自訂範本及匯入功能。
為直播找到合適的範本
三個瀏覽器來源使用統一外觀。在圖庫中選擇 使用配套組合,輸入工作階段資訊,然後複製 OBS 連結。動畫為選用。








完整主題套裝,包含文件、範例圖片及指南
精緻的全動畫主題,支援自訂顏色及平滑轉場。非常適合遊戲直播。
懷舊的 Windows 3.1 風格聊天疊加畫面,帶有經典視窗設計及像素級細節。
整潔現代的設計,動畫流暢,易於閱讀。可自訂配色。
只需工作階段 ID 即可使用的現成範本
整潔輕量、具備基本功能的範本。適合作為自訂的起點。
優雅設計,動畫流暢並帶有視覺效果。醒目而不分散注意力。
為遊戲直播設計的醒目高對比主題,即使內容節奏很快也清晰可見。
時尚的液態玻璃風格聊天疊加畫面,動畫流暢,表情算繪酷炫。
支援 YouTube CSS 樣式的範本
在採用 YouTube 結構的疊加畫面頁面上使用為 YouTube 設計的 CSS。相容 Septapus 樣式。
建立自訂疊加畫面的起點
用最少程式碼從頭建立自己的疊加畫面。適合開發者及 LLM 輔助程式設計。
更完整的起始範本,附帶註解和文件,協助你建立自己的自訂疊加畫面。
第一次匯入? 閱讀完整聊天外觀指南 ,了解小工具檔案尋找、支援的格式、OBS 設定及疑難排解。
同時適用於 SSN Windows 桌面應用程式和 Chrome 擴充功能,不需編輯程式碼。
在 SSN 應用程式或擴充功能中開啟平台來源,然後傳送測試訊息。確認訊息出現在 SSN 停駐面板後再繼續。
使用小工具設計者提供的 ZIP、資料夾或檔案。有效匯出通常包含 HTML、CSS、JavaScript、fields/data 及資源。截圖或 StreamElements 疊加畫面 URL 不足夠。
從 SSN 彈出選單開啟匯入器時,會自動填入工作階段 ID 和密碼。若直接開啟,請從以下位置複製: 工作階段選項 ,在應用程式或擴充功能中尋找。只需在匯入器中輸入工作階段 ID 一次,它會儲存在下載的檔案內。
若匯入的小工具提供相容設定,使用 訊息歷史 以關閉定時移除,或變更畫面上保留的訊息數量。這會變更小工具設定,不會變更程式碼。
示範預覽 透過範例訊息檢查設計。 即時預覽 使用正在執行的 SSN 應用程式或擴充功能中的真實聊天檢查工作階段。
點選 下載 OBS HTML。在 OBS 中新增瀏覽器來源,啟用 本機檔案,並選取下載的 HTML 檔案。 不要在 OBS 中加入工作階段 ID 或編輯 URL。 直播時保持 SSN 執行;匯入器與 StreamElements 可以關閉。
檢查匯入器辨識出的檔案;若選錯 HTML、CSS 或 JavaScript,請使用 Advanced file selection。
確認聊天到達 SSN 停駐面板,且工作階段 ID 和選用密碼完全一致。
使用下載的 HTML 檔案,而非匯入器頁面、原始 ZIP 或 StreamElements URL,然後重新整理 OBS 瀏覽器來源。
依照這些簡單步驟開始
瀏覽範本庫,選擇適合直播風格的範本。使用截圖圖庫比較設計;大多數內建範本可直接透過 URL 使用,不需下載。
替換 YOURSESSIONID ,在範本 URL 中替換為實際的 Social Stream Ninja 工作階段 ID,可在 SSN 應用程式或擴充功能的 Session Options 下找到。若工作階段使用密碼,也請包含選用密碼。
https://socialstream.ninja/themes/pretty.html?session=YOURSESSIONID
將修改後的 URL 作為瀏覽器來源加入直播軟體:
透過以下任一方式使用自訂 CSS 個人化疊加畫面:
&css=URL_TO_YOUR_CSS_FILE 至範本 URL&b64css=YOUR_BASE64_ENCODED_CSS從可用疊加畫面開始,再修改外觀。
使用 OBS 瀏覽器來源 自訂 CSS ,以調整顏色、間距和排版。保留原始 SSN URL 和連線。
有 StreamElements 聊天小工具匯出檔案? 開啟 StreamElements 轉換器,預覽後下載 OBS HTML。請使用原始 ZIP 或檔案,而非截圖或疊加畫面 URL。 查看下方設定.
對於以觸發器為基礎的行為,從以下內容開始: Event Flow 編輯器 和 警示效果規則 ,然後再撰寫新疊加畫面。
選擇起點,複製提示詞,並替換方括號中的設計細節。如果 AI 無法讀取連結,請附上來源檔案。不要在對話中提供私密工作階段 ID 和密碼。
正在轉換更複雜的小工具? 使用完整的 StreamElements / Streamlabs 轉換提示詞.
了解如何在 AI 協助下建立自訂聊天疊加畫面