إرسال الرسائل التفاعلية

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

أنواع الرسائل التفاعلية:

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

مواصفات الرسائل التفاعلية

• يمكن دمج الرسائل التفاعلية معًا في الدفق ذاته.
• يتعذر على المستخدمين تحديد أكثر من خيار واحد في الوقت ذاته من رسالة قائمة أو زر، ولكن يمكنهم الرجوع وإعادة فتح رسالة سابقة.
• لا يمكن استخدام رسائل القوائم أو أزرار الرد كإشعارات. لا يمكن حاليًا إرسالها إلا خلال 24 ساعة من بعد إرسال أخر رسالة بواسطة المستخدم. إذا حاولت إرسال رسالة خارج النافذة التي تستغرق مدتها 24 ساعة، فستظهر رسالة خطأ.
• المنصات المدعومة: iOS، وAndroid، والويب (رسائل التدفقات غير مدعومة على الويب).

تعرف على أوجه الاختلاف بين الرسائل النصية والرسائل التفاعلية:

اطّلع على مثال حول كيفية دمج رسائل القوائم وأزرار الرد في الدفق ذاته:

حدث خطأ ما

لدينا مشكلة في تشغيل هذا الفيديو.

تعرف على المزيد

نظرة عامة

مزايا استخدام التسجيل المُضمن

فهم المستخدم

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

نتائج النشاط التجاري

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

ذات طابع شخصي

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

بدون قوالب

لا تتطلب الرسائل التفاعلية وجود قوالب أو موافقات مسبقة.

متى يمكن استخدامها

يفضل استخدام رسائل القوائم لعرض خيارات متعددة، مثل:

• قائمة خدمة عملاء أو الأسئلة المتكررة
• قائمة الطلبات الخارجية
• مجموعة من المتاجر أو المواقع القريبة
• أوقات الحجز المتوفرة
• اختيار طلب حديث لتكراره

يفضل استخدام أزرار الرد لعرض الردود السريعة من مجموعة محددة من الخيارات، مثل:

• إعادة شحن بيانات الاتصال
• تغيير المعلومات الشخصية
• إعادة تحديد طلب سابق
• طلب إرجاع المنتج
• إضافة المزيد من التفضيلات على طلب الطعام
• اختيار طريقة الدفع

تتميز أزرار الرد بوجه خاص بحالات الاستخدام "ذات الطابع الشخصي" حيث لا يكون الرد العام وافيًا.

تعد رسائل التدفقات هي الأفضل للاتصال المنظم عبر شاشة واحدة أو شاشات متعددة، مثل:

• حجز المواعيد
• تصفح المنتجات
• جمع ملاحظات العملاء
• الحصول على بيانات عملاء محتملين جديدة للمبيعات

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

طريقة استخدامها

على مستوى API، يتم تعيين الرسائل التفاعلية عن طريق تحديد نوع type الخاص بالرسالة على interactive وإضافة الكائن interactive. بشكل عام، تتضمن هذه الرسائل أربعة أجزاء رئيسية وهي: header وbody وfooter وaction:

{
  "recipient_type": "individual",
  "to" : "whatsapp-id",
  "type": "interactive" 
  "interactive":{
    "type": "list" | "button" | ...,
    "header": {},
    "body": {},
    "footer": {},
    "action": {}
  }
}

بالنسبة إلى رسائل القوائم، إليك كيفية تناسق الأجزاء معًا:

بالنسبة إلى رسائل أزرار الرد، إليك كيفية تناسق الأجزاء معًا:

راجع المزيد من المعلومات أدناه حول كيفية إرسال هذه الرسائل.

البدء

قبل أن تتمكن من إرسال أي رسالة، تحتاج إلى الحصول على معرف واتساب للمستلم من خلال إرسال استدعاء إلى العقدة /contacts.

