إشعارات الويب عبر Google Tag Manager

طبّق إشعارات الدفع في أربع خطوات بدون أي برمجة! يمكن إضافة Pushwoosh WebSDK Lite إلى موقعك الإلكتروني من خلال Google Tag Manager، مما يجعل عملية الدمج سهلة قدر الإمكان.

الدمج

بيانات اعتماد Firebase

في وحدة تحكم Firebase، اختر مشروعك للحصول على Server Key و Sender ID الخاصين بـ Firebase. يرجى الاطلاع على لقطة الشاشة أدناه كمرجع:

لوحة تحكم Pushwoosh

اذهب إلى لوحة تحكم Pushwoosh وأضف تطبيقًا جديدًا. في الصفحة التي تفتح، قم بتكوين منصة Chrome أو Firefox بالنقر فوق زر Configure في الصف الخاص بكل منهما. املأ النموذج:

Server Key من وحدة تحكم Firebase في حقل API key؛
Sender ID من وحدة تحكم Firebase في حقل FCM Sender ID؛
العنوان الدقيق لموقعك الإلكتروني في حقل Website Name.

تأكد من نسخ Application Code للتطبيق الذي تم إنشاؤه حديثًا، ستحتاج إليه لاحقًا. يتم تمييز كود التطبيق أدناه:

Google Tag Manager

1. في Google Tag Manager، اختر حاوية (container) أو أنشئ واحدة جديدة.

2. أنشئ Tag جديدًا واختر Custom HTML في Tag Configuration.

3. انسخ السكريبت أدناه والصقه في حقل HTML؛

<script type="text/javascript" src="//cdn.pushwoosh.com/webpush-lite/v1/pushwoosh-web-notifications-lite.js?pw_application_code=#####-#####" async></script>

4. غيّر علامات الأرقام #####-##### (المميزة في الصورة أدناه) في السكريبت إلى Pushwoosh Application Code الخاص بك، والذي حصلت عليه في الخطوة 2.

5. مرر لأسفل إلى خيارات Triggering واختر All Pages.

6. انقر على “Save”. الـ Tag الخاص بك جاهز!

زر الاشتراك في الإشعارات

اسمح للمستخدمين بالاشتراك في إشعارات الدفع باستخدام زر الاشتراك في الإشعارات. لإعداد الزر، ما عليك سوى إضافة السكريبت التالي عبر Google Tag Manager.

<div style="text-align:center;margin:90px 0;">
  <button style="color:#000000;background: none;font-size: 16px;cursor: pointer;font-weight: 700;padding:0 60px;line-height: 60px;border:3px solid #000000;" type="button" name="button" onclick="window.pushwooshLite.instance.showSubscriptionWindow()">Subscribe Now</button>
</div>

اكتمل كل شيء! يمكن لزوار موقعك الإلكتروني الآن الاشتراك في رسائل الدفع واستلامها.