مرجع المكونات الإضافية للويب

توفر منصة Messenger مجموعة من المكونات الإضافية البسيطة التي تتيح لك بدء محادثة مع الأشخاص الذين يزورونك على الويب بسهولة. يتم تنفيذ كل المكونات الإضافية باستخدام مجموعة Facebook SDK للغة Javascript.

المكون الإضافي "دردشة العملاء" (إصدار تجريبي)

يتيح لك المكون الإضافي "دردشة العملاء" في منصة Messenger إمكانية دمج برنامجك التلقائي على Messenger مباشرةً في موقعك على الويب. يتيح ذلك لعملائك إمكانية التفاعل مع نشاطك التجاري في أي وقت من خلال التجربة نفسها ذات الطابع الشخصي والغنية بالوسائط والتي يحصلون عليها في Messenger.

للتعرف على تفاصيل الاستخدام، راجع المكون الإضافي "دردشة العملاء".

تنسيق التضمين

<div class="fb-customerchat"
 page_id="<PAGE_ID>">
</div>

السمات

السمة النوع الوصف

class

String (سلسلة)

يجب أن تكون القيمة fb-customerchat.

page_id

String (سلسلة)

معرف صفحتك

ref

String (سلسلة)

اختياري. سلسلة مخصصة يتم إدخالها في حدث webhook الموجود ضمن أحداث messaging_postbacks وmessaging_referrals.

theme_color

String (سلسلة)

