تخصيص الودجت وربطها (Custom Widget Integration)

نظرة عامة (Overview)

تتيح لوحة تخصيص أداة الدردشة (Widget Customization) للفرق تعديل التكوينات المرئية والسلوكية لأدوات الدردشة المواجهة للعميل. تظهر تغييرات مساحة العمل في الوقت الفعلي على شاشة معاينة تفاعلية، مما يضمن التزامن المرئي قبل النشر في بيئة العمل الفعلية.

تفصيل التكوين المرئي (Visual Configuration Breakdown)

1. عناصر تحكم المظهر (Appearance Controls)

• اختيار النمط (Pick a Style): يعدل معلمات وضع الواجهة الأساسية بين المتغيرات الداكنة (Dark) (الافتراضي للنظام) و الفاتحة (Light).
• تعيين الشعار (Logo Mapping): مكون تبديل نشط يتيح إدخال نصوص لقبول مسارات أصول العلامة التجارية المخصصة (CDN) تحت معلمة المفتاح رابط الشعار (Logo url).
• محرك ألوان المظهر (Theme Color Engine): يحدد ألوان العلامة التجارية للإجراءات الأساسية. تشمل الألوان الافتراضية الأخضر (Green)، الأزرق (Blue)، الأرجواني (Purple)، البرتقالي (Orange)، الأحمر (Red)، ومجموعة ألوان قوس قزح (Rainbow) التكيفية.
• تجاوزات الألوان المتقدمة (Advanced Color Overrides): يتيح لك تبديل معلمات الإعدادات المتقدمة تحديد رموز الألوان السداسية (Hex) لعناصر واجهة محددة:
  • الخلفية (Background): قيم ألوان لوحة الغلاف الأساسية.
  • فقاعة العميل والنص (Customer Bubble & Text): لون التعبئة وعناصر التباين المطبعي لمكونات رسالة العميل.
  • فقاعة الوكيل والنص (Agent Bubble & Text): أصول التصميم التي تطابق حاويات الطباعة لاستجابة الوكيل المعالج.
  • تلميح الودجت (Tooltip): ألوان التمييز لتنبيهات المساعدة النصية الإضافية.
  • التعليقات التوضيحية (Captions): ملصقات ألوان البيانات الثانوية والطوابع الزمنية المصغرة.

2. الطباعة ورؤوس النصوص (Typography & Text Headers)

• تكوينات الرأس (Header Configurations): يتحكم في إدخالات النص المعينة لخصائص متعددة اللغات لعناوين رأس الودجت (مثل Welcome to Ark) وتعريفات الترحيب الأساسية (مثل We’re here to help. Ask anything). يتضمن مشغلات تخصيص اللغة المسماة إضافة لغة جديدة + (Add new language +) جنبًا إلى جنب مع أيقونات سلة المهملات لحذف مخططات اللغات الزائدة.
• الأنماط الهيكلية للرأس (Header Structural Patterns): يطبق تجريدات هندسية للخلفية على كتل رأس الودجت، بما في ذلك النقاط (Dots)، أو الموجات (Waves)، أو الخطوط (Lines).

3. النماذج الآلية ومعالجات التوجيه (Automated Forms & Routing Handlers)

• مصفوفة رسائل الترحيب (Greeting Messaging Matrix): تعين قيم ترحيب محددة لأهداف واضحة لرمز اللغة، مما يوفر إمكانية التوسع من خلال أوامر صريحة لـ إضافة رسالة جديدة (Add new message).
• نماذج الالتقاط قبل المحادثة (Pre-Chat Capture Forms): مكون تبديل منطقي يقوم بتمكين أو تعطيل نماذج جمع البيانات الإلزامية قبل منح إذن الدخول إلى المحادثة.
• معلمات التوجيه دون اتصال (Offline Routing Parameters): مفتاح تشغيلي يقوم بتمكين الرسائل الآلية عند عدم الاتصال بالإنترنت عندما تصل طلبات العملاء الواردة خارج الجداول الزمنية التشغيلية النشطة.

4. تخطيط الواجهة ومتغيرات إمكانية الوصول (Layout & Accessibility Variables)

• موضع محاذاة الودجت (Widget Alignment Position): يحدد معلمات تعيين محاذاة الحافة، مما يسمح للأداة بالارتساء إما في الأرباع السفلية اليمنى (Right) أو اليسرى (Left) من العرض.
• الحدود البعدية (Dimensional Bounds): يضبط خصائص مساحة العمل الهيكلية الإجمالية التي تحدد معلمات الارتفاع والعرض.
• أوزان حجم الخط (Font Sizing Weights): يحدد عوامل قياس البكسل القياسية عبر أنظمة الطباعة داخل نافذة أداة العميل.

محاكاة المعاينة في الوقت الفعلي (Real-Time Preview Simulation)

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

• البدء (Get started): عرض الدخول القياسي.
• الرئيسية (Home): عرض اختيار الاتصال الأساسي.
• قبل المحادثة (Pre chat): وضع عرض نموذج التحقق والبيانات المطلوبة.
• غير متصل (Offline): عرض تكوين الحالة الاحتياطية (عند عدم الاتصال).
• متصل (Online): تخطيط نظرة عامة على الاتصال التشغيلي.

تضمين سكريبت العميل (Embedding the Client Script)

يؤدي الانتقال إلى لوحة الربط (Integration) إلى الكشف عن السكريبت البرمجي الفريد للنشر العالمي لمؤسستك.

1. حدد عنصر التحكم نسخ الكود (Copy the code) الموجود في الزاوية العلوية اليمنى.
2. الصق الكود البرمجي المنسوخ مباشرة فوق علامة الإغلاق </body> داخل الكود المصدري لتطبيق أو موقع العميل المستهدف.

بمجرد تنفيذ السكريبت داخل تطبيق العميل الخاص بك، تظهر فقاعة دردشة تفاعلية في الربع السفلي المحدد من الشاشة. يؤدي النقر فوق هذه الفقاعة إلى إظهار رأس واجهة متعدد الخيارات يحتوي على أربعة إجراءات تنقل أساسية:

• المحادثة المباشرة (Live Chat): يربط المستخدمين بمسارات المحادثة المفتوحة، ويوجههم مباشرة إلى تدفق الإنشاء (بدء محادثة جديدة) إذا لم تكن هناك مسارات نشطة.
• قائمة الأسئلة الشائعة المنسدلة (FAQs Dropdown): يعرض فهرسًا قابلاً للبحث مع قوائم منسدلة لاختيار اللغة (الإنجليزية (English) أو العربية (Arabic)) وأزرار للتنقل بين الصفحات.
• السجل (History): يسرد تواريخ المحادثات السابقة، ومعرفات الوكلاء النشطين، وحالات الحل، ومقاييس التقييمات الفرعية.
• الحجز (Booking): يفتح وحدة تقويم جدولة تفاعلية مضمنة. تعرض هذه الواجهة أصول المؤسسة، واختيارات مدة الجلسة (مثل 15 / 30 دقيقة)، ومعلمات تقويم Google Meet الآلية لتنظيم جلسات استشارات الفيديو.