كيفية استخدام Webhooks مع نماذج WordPress

هل تريد دمج نماذج WordPress الخاصة بك مع تطبيقات وخدمات الويب المختلفة؟

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

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

لكن أولاً ، إذا كنت مبتدئًا ، فسنغطي ماهية Webhooks وسبب أهميتها. ضع في اعتبارك أن الطريقة التي سنستخدمها اليوم لا تتطلب منك أي مهارات في البرمجة.

ما هي Webhooks؟

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

من الناحية الفنية ، فإن webhooks عبارة عن عمليات رد نداء HTTP محددة من قبل المستخدم يتم تشغيلها بواسطة حدث في نظام المصدر وإرسالها إلى النظام الوجهة.

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

إذا كنت تتساءل عن سبب استخدام الويب هوك ، فإليك بعض الفوائد:

• نقل المعلومات بين خدمتين / تطبيقين تلقائيًا
• أتمتة المهام وخفض وقت الإدارة
• خفض تكلفة استخدام خدمات الموصل مثل Zapier و Hubspot لمعالجة البيانات في التطبيقات.

تعتبر Webhooks مفيدة بشكل لا يصدق للمطورين ومستخدمي WordPress البارعين في مجال التكنولوجيا.

مع ذلك ، لنبدأ دليلنا خطوة بخطوة حول كيفية إنشاء نموذج webhook في WordPress.

إنشاء نموذج Webhook في WordPress [طريقة سهلة]

هناك العديد من الطرق التي يمكنك من خلالها استخدام webhooks لإرسال عمليات إرسال نماذج WordPress إلى تطبيقات الويب الأخرى.

سنستخدم WPForms لهذا البرنامج التعليمي لأنه يوفر Webhooks Addon الذي يسهل على أي شخص استخدامه ، بما في ذلك المبتدئين. لا يوجد أي ترميز على الإطلاق.

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

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

باستخدام Webhooks Addon ، يمكنك بسهولة توصيل WordPress بأي خدمة أو تطبيق. كل ما يتطلبه الأمر هو بضع نقرات لتمكين هذه الوظيفة.

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

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

الخطوة 1: إنشاء تطبيق Slack جديد

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

الآن لإرسال البيانات من WordPress إلى خدمة أخرى باستخدام webhooks ، ستحتاج إلى إنشاء جسر بين التطبيقين. لذلك للاتصال بـ Slack ، ستحتاج إلى إنشاء تطبيق Slack (الجسر).

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

في النافذة المنبثقة التالية ، يمكنك اختيار الطريقة التي تريد بها إنشاء تطبيق باستخدام Slack. هناك خياران:

• من الصفر
• من بيان التطبيق.

هنا ، سننشئ تطبيق Slack من البداية. يبدو أنه يتطلب الكثير من العمل ولكنه في الحقيقة لا يتطلب سوى بضع نقرات.

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

هذا يفتح صفحة المعلومات الأساسية. هنا ، تحتاج إلى النقر فوق خيار Webhooks الواردة .

في الشاشة التالية ، قم بتمكين إعدادات تنشيط خطاف الويب الوارد . يتيح لك ذلك نشر الرسائل على Slack من الخدمات الخارجية.

بمجرد التمكين ، سترى قسم Webhooks URLs for Your Workspace على الصفحة.

الآن ، تحتاج إلى إنشاء خطاف ويب جديد للحصول على معلومات من نموذج WordPress الخاص بك. لذلك ، انقر فوق الزر Add New Webhook to Workspace .

بعد ذلك ، يمكنك رؤية النافذة المنبثقة حيث يمكنك تحديد قناة Slack لنشر عمليات إرسال النموذج الخاصة بك.

بعد اختيار قناة Slack ، انقر فوق Allow .

الآن ، ستتمكن من رؤية عنوان URL الجديد للويب هوك لتطبيق Slack الخاص بك.

كل ما عليك فعله الآن هو نسخ عنوان Webhook URL. ستحتاج إليها بعد خطوات قليلة.

الخطوة 2: تثبيت وتنشيط WPForms

بمجرد حصولك على عنوان URL الخاص بخطاف الويب الخاص بك ، يمكنك إضافته إلى نموذج WordPress الخاص بك.

للبدء ، قم بالتسجيل للحصول على حساب على موقع WPForms.

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

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

الآن ، توجه إلى لوحة معلومات WordPress الخاصة بك وقم بتثبيت المكون الإضافي. إذا كنت تريد المزيد من التفاصيل ، يمكنك مراجعة دليلنا حول كيفية تثبيت مكون WordPress الإضافي.

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