اختياري. اللون المطلوب استخدامه كسمة للمكون الإضافي، بما في ذلك لون خلفية أيقونة المكون الإضافي "دردشة العملاء" ولون خلفية أي رسائل يرسلها المستخدمون. ويمكن دعم أي رمز ألوان سداسي عشري مسبوق بعلامة رقمية (مثل ‎#0084FF)، باستثناء اللون الأبيض. نوصيك بشدة باختيار لون يحقق تباينًا كبيرًا مع اللون الأبيض.

logged_in_greeting

String (سلسلة)

اختياري. النص الترحيبي الذي يتم عرضه إذا كان المستخدم قد قام بتسجيل الدخول حاليًا إلى فيسبوك. 80 حرفًا بحد أقصى.

logged_out_greeting

String (سلسلة)

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

greeting_dialog_display

String (سلسلة)

اختياري. تحدد طريقة عرض مربع حوار الرسالة الترحيبية. فيما يلي القيم المدعومة:


  • show: سيظهر مربع حوار الرسالة الترحيبية دائمًا عند تحميل المكون الإضافي.
  • fade: سيتم عرض مربع حوار الرسالة الترحيبية للمكون الإضافي، ثم يتلاشى ويظل مخفيًا بعد ذلك.
  • hide: سيظل مربع حوار الرسالة الترحيبية مخفيًا دائمًا حتى يقوم مستخدم بالنقر على المكون الإضافي.

يتم التعيين افتراضيًا على show على أجهزة الكمبيوتر وhide على الهواتف المحمولة.

greeting_dialog_delay

String (سلسلة)

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

minimized

Boolean (قيمة منطقية)

إشعار إيقاف الاستخدام

يتم إيقاف استخدام هذه السمة. يرجى استخدام greeting_dialog_display لتخصيص المكون الإضافي بدلاً من ذلك. ستكون للسمة greeting_dialog_delay الأولوية عن السمة minimized.

اختياري.

  • true عند تعيينها على القيمة true، سيكون لها التأثير نفسه عند تعيين greeting_dialog_delay = "fade".
  • false عند تعيينها على القيمة false، سيكون لها التأثير نفسه عند تعيين greeting_dialog_delay = "show".

المكون الإضافي "راسلنا"

يمكنك دعوة شخص ما مباشرةً إلى محادثة على Messenger.

للتعرف على تفاصيل الاستخدام، راجع المكون الإضافي "راسلنا".

تنسيق التضمين

<div class="fb-messengermessageus" 
  messenger_app_id="<APP_ID>" 
  page_id="<PAGE_ID>"
  color="<blue | white>"
  size="<standard | large | xlarge>">
</div>

السمات

السمة سمة HTML5 النوع الوصف

class

String (سلسلة)

يجب أن تكون القيمة fb-messengermessageus.

page_id

String (سلسلة)

معرف صفحتك

messenger_app_id

الرقم

معرف تطبيق فيسبوك.

color

data-color

String (سلسلة)

لون الزر: blue أو white.


ويتم التعيين افتراضيًا على القيمة blue.

size

data-size

String (سلسلة)

حجم الزر: standard أو large أو xlarge.


ويتم التعيين افتراضيًا على القيمة large.

ref

String (سلسلة)

اختياري. سلسلة مخصصة يتم إدخالها في حدث webhook الموجود ضمن أحداث messaging_postbacks وmessaging_referrals.

المكون الإضافي "إرسال إلى Messenger"

يمكنك إرسال رسالة إلى شخص ما من برنامجك التلقائي على Messenger في الخلفية، وتسجيل اشتراكه فيها.

للتعرف على تفاصيل الاستخدام، راجع المكون الإضافي "إرسال إلى Messenger".

تنسيق التضمين

<div class="fb-send-to-messenger" 
  messenger_app_id="<APP_ID>" 
  page_id="PAGE_ID" 
  data-ref="<PASS_THROUGH_PARAM>" 
  color="<blue | white>" 
  size="<standard | large | xlarge>">
</div>

السمات

السمة النوع الوصف

class

String (سلسلة)

يجب أن تكون القيمة fb-send-to-messenger.

page_id

String (سلسلة)

معرف صفحتك

messenger_app_id

الرقم

معرف تطبيق فيسبوك.

color

String (سلسلة)

اختياري. لون الزر: blue أو white.


ويتم التعيين افتراضيًا على القيمة blue.

size

String (سلسلة)

اختياري. حجم الزر: standard أو large أو xlarge.


ويتم التعيين افتراضيًا على القيمة large.

ref

String (سلسلة)

اختياري. معلمة الحالة المخصصة. 250 حرفًا بحد أقصى.


الأحرف الصالحة هي a-z A-Z 0-9 +/=-._


يجب ترميزها وتشفيرها لأغراض الأمان.

enforce_login

Boolean (قيمة منطقية)

اختياري. في حالة التعيين على true، يجب أن يقوم المستخدمون الذين قاموا بتسجيل الدخول بإعادة عملية تسجيل الدخول عند النقر على الزر. علمًا بأنه يتم تعيين القيمة افتراضيًا على false.

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

المكون الإضافي "مربع الاختيار"

يعمل المكون الإضافي "مربع الاختيار" على تسجيل اشتراك الأشخاص في برنامجك التلقائي على Messenger كجزء من نموذج، مثل إتمام الشراء أو التسجيل.

للتعرف على تفاصيل الاستخدام، راجع المكون الإضافي "مربع الاختيار".

تنسيق التضمين

<div class="fb-messenger-checkbox"  
  origin=<PAGE_DOMAIN>
  page_id=<PAGE_ID>
  messenger_app_id=<APP_ID>
  user_ref="<UNIQUE_REF_PARAM>"
  allow_login="<true>"
  size="<small | medium | large | standard | xlarge>"
  skin="<light|dark>"
  center_align="<true|false>">
</div>

السمات

السمة النوع الوصف

class

String (سلسلة)

يجب أن تكون القيمة fb-messenger-checkbox

page_id

الرقم

معرف صفحة فيسبوك المرتبطة بالبرنامج التلقائي.

messenger_app_id

الرقم

معرف تطبيق فيسبوك.

user_ref

String (سلسلة)

معلمة فريدة للإشارة إلى المستخدم. 250 حرفًا بحد أقصى.


الأحرف الصالحة هي a-z A-Z 0-9 +/=-._

allow_login

Boolean (قيمة منطقية)

اختياري. يتيح للأشخاص تسجيل الدخول إذا لم تكن هناك جلسة حالية موجودة. ويتم التعيين افتراضيًا على القيمة true.

size

String (سلسلة)

اختياري. حجم المكون الإضافي: small أو medium أو large أو standard أو xlarge.


ويتم التعيين افتراضيًا على القيمة large.

skin

String (سلسلة)

اختياري. لتعيين سمة اللون لمحتوى المكون الإضافي. وفيما يلي الخيارات المدعومة:

  • light: يتم عرض المكون الإضافي بنص باللون الأسود.
  • dark: يتم عرض المكون الإضافي بنص أبيض وأيقونة messenger شفافة وعلامة صاعقة البرق باللون الأبيض.

ويتم التعيين افتراضيًا على القيمة light.

center_align

Boolean (قيمة منطقية)

اختياري. يحدد ما إذا كان يجب محاذاة محتوى المكون الإضافي إلى المركز.


علمًا بأنه يتم تعيين القيمة افتراضيًا على false.