كيفية تخصيص Chatbot ذكاء اصطناعي بعلامتك التجارية

Piotr Grudzień
تاريخ النشر مدة القراءة: 10 دقائق
ودجت محادثة مخصص بالكامل بالعلامة التجارية: ألوان العلامة، وشعار وصورة رمزية مخصصان، ومن دون شارة طرف ثالث

يمكنك بناء AI agent على Quickchat AI في فترة بعد الظهر. الجزء الذي تتجاهله معظم الأدلة هو جعله يبدو كأن أنت من بناه، لا كأنه chatbot أُضيف من مكان آخر. يغطي هذا الدليل ذلك الجزء بالكامل.

ستبدأ من حساب فارغ، وتبني وكيلاً حقيقياً للدعم لشركة اسمها Brightwater، ثم تخصصه بالعلامة التجارية من البداية إلى النهاية: ألوانه، وشعاره، وصورته الرمزية، والمشغّل الذي ينقر عليه الزوار، وصفحة المحادثة المشتركة التي يمكنك إرسالها كرابط، وسطر “Powered by” في الزاوية. في النهاية سيكون لديك ودجت يمكنك تسليمه لعميل، ولقطة شاشة قبل وبعد لكل سطح لإثبات ذلك.

محادثة المحادثة نفسها مرتين: على اليسار الودجت الفاتح الافتراضي مع سطر "Powered by quickchat.ai" في التذييل، وعلى اليمين النسخة المعاد تخصيصها مع رأس كحلي، وصورة رمزية بلون أزرق مخضر على شكل قطرة ماء، وخلفية رملية، وفقاعات أزرق مخضر، ومن دون سطر طرف ثالث الوكيل نفسه، قبل وبعد. الإجابات نفسها، والإجراءات نفسها، وواجهة مختلفة تماماً.

مطابقة علامتك التجارية مجانية في كل خطة. إزالة سطر “Powered by Quickchat AI” هي الجزء الوحيد الذي يحتاج إلى خطة Professional. لا يوجد كود ولا شيء لتثبيته. والنطاق يتجاوز مظهراً واحداً بكثير: ثلاث علامات تجارية خيالية أخرى أدناه تجعل الودجت نفسه داكناً وباستيلياً وصاخباً باستخدام إعدادات Appearance فقط.

النسخة المختصرة، إذا أردت الانتقال مباشرة:

  1. ابنِ وكيلاً حقيقياً أولاً (prompt، وبعض المعرفة، وإجراء واحد)، حتى يكون هناك شيء يستحق التخصيص.
  2. في Appearance، اضبط Theme على Custom وأدخل ألوان علامتك التجارية. ارفع شعارك بصفته AI Agent Avatar واختر أحد أنماط المشغّل الثلاثة.
  3. راقب فحص التباين المدمج أثناء اختيار الألوان، وأصلح أي زوج يضع عليه علامة.
  4. في خطة Professional، شغّل Hide Quickchat AI Branding لإزالة سطر “Powered by” ووضع شعارك على Chat Page.
  5. ضمّن الودجت في موقعك، أو شارك رابط Chat Page.

ينفذ بقية هذا المنشور كل خطوة ببطء، مع القيم الدقيقة التي يمكنك نسخها.

ما معنى تخصيص chatbot بعلامتك التجارية؟

تخصيص chatbot بعلامتك التجارية يتكون من عملين منفصلين، ومن المفيد إبقاؤهما منفصلين منذ البداية.

العمل الأول هو مطابقة علامتك التجارية: الألوان، والشعار، والصورة الرمزية، وشكل الفقاعات، وحجم الخط. كل ما يراه الزائر يمكن أن يحمل هويتك، وكل ذلك متاح في كل خطة، بما في ذلك الخطة المجانية.

العمل الثاني هو إزالة علامة الصانع: سطر “Powered by Quickchat AI” الصغير في تذييل المحادثة، وشعار Quickchat على Chat Page المستضافة. هذا المفتاح موجود في خطة Professional وما فوق.

بطاقتان. البطاقة اليسرى، بعنوان "Match your brand, every plan"، تسرد ألوان العلامة التجارية، والشعار والصورة الرمزية، ورأس المشغّل والفقاعات، ونصف قطر الزوايا والنوع، وألوان الشريط الجانبي في Chat Page. البطاقة اليمنى، بعنوان "Remove the maker's mark, Professional plus"، تسرد إخفاء شارة Powered by واستبدالها بشعارك على Chat Page عملان، وخطتان. كل شيء تقريباً مجاني، ومفتاح واحد هو الجزء المدفوع.

