دليل
المظهر
تغطي هذه الصفحة تبويب Appearance، حيث يقوم المسؤول بتنسيق شكل ويدجت المحادثة وموضعه ونصوصه الافتراضية. وهي موجّهة للمسؤولين الذين يضبطون الويدجت ليتناسب مع هوية موقعهم.
انتقل إلى Addons → AI Copilot Suite → Appearance. تضم قائمة Sections الجانبية ثلاثة عناصر: Themes وTheme Studio وSettings.
أعلى الصفحة، زر Open live preview on your site يفتح منطقة العميل مع فتح الويدجت تلقائياً للتحقق من النتيجة خارج معاينة لوحة الإدارة.
الثيمات (Themes) —1.2.0
"اختر التصميم الأساسي للويدجت. كل ثيم يتكيّف تلقائياً مع الوضع الفاتح أو الداكن لدى الزائر (بما في ذلك مفتاح الوضع الداكن في ثيم Lagom). لتصميم مخصّص بالكامل استخدم Theme Studio بعد اختيار الأساس."
يعرض قسم Themes شبكة من البطاقات، كل بطاقة تحوي معاينة مصغّرة شبه حيّة واسماً. اضغط على بطاقة لاختيار ذلك الثيم، ثم اضغط Save.
| الثيم | الشكل |
|---|---|
| Classic | التصميم الأصلي — شريط ومُطلِق بلون أساسي، لوحة بيضاء. الافتراضي للتثبيتات الحالية. |
| Servlayer | ثيم العلامة: لوحة فاتحة نهاراً؛ كحلي داكن مع تدرّج نيلي→تركوازي وظل متعدد الطبقات وتوهج نابض ليلاً. |
| Lagom | نظيف واحترافي يطابق لوحة الإدارة: أزرق مميز، خطوط رفيعة، بطاقات 10px. |
| macOS | نافذة macOS أصلية: أزرار المرور، شريط عنوان مركّز، تأثير Liquid Glass، حركة فتح نابضة. |
| Minimal | حلقة متدرّجة على المُطلِق، شريط علوي متدرّج، لوحة مسطّحة مع حقل وزر دائريين. |
أمثلة من منطقة العميل:
| الثيم | فاتح | داكن |
|---|---|---|
| Classic |  |
 |
| macOS |  |
 |
| Minimal |  |
 |
