آموزش ایجاد Web Push Notifications در وردپرس

سلام خدمت شما عزیران نوین وردپرسی ها

امروز با افزونه ی جالب در خدمت شما هستیم که با توجه به اینکه خیلی از انتشار آن نگذشته اما سر وصدای زیادی به پا کرده است. حتما شما هم وقتی برای اولین بار وارد سایت نوین وردپرس شدید با پیغام ، عضویت در سیستم خبررسان نوین وردپرس که در تاپ بار مرورگر شما نمایش داده میشود شدید. این پیغام جهت اطلاع از آخرین نوشته های سایت های وردپرسی میباشد که با انواع مرورگرهای موجود سازگار بوده  وزمانی که مدیر سایت نوشته ای ارسال کند بصورت اطلاع رسان در سیستم کاربر اعلام میشود و کاربر با کلیک بر روی نوشته های مربوطه به راحتی میتوانید آن نوشته را مطالعه کند.

webpushnotif

در ادامه توضیحات ذکر شده در بالا ، شما با افزونه OneSignal شما براحتی میتوانید این امکان را برای سایت خود اضافه کنید و کاربران سایت خود را از آخرین اخبار سایتتان بصورت خودکار باخبر سازید. در ادامه با نحوه ایجاد چنین اطلاع رسانی با نوین وردپرس باشید.

webpushnotifications

همانطور که شما در تصویر می بینید بدون اینکه سخصی از سایت شما دیدن کند اعلانی از سایت شما بر روی مرورگر ظاهر می شود که خیلی هم میتواند برای جذب کاربر در سایت شما موثر باشد … این روش حتی میتواند بر روی موبایل ها هم مفید باشد در صورتی که تنطیمات این افزونه را به خوبی اعمال کنید ، کاربران قادر خواهند بود در تلفن همراه خود دریافت کنند.این افزونه رایگان است و شما میتوانید این افزونه را در آخر این پست دانلود کنید.

پس از نصب این افزونه یک گزینه ای بر بروی پیشخوان وردپرسی شما ایجاد می شود به نام OneSignal Push که با کلیک بروی گزینه مربوطه براحتی میتوانید تنظیمات مربوط به افزونه را مشاهده کنید. ( همانند تصویر مقابل )

onesignal-wp-settings

در این صفحه اطلاعاتی باید وارد کنید که خیلی ضروری است ، همانطور که می بینید دو شناسه کاربری از ما میخواهد به نام ها google Project Number و App ID  که باید آن ها را در دسترس خود داشته باشیم و در این قسمت وارد کنید. حال در ادامه نحوه ایجاد و دریافت این دو شناسه را به شما آموزش خواهیم داد:

آموزش ایجاد google Project Number :

ابتدا برای ساختن این کد به (این آدرس) مراجعه کنید ، پس از مراجعه به سایت مربوطه یک صفحه مانند تصویر زیر برای شما ایجاد میشود که باید فیلد های مد نظر را وارد کنید:

googleservicesapp

همانطور که در تصویر مشاهده می کنید باید برای خود یک حساب کاربری ایجاد کنید برای ایجاد میتوانید گزینه آبی رنگ Choose and configure services را کلیک کنید و در این صفحه مشخصات خود از جمله کشور و ایمیل و… را وارد کنید.

enablecloudmessaging

بعد از انجام مراحل بالا شما باید Google Cloud را فعال کنید.

gkeys

بعد انجام مراحل بالا شما میتوانید کد های API و ID  را دریافت کنید در ادامه شما به این دو کد نیاز خواهید داشت. خب در ادمه شما باید یک حساب از سایت اصلی این افزونه ایجاد کنید . (لینک ایجاد اکانت)

پس از ایجاد حساب کاربری در سایت مذکور و وارد شدن به حساب کاربریتان ،بر روی  Add a New App  کلیک کنید:

addnewap

بعد از کلیک بر روی گزینه Add a new همانند شکل زیر پنجره ای باز می شود:

appname

در مرحله بعدی از شما خواسته می شود تا این افزونه در کدام یک از سیستم عامل ها و مرورگر ها اجرا شود:

websitepush

و در ادامه اگر Website Push را انتخاب کنیم:

ردیف اول : سایت مورد نظر