إبقاء العملين منفصلين مهم لأنك تستطيع إنجاز معظم العمل، ورؤية معظم النتيجة، قبل أن تقرر الترقية. يمكن لحساب مجاني أن يجعل الودجت يبدو بالكامل مثل علامتك التجارية. خطة Professional تزيل آخر سطر من النص الصغير.

ابنِ وكيلاً حقيقياً أولاً حتى يكون مستحقاً للتخصيص

قبل لمس أي لون، ابنِ وكيلاً يجيب فعلاً عن الأسئلة ويفعل شيئاً مفيداً، حتى يلتف التخصيص حول منتج حقيقي لا حول غلاف فارغ.

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

أعطه هوية وprompt

افتح Identity في الشريط الجانبي. اضبط Name على الاسم الذي يجب أن يسمي الوكيل نفسه به (Brightwater)، وضع مهمته في Main Prompt. Main Prompt هو التعليمة الدائمة التي تشكل كل رد، لذلك صف الدور والنطاق وكيف يتصرف عندما لا يعرف شيئاً.

حقلا Name وMain Prompt في صفحة Identity: تم ضبط Name على Brightwater ويبدأ Main Prompt بوصف دور مساعد الدعم الحقلان المهمان في صفحة Identity: Name وMain Prompt.

إليك الـ prompt لنسخه:

أنت مساعد الدعم لشركة Brightwater، وهي شركة تصنع فلاتر مياه منزلية: Brightwater Pitcher، وUnder-Sink System، وWhole-House System. ساعد الزوار على اختيار الفلتر المناسب، وفهم أعمار الفلاتر وبدائلها، والإجابة عن أسئلة الشحن والإرجاع والضمان. كن ودوداً وموجزاً وعملياً، واجعل الإجابات قصيرة.

عندما يسأل زائر عن طلب قائم ويعطي رقم طلب، استدعِ إجراء "Check order status" باستخدام رقم طلبه، ثم أخبره بالحالة، وشركة الشحن، وتاريخ التسليم التقديري.

أجب فقط مما تعرفه فعلاً عن Brightwater. إذا لم تكن لديك معلومة تفصيلية (على سبيل المثال شهادة معينة لست متأكداً منها)، فقل إنك لا تملك تلك المعلومة واعرض توصيله بفريق Brightwater، بدلاً من التخمين.

الفقرة الأخيرة هي الأهم. تخبر الوكيل بأن يعترف بوجود فجوة بدلاً من اختراع إجابة. سنختبر أنه يلتزم بذلك.

أضف معرفة يمكنه الإجابة منها

افتح Knowledge Base وأضف بضع مقالات قصيرة: خط المنتجات والأسعار، وأعمار الفلاتر وتكاليف الاستبدال، والشحن، والإرجاع والضمان، والتركيب. النص العادي يكفي. يقرأ الوكيل هذه المقالات للإجابة عن الأسئلة، لذلك اكتبها بالطريقة التي ستشرح بها الوقائع لموظف دعم جديد. لمزيد من التفاصيل حول مصادر ذلك المحتوى وهيكلته، راجع دليل قاعدة معرفة chatbot.

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

اترك شيئاً واحداً خارجها عمداً. لا تقول قاعدة معرفة Brightwater شيئاً عن شهادة NSF لإزالة الرصاص. هذه الفجوة مقصودة، حتى نتحقق مما يفعله الوكيل عندما يسأل زائر سؤالاً لا يستطيع الإجابة عنه من معرفته.

أعطه إجراء واحداً حتى يستطيع فعل شيء

تغطي المعرفة ما يستطيع الوكيل قوله. أما الإجراء فيغطي ما يستطيع فعله: استدعاء API أثناء المحادثة واستخدام الاستجابة في رده. أضف إجراءً واحداً حتى يكون الوكيل أكثر من FAQ. افتح Actions & MCPs، واختر Add Action، وابنِ بحثاً عن الطلبات. يتبع كل إجراء الشكل نفسه، لذلك هذه الوصفة هي النمط لأي API ستصله لاحقاً.

