نمایش دادن notification روی دسکتاپ کاربر در وردپرس

ن نمایش دادن notification در دسکتاپ امروزه به یکی از اجزای اصلی بسیاری از وب سایت ها تبدیل شده است. نمایش دادن notification در دسکتاپ کاربر می تواند به شما اجازه دهد که حتی زمانی که مرورگر کاربر باز نیست اعلان خود را نمایش دهید. به همین دلیل است که نمایش دادن notification از روش های بسیار کاربردی و مناسب برای نمایش آگهی های تبلیغاتی و بازاریابی آنلاین محسوب می شود.

به دلیل اهمیت این موضوع ما قصد داریم در این مقاله شما را با نحوه نمایش notification در دسکتاپ کاربر آشنا کنیم. با ما همراه باشید.

چرا باید از نمایش دادن notification در دسکتاپ کاربر استفاده کنیم؟

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

آموزش ایجاد web push notification

در زبان  انگلیسی به این اعلان ها به طور کلی  Web push notification گفته می شود. و علاوه بر کامپیوتر ها قابلیت نمایش در موبایل ها را نیز دارند. به دلیل بازدهی مناسب و بالای درصدی نمایش دادن notification در دسکتاپ کاربران، بسیاری از سایت های معروف نظیر فیسبوک، توییتر، لینکداین و … از این روش برای نشان دادن اعلان ها و پیام ها به کاربران خود استفاده می کنند.

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

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

فعال کردن Web push notification در وردپرس با OneSignal

زمانی که می خواهید از نمایش دادن notification در دسکتاپ استفاده کنید باید ابزار مناسب این کار را نیز داشته باشید. بهترین و قوی ترین ابزار در این زمینه onesignal است.

برای استفاده از قابلیت های onesignal باید این افزونه را به سایت وردپرسی خود اضافه کنید. برای اینکار به راحتی می توانید این افزونه را دانلود و فعال کنید.

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

نمایش دادن notification

صفحه تنظیمات این افزونه به دو سربرگ Setup و Configuration تقسیم می شود. سربرگ Setup شامل یک راهنما برای راه اندازی notification های شما است. در این مقاله سعی می کنیم تمام مطالبی که در این راهنما مشاهده می کنید را آموزش دهیمو
همانطور که مشاهده می کنید برای فعال کردن OneSignal باید API key و application ID های مختلفی را پیدا کرده و در صفحه تنظیمات افزونه وارد کنید.

در ادامه بخوانید:
افزودن پشتیبانی به قالب وردپرس

نحوه نمایش دادن notification در دسکتاب برای سایت های وردپرسی

در ادامه مراحل نمایش دادن notification را با یکدیگر بررسی خواهیم کرد.

ایجاد google key

برای ایجاد کلید گوگل باید در ابتدا به سایت Google Services Wizard مراجعه کنید. دقت کنید که به دلیل تحریم ها شما نمی توانید با آی پی ایران وارد این سرویس گوگل شوید. به همین دلیل باید از نرم افزار های تغییر آی پی استفاده کنید.

ساختن Google Key

در ااین صفحه شما ابتدا باید در قسمت App name یک نام برای اپ یا سرویس خود ایجاد کنید. همچنین در قسمت Android package name هم نامی انتخاب کنید. OneSignal از نامی که در قسمت Android package name وارد می کنید استفاده نمی کند. با این حال چون باید این گزینه را پر کنید مجبورید یک نام دلخواه برای آن انتخاب کنید.

در ادامه باید از قسمت Your country/region نام کشور خود را انتخاب کنید. در نهایت روی گزینه  ‘Choose and configure services’ کلیک کنید، تا وارد صفحه انتخاب سرویس مورد نظر خود شوید.

با وارد شدن به این صفحه شما می توانید سرویس های گوگلی که نیاز دارید و می خواهید از آن ها در پروژه های خود استفاده کنید را انتخاب کنید. برای فعال سازی سرویس مورد نظر ما باید روی گزینه ‘Enable Google Cloud Messaging’ کلیک کنید.

نمایش دادن notification روی دسکتاپ کاربر

با انجام این کار شما می توانید server API key و Sender ID خود را مشاهده کنید.

نمایش notification روی دسکتاپ کاربر در وردپرس

عبارت های مربوط به این دو را ذخیره کنید. در مراحل بعدی از این مقدار ها استفاده خواهیم کرد.

تنظیم نمایش دادن notification در مرورگر های گوگل کروم و موزیلا

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

زمانی که حساب کاربری خود را ایجاد کردید، باید وارد پنل خود شده و روی گزینه ‘Add a new app’ کلیک کنید.