نوصي بإعداد أحداث webhooks لتلقي حالة الرسالة وإشعارات الرسالة الواردة. بهذه الطريقة، يمكنك تتبع ما إذا كان قد تم إرسال الرسالة والردود التي تتلقاها من المستخدمين. للحصول على المزيد من المعلومات، راجع أحداث Webhooks.

الخطوة الأولى: تجميع كائن interactive

رسائل القوائم

لإرسال رسالة قائمة، يجب تجميع الكائن interactive من النوع list يتضمن المكونات التالية:

في النهاية، من المفترض أن يبدو الكائن interactive كما يلي:

"interactive":{
  "type": "list",
  "header": {
    "type": "text",
    "text": "your-header-content"
  },
  "body": {
    "text": "your-text-message-content"
  },
  "footer": {
    "text": "your-footer-content"
  },
  "action": {
    "button": "cta-button-content",
    "sections":[
      {
        "title":"your-section-title-content",
        "rows": [
          {
            "id":"unique-row-identifier",
            "title": "row-title-content",
            "description": "row-description-content",           
          }
        ]
      },
      {
        "title":"your-section-title-content",
        "rows": [
          {
            "id":"unique-row-identifier",
            "title": "row-title-content",
            "description": "row-description-content",           
          }
        ]
      },
      ...
    ]
  }
}

أزرار الرد

لإرسال رسالة تتضمن زر رد، يجب تجميع الكائن interactive من النوع button يتضمن المكونات التالية:

"header": {
      "type": "text" | "image" | "video" | "document",
      "text": "your text"
      # OR
      "document": {
        "id": "your-media-id",
        "filename": "some-file-name"
      }
      # OR
      "document": {
        "link": "the-provider-name/protocol://the-url",
        "provider": {
          "name": "provider-name",
        },
        "filename": "some-file-name"
      },
      # OR
      "video": {
        "id": "your-media-id"
      }
      # OR
      "video": {
        "link": "the-provider-name/protocol://the-url",
        "provider": {
          "name": "provider-name"
        }
      }
      # OR
      "image": {
        "id": "your-media-id"
      }
      # OR
      "image": {
        "link": "http(s)://the-url",
        "provider": {
          "name": "provider-name"
        }
      }
    }

"action": {
      "buttons": [
        {
          "type": "reply",
          "reply": {
            "id": "unique-postback-id",
            "title": "First Button’s Title" 
          }
        },
        {
          "type": "reply",
          "reply": {
            "id": "unique-postback-id",
            "title": "Second Button’s Title" 
          }
        }
      ] 
    }

في النهاية، من المفترض أن يبدو الكائن interactive كما يلي:

"interactive": {
    "type": "button",
    "header": { # optional
      "type": "text" | "image" | "video" | "document",
      "text": "your text"
      # OR
      "document": {
        "id": "your-media-id",
        "filename": "some-file-name"
      }
      # OR
      "document": {
        "link": "the-provider-name/protocol://the-url",
        "provider": {
          "name": "provider-name",
        },
        "filename": "some-file-name"
      },
      # OR
      "video": {
        "id": "your-media-id"
      }
      # OR
      "video": {
        "link": "the-provider-name/protocol://the-url",
        "provider": {
          "name": "provider-name"
        }
      }
      # OR
      "image": {
        "id": "your-media-id"
      }
      # OR
      "image": {
        "link": "http(s)://the-url",
        "provider": {
          "name": "provider-name"
        }
      }
    }, # end header
    "body": {
      "text": "your-text-body-content"
    },
    "footer": { # optional
      "text": "your-text-footer-content"
    },
    "action": {
      "buttons": [
        {
          "type": "reply",
          "reply": {
            "id": "unique-postback-id",
            "title": "First Button’s Title" 
          }
        },
        {
          "type": "reply",
          "reply": {
            "id": "unique-postback-id",
            "title": "Second Button’s Title" 
          }
        }
      ] 
    } # end action   
  } # end interactive

رسائل طلب الموقع

