معرض القوالب

تصفح معرض التراكبات المرئي الكامل، أو استكشف القوالب المخصصة والاستيراد أدناه.

اختر مظهرًا لبثك

عاين تراكبات الدردشة والرسائل المميزة والتنبيهات، ثم أضف ما تفضله إلى OBS أو Streamlabs.

🧭 اختيار نوع التراكب

💬 دردشة مجمعة

موجز متتابع من المنصات المتصلة. ابدأ بقالب دردشة أو لوحة الإرساء.

⭐ رسالة مميزة

رسالة واحدة تختارها في لوحة الإرساء. اختر تصميم رسائل مميزة للمقابلات أو الأسئلة والأجوبة أو التحيات.

🎉 تنبيهات الأحداث

احتفل بالمتابعات والعضويات والتبرعات. هيّئ الحركات والصوت في إعدادات تنبيهات SSN. دليل التنبيهات

مكتبة القوالب

اعثر على القالب المثالي لبثك

🎨 حزم مظاهر متناسقة

مظهر واحد عبر ثلاثة مصادر متصفح. في المعرض، اختر استخدام مجموعة متناسقة، وأدخل تفاصيل جلستك، ثم انسخ الروابط إلى OBS. الحركة اختيارية.

قطة ثلاثية الألوان ناعسة وحليب فراولة وأدوات مكتبية وردية

🐱 قطة الفراولة

قطة ثلاثية الألوان ناعسة وحليب فراولة وأدوات مكتبية وردية. يتضمن أنماطًا متناسقة للدردشة والرسالة المميزة والتنبيهات.

معاينة الحزمة واستخدامها
كلب كورغي مرح على بطاقة بريدية بلون أزرق سماوي

🐶 رفقة طيبة

كلب كورغي مرح على بطاقة بريدية زرقاء سماوية. يتضمن أنماطًا متناسقة للدردشة والرسالة المميزة والتنبيهات.

معاينة الحزمة واستخدامها
ضفدع من القصص المصورة في غابة هادئة

🍄 طحالب وفطر

ضفدع من القصص المصورة في غابة هادئة. يتضمن أنماطًا متناسقة للدردشة والرسالة المميزة والتنبيهات.

معاينة الحزمة واستخدامها
أرنب رائد فضاء يطفو بين غبار نجمي أرجواني فاتح

🌙 أرنب القمر

أرنب رائد فضاء يطفو بين غبار نجمي أرجواني فاتح. يتضمن أنماطًا متناسقة للدردشة والرسالة المميزة والتنبيهات.

معاينة الحزمة واستخدامها
تنين صغير مع بلورة مسحورة مضيئة

🐉 حارس البلورة

تنين صغير مع بلورة مسحورة مضيئة. يتضمن أنماطًا متناسقة للدردشة والرسالة المميزة والتنبيهات.

معاينة الحزمة واستخدامها
راكون بسماعات رأس وأسطوانة فينيل بألوان النعناع والبرقوق

🎵 شريط منتصف الليل

راكون بسماعات رأس وأسطوانة فينيل بألوان النعناع والبرقوق. يتضمن أنماطًا متناسقة للدردشة والرسالة المميزة والتنبيهات.

معاينة الحزمة واستخدامها
شبح ودود ويقطينة متوهجة ولون برقوقي ليلي

🎃 اليقطين المسكون

شبح ودود ويقطينة متوهجة ولون برقوقي ليلي. يتضمن أنماطًا متناسقة للدردشة والرسالة المميزة والتنبيهات.

معاينة الحزمة واستخدامها
رنّة يلتف بوشاح وخضرة احتفالية

🎄 الرنّة الصغير المرح

رنّة يلتف بوشاح وخضرة احتفالية. يتضمن أنماطًا متناسقة للدردشة والرسالة المميزة والتنبيهات.

معاينة الحزمة واستخدامها

حزم ذات طابع خاص

حزم كاملة ذات طابع خاص مع توثيق وصور نموذجية وأدلة

مظهر Deuk
حزمة كاملة

مظهر Deuk

مظهر متقن ومتحرك بالكامل بألوان قابلة للتخصيص وانتقالات سلسة. مثالي لبث الألعاب.

جديد
مظهر Windows 3.1
أسلوب قديم

مظهر Windows 3.1

تراكب دردشة بأسلوب Windows 3.1 يبعث الحنين، مع تصميم نوافذ كلاسيكي وتفاصيل دقيقة بالبكسل.

مظهر Neutron
تصميم حديث

مظهر Neutron

تصميم مرتب وحديث بحركات سلسة ووضوح قراءة ممتاز. مجموعات ألوان قابلة للتخصيص.

قوالب بسيطة جاهزة للإدراج

قوالب جاهزة للاستخدام لا تتطلب سوى معرّف جلستك

قالب نموذجي
ضئيل

قالب نموذجي

قالب مرتب وخفيف بالميزات الأساسية. نقطة بداية مثالية للتخصيص.

قالب جميل
متحرك

قالب جميل

تصميم أنيق بحركات سلسة ومؤثرات مرئية. يجذب النظر دون تشتيت.