نشان دادن notification روی دسکتاپ کاربر در وردپرس

با کلیک بر روی این گزینه، شما یک پنجره پاپ آپ را مشاهده خواهید کرد و می توانید در آن یک نام دلخواه برای App خود وارد کنید. هر نامی می خواهید وارد کنید. سپس روی Create کلیک کنید.

ایجاد اعلان در دسکتاپ کاربر در وردپرس

با مشاهده این صفحه شما باید بر روی گزینه Website Push کلیک کنید.

آموزش افزونه OneSignal

در این مرحله شما نیاز دارید که پلتفرم مرورگر را انتخاب کنید. شما در اینجا دو باکس شامل باکس مربوط به موزیلا و فایرفاکس و باکس مریوط به سافاری را مشاهده خواهید کرد. باید روی باکس Google Chrome and Mozilla Firefox کلیک کنید. البته نحوه انجام تنظیمات برای سافاری را بعدا در همین مقاله آموزش خواهیم داد.

نشان دادن اطلاعیه در دسکتاپ کاربر از طرف سایت

حالا می توانید برای ادامه بر روی next کلیک کنید.

در گام بعدی باید آدرس سایت وردپرسی خود، Google Server API key و URL عکس آیکون پیشفرض خود برای notification را وارد کنید.

در ادامه بخوانید:
تغییر رنگ تصادفی پس زمینه وردپرس

نشان دادن notification روی دسکتاپ کاربر

اگر سایت شما از SSL/HTTPS پشتیبانی نمیکند باید گزینه My site is not fully HTTPS را انتخاب کنید.

با این که گوگل کروم از سیستم web push notification برای سایت هایی که https نیستند پشتیبانی نمی کند، اما خوشبختانه افزونه OneSignal با روش هوشمندانه ای این مشکل را برطرف کرده است.

در صورتی که گزینه My site is not fully HTTPS را انتخاب کنید، تنظیمات HTTP fallback برای شما قابل مشاهده خواهد بود. در این مرجله باید از قسمت Choose Subdomain زیر دامنه ای برای خود انتخاب کنید. این هم یکی دیگر از فیلد های ضروری است که باید پر کنید، اما مهم نیست چه چیزی در آن می نویسید. ما پیشنهاد می کنیم نام سایت خود را وارد کنید.

سپس در قسمت Google Project Number شما باید از  Sender ID که در قدم اول دریافت کرده بودید استفاده کنید.  یکی از آن دو عبارتی که در مرحله اول ذخیره کردیم Sender ID بود.

نشان دادن اطلاعیه روی دسکتاپ کاربر در وردپرس

حالا باید روی Save کلیک کنید. سپس کادر را با کلیک کردن روی علامت ضربدر ببندید. در کادری که برایتان باز می شود روی Yes کلیک کنید تا بسته شود.

نحوه دریافت OneSignal Key

در این مرحله باید OneSignal Key را برای سایت خود دریافت کنید. از dashboard اپ خود روی App Settings کلیک کنید.

تنظیمات اپ در OneSignal

وارد صفحه تنظیمات اپ میشوید. در این صفحه روی تب Keys & IDs کلیک کنید.

نشان دادن notification روی دسکتاپ کاربر در وردپرس

حالا OneSignal App ID و Rest API Key خود را مشاهده می کنید.

OneSignal

این دو عبارت را باید در تب Configuration از صفحه تنظیمات افزونه OneSignal در سایت خود وارد کنید. در ابتدای صفحه مربوط به  تنظیمات افزونه دو قسمت  با نام های App ID و Rest API Key قرار گرفته که باید پر شوند. علاوه بر این دقت کنید که در فیلد OneSignal Subdomain  باید زیر دامنه ای که در مرحله دوم ایجاد کرده بودید را وارد کنید.

 فعال کردن نمایش دادن notification برای سافاری

همان طور که قبلا در مرحله فعال کردن notification برای کروم و موزیلا قول داده بودیم، اکنون نوبت آن است که اعلان هایی که می سازیم در سافاری هم به نمایش در آیند.

وارد اکانت OneSignal خود شده و روی گزینه App Settings کلیک کنید. در صفحه App Settings و در پایین صفحه بخشی به نام web platforms قرار دارد. با پیدا کردن این بخش بر روی گزینه Configure موجود در کنار گزینه Apple Safari کلیک کنید.

نشان دادن اطلاعیه در دسکتاپ کاربر در سافاری

کادری برای شما باز میشود که باید نام سایت و آدرس سایت خود را در آن وارد کنید.

نشان دادن notification روی دسکتاپ کاربر در وردپرس

حالا باید گزینه I’d like to upload my own notification icons را انتخاب کنید.