تحتوي رسائل طلب الموقع على نص رئيسي وزر إرسال الموقع الذي يمكن للمستخدمين الضغط عليه. يؤدي الضغط على الزر إلى عرض شاشة مشاركة الموقع التي يمكن للمستخدم حينها استخدامها لمشاركة الموقع.

لإرسال رسالة طلب موقع، أولاً قم بتجميع كائن interactive مع تضمين النص الذي ترغب في عرضه في الرسالة:

{
  "type": "location_request_message",
  "body": {
    "type": "text",
    "text": "<TEXT>"
  },
  "action": {
    "name": "send_location" 
  }
}

رسائل التدفقات

تحتوي رسائل التدفقات على زر دعوة لاتخاذ إجراء يمكن للمستخدمين الضغط عليه. يؤدي النقر على الزر إلى عرض الدفق المخصص.

لإرسال رسالة تدفقات، يجب تجميع كائن interactive من النوع flow. راجع هنا للحصول على التفاصيل بالكامل.

الخطوة الثانية: إضافة معلمات الرسائل الشائعة

والآن بعد الحصول على الكائن التفاعلي، يمكنك إلحاق المعلمات الأخرى التي تكون الرسالة: recipient_type وto وtype. لا تنس تعيين type على interactive.

{
  "recipient_type": "individual",
  "to" : "whatsapp-id", // WhatsApp ID of your recipient
  "type": "interactive",
  "interactive":{
    // Your interactive object  
   }
  }

راجع المعلمات الشائعة لكل أنواع الرسائل هنا.

الخطوة الثالثة: إجراء استدعاء POST إلى /messages

يمكنك إجراء استدعاء POST إلى نقطة النهاية /messages التي تحتوي على كائن JSON الذي تم تكوينه في الخطوتين الأولى والثانية. إذا تم إرسال الرسالة بنجاح، فستحصل على الاستجابة التالية:

{
  "messages": [{
    "id": "{message-id}"
  }]
}

الخطوة الرابعة: التحقق من أحداث Webhooks

إذا قمت بإعداد أحداث webhooks، فتحقق من التغييرات في حالة الرسالة بالإضافة إلى أي ردود من جانب المستخدمين.

تتضمن أحداث Webhooks للمستخدمين الذين يردون على الرسائل التفاعلية مكونًا جديدًا يُسمى interactive، والذي يحتوي على معلومات حول خيار المستخدم. راجع أحداث Webhooks، المكونات لمزيد من المعلومات.

على سبيل المثال، فيما يلي طلب لحدث webhook يصف المستخدم الذي شارك موقعه.

{
  "object": "whatsapp_business_account",
  "entry": [
    {
      "id": "12345",
      "changes": [
        {
          "value": {
            "messaging_product": "whatsapp",
            "metadata": {
              "display_phone_number": "12345",
              "phone_number_id": "12345"
            },
            "contacts": [
              {
                "profile": {
                  "name": "John Doe"
                },
                "wa_id": "12345"
              }
            ],
            "messages": [
              {
                "context": {
                  "from": "12345",
                  "id": "test-id"
                },
                "from": "123450",
                "id": "test-id",
                "timestamp": "16632",
                "location": {
                  "address": "1071 5th Ave, New York, NY 10128", #Optional
                  "latitude": 37.421996751527,
                  "longitude": -122.08407156636,
                  "name": "Solomon R. Guggenheim Museum" #Optional
                },
                "type": "location"
              }
            ]
          },
          "field": "messages"
        }
      ]
    }
  ]
}

يحتوي المكون location ضمن حمولة البيانات على خط العرض وخط الطول لدى المستخدم. لاحظ أن address وname هي مكونات اختيارية بالنسبة إلى المستخدم وقد لا يتم تضمينها.

"location": {
  "address": "1071 5th Ave, New York, NY 10128", #Optional
  "latitude": 40.782910059774,
  "longitude": -73.959075808525,
  "name": "Solomon R. Guggenheim Museum" #Optional
}