قبل البدء في إنشاء النموذج الخاص بك ، تحتاج إلى تثبيت Webhooks Addon.

لهذا ، انتقل إلى WPForms »علامة التبويب Addons وستجد الكثير من الوظائف الإضافية التي تساعدك على توسيع وظائف نماذج WordPress الخاصة بك. هنا ، انقر فوق الزر Install Addon لـ Webhooks Addon.

أنت الآن جاهز لإنشاء نموذج الويب هوك الخاص بك في WordPress.

الخطوة 3: إنشاء نموذج Webhook

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

• نموذج اتصال بسيط
• طلب نموذج اقتباس
• استمارة التبرع
• نموذج الفواتير / الطلب
• إستمارة إستبيان
• نموذج اقتراح

…و اكثر! في هذا البرنامج التعليمي ، سنختار نموذج نموذج الاقتراح لأننا أنشأنا تطبيق Slack لتعليقات المستخدمين في الخطوة السابقة. لا تتردد في اختيار أفضل ما يناسب ما تحتاجه.

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

بعد تحديد قالب ، سترى أداة إنشاء النماذج بالسحب والإفلات في النافذة التالية.

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

تقدم WPForms العديد من خيارات التخصيص بحيث يمكنك النقر فوق أي حقل لتحريرها. يتيح لك تغيير أسماء الحقول والوصف والمزيد من الإعدادات المتقدمة.

بمجرد الانتهاء من إضافة حقول النموذج ، انقر فوق الزر حفظ .

في الخطوة التالية ، سنتعلم كيفية إعداد webhooks لهذا النموذج وتوصيل تطبيق Slack.

الخطوة 4: إعداد Webhook لـ Slack

لكي تعمل webhooks على النموذج الخاص بك ، تحتاج إلى الانتقال إلى الإعدادات »علامة التبويب Webhooks والنقر على خيار تمكين Webhooks .

سيتم إنشاء خطاف ويب جديد يمكنك تعديله لإعداد تكامل Slack.

أولاً ، يمكنك تغيير اسم الويب هوك. سيساعدك هذا في التعرف عليه لاحقًا.

هل تتذكر الآن عنوان URL الخاص بـ Webhook الذي نسخته من تطبيق Slack في الخطوة 1؟ ستحتاج إلى لصقه هنا في خيار طلب عنوان URL . سيتيح لك ذلك ربط نموذج WordPress الخاص بك بخدمات أخرى مثل Slack.

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

• طريقة الطلب: تتيح لك اختيار نوع الاتصال الذي تريد إنشائه بالخدمة المتصلة. هناك العديد من أنواع طرق HTTP التي يمكنك استخدامها بناءً على نوع الاتصال الذي تبحث عن إنشائه:
  • الحصول على : سيؤدي هذا إلى الحصول على بيانات من النموذج المقدم وإرسال التفاصيل إلى تطبيق متصل.
  • POST : سيؤدي هذا إلى إرسال البيانات إلى خدمة ثانوية. سنستخدم طلب HTTP POST لأننا نحتاج إلى نشر البيانات من النموذج الخاص بك إلى قناة Slack الخاصة بك.
  • PUT : يتيح لك ذلك تحديث البيانات عند تشغيل خطاف الويب.
  • التصحيح : يتيح لك هذا استبدال البيانات عند تشغيل خطاف الويب.
  • حذف : يمكّنك هذا من حذف المعلومات عند تشغيل خطاف الويب المحدد هذا.
• تنسيق الطلب: سيُظهر هذا الخيار للخادم نوع المحتوى الذي ترسله. هذا تقني بعض الشيء ولكن في الأساس ، هناك نوعان مختلفان من تنسيق الطلب متاحان:
  • JSON : ينسق بياناتك في تطبيق / تنسيق json وسيحدد نوع المحتوى كـ charset = utf-8 .
  • FORM : ينسق بياناتك في تنسيق application / x-www-form-urlencoded ، وسيتم تعيين نوع المحتوى كـ charset = utf-8 .
• السر: إذا كنت مطورًا وترغب في دمج واجهة برمجة التطبيقات الخاصة بك للمصادقة ، فيمكنك استخدام مفتاح سري. لكن بالنسبة لبرنامجنا التعليمي ، لا نحتاج إلى هذا الخيار ، لذا سنترك هذا فارغًا.
• عناوين الطلب: يرسل هذا قيمًا محددة عند إرسال الطلب إلى التطبيق. عند تشغيل الويب هوك ، سيتم إنشاء الحقول تلقائيًا. سنترك هذا الحقل فارغًا أيضًا.
• نص الطلب: بالنسبة لهذا الخيار ، تحتاج إلى إعداد نوع الرسالة وتحديد حقل لنشر الرسائل. نظرًا لأن المستخدمين سيدخلون الاقتراحات بتنسيق نصي ، فسنقوم بتعيين Key to Text . بعد ذلك ، حدد الحقل حيث سيدخل المستخدمون رسالتهم.