در پنجره باز شده باید آیکون اعلانیه خود را در سایز های مختلف آپلود کنید. این آیکون هنگام نمایش دادن notification در دسکتاپ، به نمایش در می آید. از فتوشاپ یا هر نرم افزار ویرایش تصویر دیگری می توانید برای ایجاد سایز های مورد نظر کمک بگیرید. سپس روی  Choose File کلیک کنید تا آن ها را آپلود کنید.

نمایش notification روی دسکتاپ

بعد از پاین کار بر روی Save کلیک کنید و در نهایت پنجره را ببندید.

در ادامه بخوانید:
نمایش نقش نویسنده در مطالب وردپرس (مدیر، ویرایشگر، نویسنده و …)

صفحه App Settings را رفرش کنید تا تنظیمات وارد شده نمایان شوند و دوباره  به پایین صفحه رفته و بخش Web Platforms پیدا کنید. حالا Web ID خود را در زیر Apple Safari  می بینید.

Web ID

این Web ID را کپی کرده و در صفحه تنظیمات افزونه OneSignal در تب Configuration  در  قسمت Safari Web ID آن را وارد نمایید .

با انجام این مرحله تنظیم نمایش دادن notification در دستکاپ برای مرورگر سافاری به اتمام رسید.

مرحله آخر و تست کردن نمایش  دادن notification در دسکتاپ برای سایت وردپرسی

به صورت پیشفرض OneSignal یک دکمه اشتراک به سایت شما اضافه می کند. سایت خود را با یکی از مرورگر های پشتیبانی شده (کروم، فایرفاکس، سافاری) باز کنید و روی subscribe کلیک کنید.

فعال کردن سیستم نمایش اطلاعیه در دسکتاپ کاربر از طرف وردپرس

پیغام ‘thank you for subscribing’ برای شما نمایش داده می شود.

حالا وارد اکانت OneSignal خود شده و روی نام اپ خودتان کلیک کنید. سپس روی گزینه App Settings کلیک کنید. به پایین اسکرول کنید تا به بخش web platforms برسید. سپس روی دکمه Configure موجود در جلوی گزینه Google Chrome and Firefox کلیک کنید.

نشان دادن اطلاعیه روی دسکتاپ کاربر

بخش تنظیمات پلتفرم خود که قبلا کامل کرده بودید را در اینجا مشاهده می کنید. روی Save کلیک کنید و برای ادامه روی Continue کلیک کنید.

OneSignal

در این مرحله  Wordoress را انتخاب کنید.

testing web push

روی Next کلیک کنید تا وارد گام Test Settings شوید.

روی گزینه  Send Test Notification کلیک کنید.

فرستادن notification به دسکتاپ کاربر از طرف وردپرس

OneSignal اکنون یک notification یا اطلاعیه آزمایشی را برای شما می فرستد. ظاهر نوتیفیکیشن ممکن است با توجه به نوع مرورگری که با آن اشتراک خود را فعال کردید فرق کند. بعد از نمایش دادن notification در دسکتاپ خود بر روی آن کلیک کنید.

فرستادن اطلاعیه به کاربران در وردرپرس

این کار شما را به صفحه ای هدایت میکند که پیغام موفقیت آمیز بودن نصب Web Push Notification را در آن می بینید.

آزمایش کردن web push notification

نحوه نمایش دادن notification روی دسکتاپ کاربران وردپرس با OneSignal

این افزونه به صورت خودکار، پس از هر مطلبی که منتشر میکنید، یک اطلاعیه یا notification به همه کاربرانی که مشترک شده اند ارسال می کند.

شما همچنین میتوانید یک اطلاعیه را به صورت دستی و دلخواه برای کاربرانتان بفرستید. وارد اکانت OneSignal خود شوید و روی نام اپ خود کلیک کنید. از منوی سمت چپ روی دکمه New Message کلیک کنید.

ارسال notification در وردپرس به کاربران

پنجره ای برای شما باز می شود که باید عنوان و متن اعلانیه خود را وارد کنید.

نشان دادن نوتیفیکیشن به کاربران در دسکتاپ

همچنین میتوانید روی گزینه های Options, Segment, Schedule/Send Later کلیک کنید تا شخصی سازی بیشتری انجام دهید. مثلا یک لینک برای نوتیفیکیشن خود ایجاد کنید تا آن را زمانبندی کنید و … .

جمع بندی

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

از کارشناسان پرگاس انفورماتیک مشاوره تخصصی بگیرید

نرم افزار باشگاه مشتریان, طراحی سایت اختصاصی، نرم افزار مالی سپیدار

۵۶ ۲۸۴ ۲۸۴ (۰۲۱)