ردیف دوم: کد گوگل

ردیف سوم : آیکن سایت خود در هنگام اجرای اعلان

ردیف چهارم : سایت خودر را وارد کنید ، مانند تصویر زیرک

appsettings

httpfallback

و در نهایت دکمه save را بزنید:

appsettingslink

و بعد از مراحل بالا وارد  App Settings شوید ( تصویر بالا):

keysandids

روی گزینه Keys & IDs کلیک کنید ( تصویر بالا):

onesignalkeys

در این مرحله شما کد هایی که در ابتدا دریافت کرده اید را اینجا وارد کرده و ذخیر میکنید.

بر روی مرورگر sofari کلیک کنید:

configapplesafari

و بعد از شما میخواهد که نام سایت و لینک سایت را وارد کنید:

safarisettings

دو گزینه آخری را کلیک می کنید ، موس را به پایین بیارید:

safarinotificationicons

در اینجا آیکون را آپلود می کنید: بعد از زدن دکمه save  آی دی را زیر آیکون safari  میبینید:

safariwebid

این کد را کپی کنید و در تنظیمات پلاگین خود وارد کنید ، بعد از انجام مراحل بالا برای تست وارد سایت شوید:

https://onesignal.com/your site

subscribepushnotif

در ادامه به این صفحه برگردید:

cofigwebpush

به این صفحات که با کادر قرمز مشخص شده است مراجعه کنید:

و بعد طبق روال تصویر زیر مشخصات زیر را وارد کنید:

testingwebpush1

و بعد در صفحه زیر کادر WordPress را بزنید  بعد از وارد کردن مشخصات save را بزنید تا تمامی مراحل بدرستی انجام بگیرد. به پایان آموزش این افزونه رسیدیم. ممنونم از شما که این آموزش را تا انتها مطالعه فرمودید ، امیدوارم که توانسته باشم یک آموش کامل و جامعی ارائه دهم.

دانلود افزونه onesignal

یک پیشنهاد برای شما:

نحوه لینک دادن به ایمیل در وردپرس

نحوه لینک دادن به ایمیل در وردپرس

با سلام خدمت همه کاربران عزیز امروز با یکی دیگر از سری آموزش های وردپرس خدمت شما هستیم در وردپرس شما براحتی میتوانید به ک کلمه یا نوشته لینک صفحه مورد نظر را بدهید اما…

12 دیدگاه

  • با سلام.
    من یه افزونه ای مثل افزونه شما که در دیدگاهها میزارید تا کاربر از پاسخ هاش خبر دار بشه نیاز دارم.
    ممنون میشم راهنماییم کنید.

    پاسخ
    • ببخشید شبیه همین افزونه در سایت http://www.varzesh3.com/ اجرا میشه اما با این تفاوت که پیام ها در گوشه سایت چند ثانیه ظاهر و بعد بسته میشن.میشه بگید چطور میشه مثل سایت ورزش ۳ به این سبک اطلاع رسانی داشت.مرسی

    • این افزونه با سایت ورزش ۳ متفاوت است ، ساختار این افزونه مطابق روش اعلامی است و در نوین وردپرس نیز پیاده شده است.

  • آی پی رو تغییر دادم درست شد مرسی.فقط یه چیزی چرا افزونه شما فارسی هست ولی افزونه ای که برای دانلود گذاشتید فارسی نیست!!

    پاسخ
  • آقا شرمنده زیاد سوال پرسیدم.فقط به عنوان سوال آخر امکان داره فونت و اندازه فونت رو در این افزونه عوض کنیم

    پاسخ
  • با سلام . تنظیمات افزونه رو به چه صورت انجام دادین که در بدو ورود صفحه پاپ اپ از بالا باز میشه؟ متاسفانه من هر کاری میکنم نیمتونم این کارو کنم و فقط این ایکون قرمز رنگ داره ای شکل ظاهر میشه .

    پاسخ
    • سلام
      تمامی مراحل نصب و پیکره بندی افزونه در توضیحات درج شده است ، با دقت مطالعه کنید افزونه بصورت کامل راه اندازی خواهد شد.

      پیروز باشید.

ارسال دیدگاه

آدرس ایمیل شما منتشر نخواهد شد. فیلد های ضروری با * مشخص شده است.

Tool tip