انتقل إلى المحتوى الرئيسي

المظهر والتصميم

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

Video tutorial

اجعل وكيل الذكاء الاصطناعي الخاص بك يبدو متماشياً مع العلامة التجارية · المظهر + أداة GDPR

→ مسار المسؤول: التخصيص → المظهر (/admin/chatModel/{id}/settings/theme)

ما الذي تقوم بتكوينه​

الصفحة منظمة على شكل ثلاث خطوات. يمكنك التقدم إلى الأمام والخلف في أي وقت؛ يتم حفظ التغييرات في الخطوة 2 عند الضغط على حفظ والمتابعة.

الخطوة 1 — الهوية​

Theme — Step 1: Identity

  • الاسم — الاسم العام لمساعدك (مثل "إيما"، "روبوت الدعم"). مرئي في كل مكان يتحدث فيه مساعدك مع المستخدمين.
  • الصورة الرمزية — الصورة التي يراها المستخدمون في رأس الدردشة وفقاعات الرسائل. قم بتحميل صورة مربعة؛ نحن نقوم بتغيير حجمها وتقديمها من شبكة توزيع المحتوى الخاصة بنا.

الاسم هو ما ينادي به المستخدمون الروبوت. اختر شيئًا يتماشى مع العلامة التجارية وسهل الكتابة — يصبح هوية المساعد عبر كل قناة.

الخطوة 2 — الألوان​

Theme — Step 2: Colors

لونان يحددان مجموعة الألوان الكاملة للأداة:

اللونمكان ظهوره
أساسي (brand.200)خلفية الزر العائم، تمييز فقاعات الرسائل، حالات التمرير
ثانوي (brand.500)زر الإرسال، الروابط داخل المحادثة، حلقات التركيز، حالات النشاط

كلا المدخلين يقبلان أي قيمة HEX. المعاينة الحية في أسفل الصفحة تعكس تغييراتك في الوقت الحقيقي حتى تتمكن من اختيار زوج يقرأ بشكل جيد على موقعك قبل الحفظ.

لماذا لونان فقط؟ نظام التصميم لدينا يستمد مجموعة ألوان كاملة من 5 خطوات (100/200/500/700/900) من هذين العنصرين. أنت تحدد النغمة؛ نحن نحافظ على الباقي متسقًا.

الخطوة 3 — التكامل​

Theme — Step 3: Integrate

بمجرد أن يبدو مساعدك بشكل صحيح، انتقل مباشرة إلى قناة التكامل التي تختارها:

  • الأداة على الويب — كود التضمين لأي موقع ويب، مع التحكم الكامل في الأزرار والتخطيط
  • ووردبريس — حقن تلقائي عبر إضافة ووردبريس
  • بريستاشوب — حقن تلقائي عبر وحدة بريستاشوب
  • شوبفاي — ربط متجرك وحقن روبوت الدردشة تلقائيًا
  • جوملا — حقن تلقائي عبر إضافة جوملا

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

المعاينة الحية​

يتم عرض أداة الدردشة الحية على صفحة المظهر نفسها. يتم إعادة حقنها تلقائيًا في كل مرة تغير فيها لونًا، بحيث ترى العرض الدقيق الذي سيتلقاه مستخدموك النهائيون — لا حاجة لنشر أو فتح علامة تبويب أخرى.

تستخدم المعاينة نفس حزمة universal-chatbot.js مثل الإنتاج، لذا ما تراه هو ما سيراه زوارك.

الأذونات​

الإجراءالإذن المطلوب
عرض صفحة المظهرTHEME_READ
تغيير الألوان / حفظ المظهرTHEME_UPDATE
إعادة تسمية المساعدCHAT_MODEL_UPDATE

الأعضاء الذين ليس لديهم THEME_UPDATE يرون الصفحة في وضع القراءة فقط (المدخلات معطلة، لا زر حفظ). انظر التحكم في الوصول لمعرفة كيفية تعيين هذه الأذونات.

نصائح​

  • اختبر على خلفيتك الحقيقية. افتح موقعك في علامة تبويب ثانية أثناء اختيار الألوان — ما يبدو جيدًا في لوحة التحكم قد يتعارض مع قسم البطل لديك.
  • احتفظ بالتباين. اللون الثانوي يُستخدم أيضًا للنص القابل للنقر في المحادثة. إذا لم يتمكن المستخدمون من قراءته، فلن ينقروا.
  • تطابق CTA الخاص بك، وليس شعارك. الأداة هي سطح تفاعلي، لذا اربطها بلون الإجراء لموقعك (نغمة "اشتر الآن" / "سجل الآن") بدلاً من لون شعارك.
  • الصورة الرمزية تهم أكثر مما تعتقد. وجه حقيقي أو شخصية مصممة بشكل مميز تحقق تحويلًا أفضل من رمز روبوت عام — يفتح المستخدمون الدردشة أكثر عندما تبدو بشرية.

ذات صلة​

جاهز لرفع مستوى
تجربة المستخدم الخاصة بك؟

نشر مساعدي الذكاء الاصطناعي الذين يسعدون العملاء ويتناسبون مع عملك.

متوافق مع اللائحة العامة لحماية البيانات
ابدأ تجربة مجانيةالوصول إلى المكتب الخلفي