بعد الانتهاء من إعدادات طلب الويب هوك ، انقر فوق الزر حفظ .

الخطوة 5: إعداد إعلامات النموذج

بعد ذلك ، يمكنك إعداد إشعارات البريد الإلكتروني لنموذج WordPress. يتيح لك هذا إرسال رسائل بريد إلكتروني آلية إلى المسؤول وأي عضو في الفريق والعميل / المستخدم بمجرد إرسال النموذج.

لإعداد مهام سير عمل البريد الإلكتروني هذه ، توجه إلى الإعدادات »علامة التبويب الإشعارات ، وحدد خيار تمكين الإشعارات لرؤية الإعدادات الافتراضية.

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

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

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

في قسم رسالة البريد الإلكتروني ، يمكنك إضافة رسالتك المخصصة واستخدام العلامة الذكية {all_fields} لإظهار جميع بيانات النموذج التي أدخلها المستخدم.

لا تنس حفظ إعداداتك في النهاية.

الخطوة 6: تخصيص رسالة التأكيد

يتيح لك WPForms أيضًا عرض رسائل التأكيد على الواجهة الأمامية لموقعك بعد أن يرسل المستخدمون النموذج بنجاح.

في علامة التبويب الإعدادات »التأكيدات ، سترى إعدادات التأكيد. بشكل افتراضي ، يتم تعيين نوع التأكيد على "رسالة" ولكن هناك 3 خيارات في هذه القائمة:

• الرسالة: أضف رسالة تأكيد يتم عرضها على الواجهة الأمامية بعد أن يرسل العملاء طلبهم.
• عرض الصفحة: أعد توجيه المستخدمين إلى أي صفحة على موقعك.
• انتقل إلى URL (إعادة توجيه): أرسل المستخدمين إلى عنوان URL محدد.

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

بمجرد الانتهاء من الإعدادات ، انقر فوق الزر حفظ .

يجب أن نذكر هنا أيضًا أن WPForms تتيح لك التكامل مع خدمة البريد الإلكتروني المفضلة لديك مثل Constant Contact و Mailchimp.

تحتاج ببساطة إلى الوصول إلى هذا ضمن علامة التبويب Marketing واتباع التعليمات التي تظهر على الشاشة لتوصيل حساب بريدك الإلكتروني. في معظم الحالات ، ستحتاج إلى توفير مفتاح API يمكنك إنشاؤه مع مزود البريد الإلكتروني.

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

كل ما عليك فعله الآن هو نشر نموذج webhook الخاص بك على موقع WordPress الخاص بك.

الخطوة 7: انشر نموذج Webhooks على موقعك

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

في هذا البرنامج التعليمي ، سنضيف النموذج إلى صفحة جديدة على موقعنا. لذا انتقل إلى Pages »إضافة علامة تبويب جديدة في لوحة إدارة WP. في شاشة محرر القوالب ، أضف كتلة جديدة وابحث عن "WPForms".

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

بعد ذلك ، يمكنك نشر صفحتك على موقعك.

إذا كنت تستخدم محرر WordPress الكلاسيكي ، فيمكنك إضافة النموذج باستخدام الزر Add Form في المحرر.

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

بعد ذلك ، يمكنك تحديد النموذج الذي أنشأته من القائمة المنسدلة وحفظ التغييرات.

الآن تم نشر نموذج الخطافات على الويب الخاص بك على موقعك. عندما يقوم المستخدمون بملء النموذج وإرساله ، ستتلقى إشعارات Slack من موقع الويب الخاص بك.

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

هذا كل شئ! نأمل أن يساعدك هذا المنشور في تعلم كيفية استخدام Webhooks في نماذج WordPress الخاصة بك. باستخدام WPForms ، يمكنك إنشاء نموذج webhook والاتصال بخدمة جهة خارجية بسهولة.

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

لخطواتك التالية ، يمكنك التحقق من هذه الموارد:

• كيفية إضافة خيار "حفظ ومتابعة لاحقًا" إلى نماذج WordPress
• كيفية تقليل التخلي عن النموذج وتعزيز التحويلات
• أفضل أدوات التقاط البريد الإلكتروني ومنشئ النماذج لـ WordPress

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