محرر API Action معبأ للبحث عن الطلب: الاسم Check order status، ومعامل order_number إلزامي واحد، وطلب GET إلى عنوان URL لطلبات Brightwater مع شريحة متغير order_number، ورأس Accept، ووصف الإجراء الإجراء كله في محرر واحد. كل حقل أدناه يطابق مربعاً في هذا النموذج.

  • API Action Name: Check order status
  • What to ask the visitor first (معامل واحد):
FormatNameDescriptionRequired
Textorder_numberرقم طلب Brightwater الخاص بالزائر، على سبيل المثال BW-10432.Yes
  • Method and URL: GET https://api.brightwater.co/v1/orders/{{order_number}}
  • Headers: Accept: application/json
  • Body: لا شيء (هذا طلب GET)
  • API Action Description:
ابحث عن حالة طلب Brightwater. استدعِ هذا عندما يسأل الزائر عن طلب قائم ويعطي رقم طلب. يعيد الحالة الحالية، وشركة الشحن، وتاريخ التسليم التقديري.

وجّه عنوان URL إلى API الطلبات الخاص بك. شريحة {{order_number}} هي المعامل الذي عرفته أعلاه، وتُدرج في عنوان URL عندما يستدعيه الوكيل. API Action Description هو ما يقرأه الوكيل ليقرر متى يشغل الإجراء، لذلك اكتبه كتعليمة لا كتسمية. المسار المولّد مغطى في Connect Your AI Agent to Any API، حيث تتحول جملة واحدة إلى إجراء كامل يستند إلى توثيق API الحي. للبناء اليدوي حقلاً بحقل، راجع Build a Free AI Agent That Takes Actions.

تأكد أنه يعمل فعلاً

قبل تخصيص أي شيء، تحقق من سلوك الوكيل. افتح AI Preview أو محاكي Testing وشغّل بضع رسائل حقيقية. تصل كل تجربة اختبار إلى Inbox لديك كمحادثة، حتى تتمكن لاحقاً من فحص ما فعله الوكيل بالضبط.

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

ثم اطلب منه فعل شيء: “هل يمكنك التحقق من طلبي BW-10432؟” يعود الرد بالحالة، وشركة الشحن، وتاريخ التسليم، ويعرض Inbox علامة 1 action called تحتها. يوضح توسيع العلامة الاستدعاء نفسه: اسم الإجراء، وorder_number الذي ملأه، ورمز استجابة API.

عرض Inbox لمحادثة الطلب: يسأل الزائر عن الطلب BW-10432، ويرد الوكيل بالحالة shipped وشركة الشحن وتاريخ التسليم، وتعرض بطاقة الإجراء الموسعة استدعاء Check order status مع استجابة 200 ومعامل order_number الإيصال. تتوسع العلامة تحت الرد إلى الاستدعاء الدقيق، ومعامله، واستجابة 200.

أخيراً، اسأل السؤال الذي تركته بلا إجابة: “هل فلتر تحت الحوض حاصل على شهادة NSF لإزالة الرصاص؟” الوكيل الضعيف يخترع شهادة. الوكيل الجيد يرفض. يرد وكيلنا بأنه لا يملك تلك المعلومة في توثيقه، ولا يمكنه تأكيد الشهادة، ويعرض توصيل الزائر بالفريق. هذه الـ “لا” الصادقة أعلى قيمة من إجابة خاطئة واثقة، خصوصاً في ادعاء يتعلق بالسلامة.

عرض Inbox لسؤال الشهادة: يجيب الوكيل بأنه لا يملك معلومات عن شهادة NSF في توثيقه، ويقول إنه لا يستطيع تأكيد الادعاء، ويوصي بالتواصل مع فريق Brightwater “لا” الصادقة، حرفياً. يرفض الوكيل ادعاء الشهادة بدلاً من التخمين.

هذا وكيل عامل، تم اختباره وفحصه. كل ما يلي يتعلق بالمظهر.

كيف تطابق chatbot مع علامتك التجارية؟

كل ما يراه الزائر يمكن أن يحمل علامتك التجارية، وكل ذلك موجود في صفحة واحدة. افتح Your Website، ثم تبويب Appearance. عناصر التحكم مجمعة تحت Branding وSize & Position وTheme وOther Settings.

ارفع شعارك مرة واحدة. تحت Branding، يكون AI Agent Avatar صورة واحدة تؤدي ثلاث وظائف: هي الأيقونة على زر المشغّل، والصورة الرمزية في رأس المحادثة، وبعد أن تخفي علامة Quickchat التجارية، الشعار على Chat Page المستضافة. ارفع نسخة مربعة من علامتك وستظهر في كل مكان يظهر فيه الوكيل.