Tip
يحدّد الثيم الأساسي هيكل الواجهة. للألوان المزدوجة (فاتح/ليلي)، والظل، والتدرّج، وضبط Liquid Glass، أنشئ ثيماً مخصّصاً في Theme Studio وفعّله.
Note
تعمل الثيمات مع ويدجت منطقة العميل ومع التضمين الخارجي. الثيم المخصّص النشط من Theme Studio يُطبَّق على المسارين. دعم RTL متوفر في كل الثيمات.
Theme Studio1.2.0
يتيح Theme Studio بناء ثيمات مخصّصة وحفظها وتفعيلها وتكرارها وحذفها فوق ثيم أساسي. تُحدَّث معاينة الـiframe فوراً. بدّل شريط المعاينة بين وضع التحرير الفاتح والداكن لحفظ لوحتي ألوان منفصلتين.
| عنصر التحكم | الغرض |
|---|---|
| اسم الثيم | يظهر في قائمة الثيمات المحفوظة |
| الثيم الأساسي | هيكل البداية (classic / servlayer / lagom / macos / minimal) |
| لوحة الألوان | أساسي، نص، نص رسالة المستخدم، خلفية، canvas، مكتوم، خطوط — حسب الوضع قيد التحرير |
| نمط اللون | صلب أو متدرّج (بداية/نهاية) لفقاعات المستخدم والمُطلِق والعناوين المتوافقة |
| انحناء الزوايا | 0–28 بكسل |
| قوة الظل | 0–100% |
| المُطلِق | الشكل (دائري / مستدير / حبة / مربع) والحجم |
| Liquid Glass (أساس macOS فقط) | صبغة، شفافية، ضبابية، تشبع، توهج الحدود — قيم منفصلة للفاتح والداكن |
| خلفية المعاينة | فاتح / داكن / تدرّج / نمط مزدحم خلف المعاينة (للتحرير فقط، لا يُحفظ في الثيم) |
تظهر الثيمات المحفوظة في قائمة مع Activate وEdit وDuplicate وDelete. التفعيل يضبط widget_custom_theme_id ويطبّق رموز الثيم على الموقع الحي حتى التعطيل.
Tip
بعد تفعيل ثيم مخصّص استخدم Open live preview on your site للتأكد من Liquid Glass واللوحتين على قالب الموقع الحقيقي.
Settings
هنا تُضبط الموضع وال نصوص الترحيب والأيقونات وCustom CSS وروابط التكامل.
| الاسم الودّي | النوع | الافتراضي |
|---|---|---|
| Position | قائمة اختيار — مثل "Bottom right" | Bottom right |
| Primary color | منتقي ألوان | — |
| Panel max scale (%) | رقم (100–150) | 120 |
| Horizontal offset (px) | رقم | 22 |
| Vertical offset (px) | رقم | 22 |
| عنوان النافذة (إنجليزي / عربي) | نص | فارغ |
| نص الحقل البديل (إنجليزي / عربي) | نص | فارغ |
| رسالة الترحيب (إنجليزي / عربي) | نص | فارغ |
Custom CSS (ضمن #srv-aichatbot) |
منطقة نص | فارغ |
| أيقونات الإرسال / الإغلاق / الكتابة / المُطلِق | نص + رفع ملف | فارغ |
| محدّد CSS للمُطلِق المخصّص | نص، مثل #srvlivehelpdesk |
فارغ |
| فتح تلقائي عبر hash | نص | #srv-aichat |
رفع الأيقونات يقبل PNG أو JPG أو GIF أو WEBP فقط (حد أقصى 512 كيلوبايت). SVG غير مسموح (رفع أو رابط) لتجنب XSS. مؤشر الكتابة يمكن أن يكون GIF متحرّكاً؛ اتركه فارغاً للنقاط الافتراضية.
Tip
يُعقَّم Custom CSS قبل الحفظ والإخراج. فضّل Theme Studio للألوان والهيكل؛ استخدم Custom CSS لتعديلات بصرية صغيرة فقط.
محدّد CSS للمُطلِق المخصّص
إذا كان موقعك يحتوي زر "دردشة حية" موجوداً، عيّن محدّده هنا لفتح ويدجت SRV AI Chatbot بدل إضافة فقاعة عائمة ثانية.
فتح تلقائي عبر URL hash
بالقيمة الافتراضية #srv-aichat، زيارة رابط ينتهي بهذا الـhash تفتح الويدجت تلقائياً.
المظهر لكل مساعد
ملاحظة للقراءة فقط: يمكن لكل مساعد تجاوز الاسم والأيقونة ورسالة الترحيب من نموذج المساعدين — انظر إضافة مساعد.
الإجراء
اضغط Save في Themes أو Settings لحفظ تلك النماذج. أوامر الحفظ/التفعيل/التكرار/الحذف في Theme Studio لها أزرارها الخاصة في لوحته.
استكشاف الأخطاء
| المشكلة | الحل |
|---|---|
| الويدجت يتداخل مع عناصر عائمة أخرى | اضبط Horizontal / Vertical offset في Settings |
| الثيم المخصّص لا يظهر في الموقع | تأكد أنه مفعّل في Theme Studio ثم حدّث صفحة العميل بقوة |
| Custom CSS بلا أثر | استهدف أصنافاً تحت #srv-aichatbot؛ المعقّم يزيل @import والتعابير والقواعد غير المقيّدة |
| زر الدردشة الموجود لا يفعل شيئاً | عيّن Custom launcher CSS selector لمحدّد ذلك الزر |
| اللوحة الداكنة خاطئة لثيم macOS مخصّص | حرّر الثيم في وضع المعاينة الداكن وأعِد الحفظ (الثيمات القديمة قد تفتقد رموز الزجاج الليلي) |