مظهر t3nk3y
الألعاب

مظهر t3nk3y

مظهر جريء عالي التباين مصمم لبث الألعاب، مع وضوح ممتاز حتى في المحتوى السريع.

مظهر الزجاج السائل من LuckyLootTube
زجاج سائل

مظهر LuckyLootTube

تراكب دردشة أنيق ومتحرك بأسلوب الزجاج السائل مع حركات سلسة وعرض جذاب للرموز التعبيرية.

قوالب متوافقة مع CSS لـYouTube

قوالب تعمل مع أنماط CSS الخاصة بـYouTube

قالب CSS لـYouTube
متوافق مع YouTube

قالب CSS لـYouTube

استخدم CSS المصمم لـYouTube مع صفحة تراكبنا ذات بنية YouTube. متوافق مع أنماط Septapus.

قوالب المطورين

نقاط بداية لإنشاء تراكباتك المخصصة

قالب مجرد
المطور

قالب مجرد

الحد الأدنى من الشفرة اللازمة لإنشاء تراكبك من الصفر. مثالي للمطورين والبرمجة بمساعدة LLM.

نموذج تراكب
المطور

نموذج قالب تراكب

نقطة بداية أشمل تتضمن تعليقات وتوثيقًا لمساعدتك في بناء تراكباتك المخصصة.

لديك قالب للمشاركة؟

أنشأت قالبًا رائعًا لـSocial Stream Ninja؟ شاركه مع المجتمع بإرسال طلب سحب إلى مستودعنا على GitHub.

الإرسال على GitHub

استخدام أداة دردشة StreamElements مع Social Stream Ninja

جديد على الاستيراد؟ قراءة دليل مظهر الدردشة الكامل للعثور على ملفات الأدوات والتنسيقات المدعومة وإعداد OBS وحل المشكلات.

يعمل هذا مع تطبيق SSN لسطح مكتب Windows وإضافة Chrome — دون الحاجة إلى تعديل الشفرة.

التأكد من أن SSN يستقبل الدردشة

افتح مصادر منصاتك في تطبيق SSN أو الإضافة، ثم أرسل رسالة اختبار. تابع فقط بعد ظهورها في لوحة إرساء SSN.

الحصول على تصدير الأداة الأصلي

استخدم ZIP أو المجلد أو الملفات التي يقدمها مصمم الأداة. يتضمن التصدير المفيد عادةً HTML وCSS وJavaScript والحقول والبيانات والأصول. لا تكفي لقطة شاشة أو رابط تراكب StreamElements.

فتح أداة الاستيراد

افتح أداة الاستيراد واختر ZIP أو المجلد أو الملفات. تكتشف أجزاء الأداة وتعرض معاينة تجريبية فورًا.

فتح أداة استيراد الأدوات

إضافة معرّف جلسة SSN

يؤدي فتح أداة الاستيراد من نافذة SSN المنبثقة إلى ملء معرّف الجلسة وكلمة المرور تلقائيًا. إذا فتحتها مباشرة، فانسخهما من خيارات الجلسة (Session Options) في التطبيق أو الإضافة. تدخل معرّف الجلسة مرة واحدة في أداة الاستيراد؛ ويُحفظ داخل الملف المُنزَّل.

اختيار سجل الرسائل

إذا وفرت الأداة المستوردة إعدادات متوافقة، فاستخدم سجل الرسائل (Message history) لإيقاف الإزالة المؤقتة أو تغيير عدد الرسائل التي تبقى على الشاشة. يغيّر هذا إعدادات الأداة، لا شفرتها.

الاختبار قبل التنزيل

معاينة تجريبية (Demo Preview) تفحص التصميم برسائل نموذجية. معاينة مباشرة (Live Preview) تفحص الجلسة باستخدام دردشة حقيقية من تطبيق SSN أو الإضافة قيد التشغيل.

التنزيل والإضافة إلى OBS

انقر على تنزيل HTML لـOBS ‏(Download OBS HTML). في OBS، أضف مصدر متصفح وفعّل ملف محلي، وحدد ملف HTML المُنزَّل. لا تضف معرّف الجلسة ولا تعدّل الرابط في OBS. أبقِ SSN قيد التشغيل أثناء البث؛ ويمكن إغلاق أداة الاستيراد وStreamElements.

المعاينة التجريبية فارغة

راجع الملفات المكتشفة في أداة الاستيراد واستخدم Advanced file selection إذا اختارت HTML أو CSS أو JavaScript خاطئًا.

المعاينة المباشرة فارغة

تأكد من وصول الدردشة إلى لوحة إرساء SSN ومن تطابق معرّف الجلسة وكلمة المرور الاختيارية تمامًا.

OBS فارغ

استخدم ملف HTML المُنزَّل — وليس صفحة الاستيراد أو ZIP الأصلي أو رابط StreamElements — ثم حدّث مصدر المتصفح في OBS.

كيفية استخدام القوالب

اتبع هذه الخطوات البسيطة للبدء

اختيار قالبك

تصفح مكتبة القوالب واختر ما يناسب أسلوب بثك. استخدم معرض لقطات الشاشة لمقارنة التصاميم؛ تعمل معظم القوالب المدمجة مباشرة عبر رابط دون تنزيل.