اضبط ألوانك. تحت Theme، غيّر الوضع من Light إلى Custom. يفتح ذلك لوحة كاملة: Background color، وHeader color، وAccent color (يُستخدم للأزرار وفقاعات محادثة الزائر)، وMessage bubble color، وألوان الإدخال، والمزيد. أدخل قيم hex الخاصة بعلامتك التجارية. بالنسبة إلى Brightwater استخدمنا Background رملياً (#F6F3EC)، وHeader كحلياً عميقاً (#0B2E33)، وAccent أزرق مخضراً (#0E7C86). أسفل الألوان، يتيح لك Corner radius وTypography مطابقة استدارة موقعك وحجم نصه.

اختر نمط المشغّل. المشغّل، أي الزر الذي يراه الزائر قبل فتح المحادثة، يأتي بثلاثة أنماط يحددها عنصر التحكم Launcher size تحت Size & Position. Classic، وهو الافتراضي، بطاقة صغيرة تحتوي على صورتك الرمزية واسم وكيلك ومربع رسالة. Input Only هو شريط رسالة عائم يتوسع بمجرد أن ينقر الزائر داخله. Small هو كبسولة مدمجة تحتوي على صورتك الرمزية ودعوة قصيرة إلى الإجراء، نصها هو حقل Launcher label الذي يظهر عندما تختار نمط Small، وترك التسمية فارغة يعرض الأيقونة فقط.

أنماط المشغّل الثلاثة جنباً إلى جنب، كلها بألوان Brightwater: بطاقة Classic مع الصورة الرمزية والاسم ومربع رسالة، وشريط رسالة عائم Input Only، وكبسولة Small مع الصورة الرمزية وتسمية Ask Brightwater أنماط المشغّل الثلاثة، عنصر تحكم واحد. تستخدم الأنماط الثلاثة ألوان الثيم والصورة الرمزية.

يضبط القسم نفسه Widget position (أي من الزاويتين السفليتين)، وحجم النافذة المفتوحة (Widget window max width، من 300 إلى 700 بكسل، وWidget window max height، من 400 إلى 1200 بكسل)، وDraggable Launcher الذي يتيح للزوار سحب المشغّل على طول حافة الصفحة.

لأن المشغّل يستخدم الثيم والصورة الرمزية نفسيهما، تحمل الحالة المغلقة علامتك التجارية بقدر النافذة المفتوحة. إليك مشغّل Classic قبل معالجة Brightwater وبعدها، مع تشغيل نافذة الترحيب المنبثقة:

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

يحدّث كل عنصر تحكم المعاينة الحية بجانب النموذج، لذلك يمكنك مشاهدة الودجت وهو يصبح ملكك أثناء العمل. اضبط ألوانك، وارفع صورتك الرمزية، واختر مشغّلاً، وبذلك ينتهي عمل “مطابقة علامتك التجارية”، على أي خطة.

هل ستبقى ألوان علامتك التجارية مقروءة؟

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

أثناء اختيار الألوان، يحسب المحرر نسبة تباين WCAG AA لكل زوج من النص والخلفية، وينبهك في مكانه عندما ينخفض أي زوج عن معيار 4.5:1 للنص العادي. تتعثر لوحة Brightwater الحقيقية ثلاث مرات: النص الثالثي، ولون الرابط، والعنصر النائب للإدخال، وكلها تظهر فاتحة جداً مقابل خلفياتها.

محرر Theme المخصص يعرض ألوان علامة Brightwater التجارية، مع تحذيرات تباين في صفوف Tertiary text وLink وInput placeholder تقول "Low contrast against the paired color. WCAG AA requires 4.5:1 for normal text" يضع المحرر علامات على أزواج التباين المنخفض أثناء اختيارها، مع النسبة الدقيقة.

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

بطاقتان. اليسرى تعرض نصاً أزرق مخضراً فاقعاً على أبيض مع تسمية "2.5 to 1, fails WCAG AA". اليمنى تعرض نصاً داكناً على خلفية رملية مع تسمية "7.9 to 1, passes"، مع ملاحظة لإبقاء الأزرق المخضر للأزرار، لا لنص المتن العلامة نفسها، ونص مقروء. التخصيص الجيد يعني وراثة قابلية قراءة علامتك التجارية، لا رموز hex فقط.

هذا هو الجزء من تخصيص العلامة التجارية الذي تتخطاه أدلة المنافسين. الـ chatbot المخصص فعلاً هو الذي يبدو كعلامتك التجارية ويبقى قابلاً للوصول. يتولى المحرر الحساب حتى لا تضطر إلى ذلك.

إلى أي مدى يمكن أن يختلف الودجت نفسه؟

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

لإظهار النطاق، إليك ثلاث علامات تجارية خيالية أخرى، بُنيت بالطريقة نفسها التي بُنيت بها Brightwater.

Basalt، وهي شركة أدوات بيانات، تشغّل ودجت داكناً بالكامل: خلفيات شبه سوداء، ولون بارز بنفسجي، وزوايا حادة، ونص صغير، ومشغّل Small بأيقونة فقط. (يوجد أيضاً وضع ثيم Dark مدمج، أما لوحة مخصصة مثل هذه فتذهب أبعد وتضبط كل لون.)

عرض Basalt: نافذة محادثة داكنة مع شعار مثلث بنفسجي، ورقائق بدء محادثة بنفسجية، وزوايا حادة، وكبسولة مشغّل داكنة مطابقة بأيقونة فقط Basalt: لوحة داكنة مخصصة، Roundness مضبوط على Small، وText size Small، ومشغّل Small بأيقونة فقط، ونافذة 460px.

Mara، وهي علامة عناية بالبشرة، تسير في الاتجاه المعاكس: درجات كريمية ووردية، وزوايا مستديرة بالكامل، ونص كبير، ومشغّل Classic يرحب بالزوار برسالة ترحيب.

عرض Mara: نافذة محادثة كريمية ووردية مع شعار ورقة، ورقائق بدء محادثة بشكل كبسولة بلون خشب الورد، ونص كبير، وبطاقة مشغّل Classic مع رسالة الترحيب Mara: لوحة مخصصة دافئة، Roundness Full، وText size Large، ومشغّل Classic مع تشغيل نافذة الترحيب المنبثقة.

Volt، وهو متجر دراجات كهربائية، يجمع رأساً أسود مع لون برتقالي واضح، واستدارة متوسطة، ومشغّل Input Only.

عرض Volt: نافذة محادثة بيضاء مع رأس أسود، وشعار صاعقة برتقالي، ورقائق بدء برتقالية بنص داكن، وشريط رسالة عائم Input Only كمشغّل Volt: لوحة مخصصة عالية التباين، Roundness Medium، ومشغّل Input Only، ونافذة 560px.

القيم الدقيقة، في حقول Appearance نفسها التي ضبطتها بالفعل لـ Brightwater:

SettingBasaltMaraVolt
Background color#0E1116#FBF6F1#FFFFFF
Header color#0E1116#F7EDE6#111111
Accent color#6A48F2#9E4F66#FF5A1F
Message bubble text#FFFFFF#FFFFFF#1A1208
RoundnessSmallFullMedium
Text sizeSmallLargeMedium
Launcher sizeSmall (تسمية فارغة)ClassicInput Only
Widget window max width460px500px560px

تفصيل واحد يعود إلى فحص التباين: تستخدم فقاعات Volt نصاً شبه أسود على البرتقالي بدلاً من الأبيض، لأن الأبيض على ذلك البرتقالي يفشل عتبة 4.5:1. ينطبق الفحص على أي لوحة تختارها، وهذا ما يبقي حتى العلامة الصاخبة مقروءة.

كيف تزيل علامة “Powered by” التجارية؟

مطابقة علامتك التجارية لا تزال تترك سطراً واحداً من النص الصغير: سطر “Powered by Quickchat AI” في تذييل المحادثة. إزالته مفتاح واحد، متاح في خطة Professional وما فوق.

في أسفل تبويب Appearance، تحت Other Settings، ابحث عن Hide Quickchat AI Branding. يقول وصفه “Hide all Quickchat AI branding from the widget, ensuring a fully white-labeled experience.” في الخطة المجانية والخطط الأدنى يكون زر التبديل مرئياً لكنه مقفل، مع مطالبة Upgrade plan to unlock بجانبه، لذلك تعرف دائماً مكان الحد بالضبط. في Professional وما فوق، شغّله.

بطاقتان تقارنان عنصر التحكم Hide Quickchat AI Branding. تعرض بطاقة الخطة Free المفتاح متوقفاً مع كبسولة "Upgrade to unlock"، وتعرض بطاقة Professional plus المفتاح نفسه مفعلاً وباللون الأخضر يمكنك رؤية ما يفعله المفتاح المدفوع بالضبط قبل أن تقرر الترقية.

مع تشغيل زر التبديل، يختفي سطر التذييل من الودجت. يحمل الوكيل الآن علامتك التجارية فقط.

هل يعمل تخصيص العلامة التجارية على صفحة المحادثة المشتركة أيضاً؟

لا يصل كل زائر عبر ودجت على موقعك. يوفّر Quickchat AI أيضاً لكل وكيل Chat Page مستضافة، وهي نسخة بصفحة كاملة يمكنك مشاركتها كرابط، أو وضعها في بريد إلكتروني، أو وضعها خلف رمز QR. تجدها تحت Your Website، في خيار Share a link instead.

إخفاء العلامة التجارية يفعل هنا أكثر من إزالة سطر. على Chat Page، يقوم المفتاح نفسه باستبدال شعار Quickchat في الشريط الجانبي بشعارك (الصورة الرمزية التي رفعتها سابقاً)، وينقل صورتك الرمزية إلى أعلى ترويسة الشريط الجانبي. تظهر الصفحة كمنتجك من النظرة الأولى.

Chat Page المستضافة معروضة مرتين: في الأعلى النسخة الافتراضية مع علامة quickchat.ai النصية في شريط جانبي فاتح، وأسفلها النسخة ذات العلامة التجارية مع شعار Brightwater على شكل قطرة ماء في شريط جانبي كحلي وفقاعات رسائل أزرق مخضر Chat Page، قبل وبعد. شعارك، وألوان شريطك الجانبي، وترويستك.

لـ Chat Page sidebar ألوانه الخاصة تحت محرر Theme، لذلك يمكنك حمل لوحتك حتى حواف العرض بصفحة كاملة. رفع واحد وزر تبديل واحد يخصصان السطحين اللذين قد يراهما الزائر.

تشغيل وكيلك المخصص بعلامتك التجارية

تنتمي العلامة التجارية إلى الوكيل، لذلك تنتقل معه. أياً كانت الطريقة التي يصل بها الزائر إلى وكيلك، فإنه يرى العلامة نفسها.

لوضعه على موقعك، افتح Your Website، واختر Install manually with code (أو خيارات WordPress أو Shopify أو Webflow)، والصق المقتطف قبل وسم </body> الختامي. ولأن الودجت يحمّل على صفحتك، فهو موجود بالفعل على نطاقك بجانب بقية موقعك.

لـ مشاركة رابط، استخدم Chat Page المستضافة. للوصول إلى الأشخاص على قنوات المراسلة، صِل الوكيل بـ WhatsApp أو Telegram أو غيرهما تحت External Apps، وستنتقل الهوية نفسها عبرها.

بهذا يكتمل الدليل. بنيت وكيلاً حقيقياً يجيب ويتصرف، ثم وضعت علامتك التجارية على كل سطح يراه الزائر، كل ذلك من حساب فارغ في نحو خمس عشرة دقيقة. إذا كنت تفعل ذلك للعملاء بدلاً من موقعك، فإن جانب الأعمال (التغليف، والتسعير، والهوامش) مغطى في دليل white label chatbot. أما جانب المنصة، فلديك الوصفة كاملة أعلاه.

الأسئلة الشائعة

ما المقصود بـ white-label AI chatbot؟

white-label AI chatbot هو chatbot يمكنك تقديمه بالكامل على أنه ملكك: ألوانك، وشعارك، وصورتك الرمزية، من دون أي أثر للأداة التي بُني عليها. في Quickchat AI يمكنك مطابقة علامتك التجارية على كل خطة، وإزالة سطر “Powered by Quickchat AI” متاحة بدءاً من خطة Professional وما فوق.

كيف أزيل علامة “Powered by” التجارية من chatbot؟

في صفحة Appearance، شغّل “Hide Quickchat AI Branding”. يؤدي ذلك إلى إزالة سطر “Powered by Quickchat AI” من تذييل المحادثة واستبدال شعار Quickchat على Chat Page المستضافة بشعارك. زر التبديل متاح في خطة Professional وما فوق.

هل يمكنني تخصيص chatbot بعلامتي التجارية مجاناً؟

نعم. مطابقة علامتك التجارية، أي الألوان والصورة الرمزية والشعار والرأس وألوان الشريط الجانبي في Chat Page، متاحة في كل خطة، بما في ذلك الخطة المجانية. إزالة سطر “Powered by” هي الجزء الذي يحتاج إلى خطة Professional.

هل أحتاج إلى نطاق مخصص لتخصيص chatbot بعلامتي التجارية؟

لا. يمكنك تخصيص الودجت وChat Page المستضافة داخل المنتج نفسه، من دون أي إعداد نطاق. عندما تضمّن الودجت في موقعك، يكون موجوداً بالفعل على نطاقك بجانب بقية موقعك.

هل يغيّر تخصيص العلامة التجارية طريقة عمل chatbot؟

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

ما الخطة التي أحتاج إليها لإزالة علامة Quickchat AI التجارية؟

زر التبديل “Hide Quickchat AI Branding” متاح في خطة Professional وما فوق. في الخطط الأدنى يكون زر التبديل مرئياً لكنه مقفل، مع مطالبة “Upgrade plan to unlock”. لا تزال كل خطة قادرة على مطابقة ألوان علامتك التجارية وشعارها وصورتها الرمزية بالكامل.

هل ستبقى ألوان علامتي التجارية مقروءة في المحادثة؟

يفحص محرر الثيم كل زوج من النص والخلفية مقابل معيار تباين WCAG AA (4.5:1) أثناء اختيار الألوان، وينبهك عندما يكون أي زوج منخفضاً جداً. لوحات العلامات التجارية المضبوطة للشعارات الكبيرة تفشل غالباً عند حجم نص المحادثة، لذلك يخبرك الفاحص بتعديل لون النص بدلاً من نشر شيء صعب القراءة.

هل يمكنني تخصيص chatbot بعلامتي التجارية على موقعي وعلى رابط مشترك؟

نعم. ينطبق التخصيص على الودجت الذي تضمّنه في موقعك وعلى Chat Page المستضافة التي تشاركها كرابط. على Chat Page، يستبدل تخصيص العلامة التجارية شعارك بالشعار الموجود وينقل صورتك الرمزية إلى أعلى الشريط الجانبي.

هل يمكنني تغيير الصورة الرمزية والشعار في chatbot؟

نعم. ترفع صورة واحدة بصفتها AI Agent Avatar. تظهر على زر المشغّل وفي رأس المحادثة، وعلى Chat Page المستضافة تصبح شعار الشريط الجانبي عندما تكون العلامة التجارية مخفية. صورة واحدة تؤدي دور الصورة الرمزية والشعار.

هل يمكنني تغيير نمط مشغّل المحادثة؟

نعم. يوفّر عنصر التحكم Launcher size في تبويب Appearance ثلاثة أنماط: Classic (بطاقة تحتوي على صورتك الرمزية واسم وكيلك ومربع رسالة)، وInput Only (شريط رسالة عائم)، وSmall (كبسولة مدمجة مع صورتك الرمزية وتسمية قصيرة تحددها في حقل Launcher label). تستخدم الأنماط الثلاثة ألوان الثيم والصورة الرمزية، ويمكنك وضع الودجت في أي من الزاويتين السفليتين.

إلى أي مدى يمكنني تخصيص مظهر chatbot؟

إلى حد كبير، وكل ذلك من دون كود. في تبويب Appearance تضبط خمسة عشر لوناً للثيم ونصف قطر الزوايا وحجم النص، وتختار واحداً من ثلاثة أنماط للمشغّل، وتحدد حجم النافذة وموقعها، وترفع صورتك الرمزية. يوجد أيضاً ثيم داكن مدمج. وبما أن كل شيء إعدادات ولا توجد CSS مخصصة، يمكن أن يبدو chatbotان مبنيان على المنصة نفسها مختلفين تماماً.

كم يستغرق تخصيص chatbot بعلامة تجارية؟

نحو خمس عشرة دقيقة: بضع دقائق لبناء وكيل حقيقي مع prompt وبعض المعرفة وإجراء واحد، ونحو عشر دقائق لضبط ألوان العلامة التجارية ورفع الشعار والصورة الرمزية وإيقاف سطر “Powered by”. لا يوجد شيء لتثبيته ولا كود.