إضافة معرّف جلستك

استبدل YOURSESSIONID في رابط القالب بمعرّف جلستك الفعلي في Social Stream Ninja الموجود ضمن Session Options في تطبيق SSN أو الإضافة. أدرج كلمة المرور الاختيارية إذا كانت جلستك تستخدمها.

https://socialstream.ninja/themes/pretty.html?session=YOURSESSIONID

الإضافة إلى OBS/Streamlabs

أضف الرابط المعدّل كمصدر متصفح في برنامج البث:

  1. في OBS، انقر + تحت Sources واختر «Browser»
  2. سمِّ مصدرك وانقر OK
  3. الصق رابط قالبك مع معرّف الجلسة
  4. اضبط العرض والارتفاع (الموصى به: 1920×1080)
  5. انقر OK لإضافته إلى مشهدك

تخصيص قالبك

خصص تراكبك بـCSS مخصص بإحدى هذه الطرق:

  • CSS المخصص في OBS: أضف CSS في خصائص مصدر المتصفح
  • معامل URL: ألحق &css=URL_TO_YOUR_CSS_FILE إلى رابط قالبك
  • CSS بترميز Base64: لـCSS المضمّن، استخدم &b64css=YOUR_BASE64_ENCODED_CSS

🛠️ اصنع قالبك الخاص

ابدأ بتراكب يعمل، ثم غيّر مظهره.

🎨 تغيير المظهر

استخدام مصدر متصفح OBS CSS مخصص للألوان والمسافات والخطوط. احتفظ برابط SSN الأصلي والاتصال.

📦 إحضار أداة

لديك تصدير أداة دردشة من StreamElements؟ فتح محوّل StreamElements، وعاينه، ثم نزّل HTML لـOBS. استخدم ملف ZIP أو الملفات الأصلية، وليس لقطة شاشة أو رابط تراكب. راجع الإعداد أدناه.

🧩 تغيير السلوك

انسخ نموذج بداية يعمل وعدّل HTML وCSS وJavaScript الخاصة به. البدء السريع · دليل المطور · حقول الأحداث

🔧 الملفات والتوجيه والاختبار
  1. استخدم sampleoverlay.html للدردشة المجمعة، و featured-modern.html للرسائل المحددة، أو multi-alerts.html للأحداث. نزّل المصدر والأصول المطلوبة من مستودع beta.
  2. احتفظ بشفرة الاتصال الأصلية. تستقبل تراكبات الدردشة والرسائل المميزة موجزين مختلفين؛ وتنسيق موجز دردشة لا يجعله تراكبًا لرسالة محددة.
  3. احتفظ بالبرامج المشتركة والخطوط والصور المُشار إليها بجوار ملفك بالمسارات النسبية نفسها، أو اطلب من مساعد الذكاء الاصطناعي تصديرًا مكتفيًا بذاته. إعادة تسمية ملف HTML واحد لا تجمع اعتمادياته.
  4. استضف ملفاتك واستخدم رابطها مع جلستك وكلمة المرور الاختيارية. لتصدير محلي مكتفٍ بذاته، اتبع تعليمات تهيئته؛ لا يحتوي خيار Local file في OBS على حقل URL لمعاملات الجلسة.
  5. عاين البيانات الوهمية أولًا، ثم اختبر بجلستك الخاصة في SSN. تحقق من الرسائل المحددة والمسح والأسماء الطويلة والصور والخلفيات الشفافة. أبقِ SSN قيد التشغيل أثناء الاستخدام المباشر.

للسلوك القائم على المحفزات، ابدأ بـ محرر Event Flow و قواعد مؤثرات التنبيهات قبل كتابة تراكب جديد.

✨ نسخ توجيه لمساعدك بالذكاء الاصطناعي

اختر نقطة بداية وانسخ التوجيه واستبدل تفاصيل التصميم بين الأقواس. أرفق ملفات المصدر إذا لم يستطع مساعد الذكاء الاصطناعي قراءة الروابط. أبقِ معرّف الجلسة الخاص وكلمة المرور خارج المحادثة.

💬 دردشة مجمعة
⭐ رسالة مميزة
🎉 تنبيهات مع صوت
🎨 تجديد المظهر بـCSS فقط

تحوّل أداة أكثر تعقيدًا؟ استخدام توجيه تحويل StreamElements / Streamlabs الكامل.

شرح بالفيديو

تعلّم كيفية إنشاء تراكب دردشة مخصص بمساعدة الذكاء الاصطناعي

دليل سريع من الفيديو

  1. ابحث عن نموذج قالب التراكب (sampleoverlay.html)
  2. نسخ شفرة القالب إلى الحافظة
  3. استخدم مساعد ذكاء اصطناعي مثل Claude للمساعدة في تخصيصه
  4. اطلب من الذكاء الاصطناعي تعديل CSS لأسلوبك المفضل
  5. هيّئ OBS لاستخدام قالبك المخصص
  6. طبّق CSS المخصص عبر إعدادات مصدر المتصفح في OBS