Skip to content

Push Notification WordPress plugin in php, javascript using Firebase httpv1 for websites, Android/IOS mobile apps with PWA progressive web app

License

Notifications You must be signed in to change notification settings

muraliwebworld/push-notification-plugin-for-wordpress-websites

Repository files navigation

Push Notification WordPress plugin for websites, Android and IOS mobile apps with Progressive Web App (PWA)

WordPress plugin to send push notifications using Firebase Cloud Messaging (FCM) to websites, Android / iOS mobile apps. It sends push notifications using Firebase Cloud Messaging (FCM) using legacy or latest version of httpv1 Firebase api or users can select Onesignal / Progressier / webtoapp as push notification providers. It has REST API facility to integrate with native/hybrid Android / iOS mobile apps for push notifications. It has facility to generate PWA - Progressive Web App. This plugin is able to send push notification to more than 200,000 subscribers unlimited push notifications using background action scheduler.

Download this plugin

https://wordpress.org/plugins/push-notification-for-post-and-buddypress/

Features

Push notifications providers

Plugin allows to choose different push notification providers

  1. Firebase (Free push notifications for desktop, PWA and mobile apps)
  2. Onesignal (Free push notification for desktop, PWA and mobile apps)
  3. Progressier (Push notifications for PWA)
  4. webtoapp (Push notifications for Mobile apps)
    (Plugin allows to send push notifications to both Firebase/Onesignal and webtoapp users simultaneously)

Plugin sends Push notifications for following,

  1. New post/custom post type published (including bbpress).
  2. New BuddyPress activities published.
  3. New BuddyPress group activity published (only to members of group).
  4. Notifications for BuddyPress mentions in activities.(only to recipient).
  5. BuddyPress group invite sent (only to recipient).
  6. BuddyPress group details updated.
  7. New Buddypress comments published.
  8. New BuddyPress message or private messages (only to recipient).
    (It is also compatible with Bettermessages plugin).
  9. New BuddyPress member joined.
  10. For Friend request in BuddyPress (only to recipient).
  11. Friendship accepted in BuddyPress (only to requestor).
  12. User avatar change in BuddyPress.
  13. Cover image change in BuddyPress.
  14. Supports Push notifications for BuddyBoss and Better Messages plugins
  15. Woocommerce custom post type push notifications.
  16. Ability to process more than 200,000 subscribers unlimited push notifications using background action scheduler.

Admin only push notifications (only to administrators)

  1. When contact form(contactform7 plugin) submitted.
  2. When new user registered in site.

Notifications only for loggedin users

Enable/Disable option in admin settings to send push notifications using Firebase httpv1 or Onesignal only for loggedin users.

Custom popup and Bell prompt to subscribe push notifications with subscription options

Enable/Disable custom prompt with icon to subscribe/unsubscribe push notifications in front end in admin settings.
Choose Horizontal or Vertical custom prompt style and customize the text, color and button.
Enable/Disable Bell prompt icon to subscribe/unsubscribe notifications. Front end users will be able to subscribe to particular category like post, activity, comments, friendship request/accept, other options while subscribing for first time or if user wants to update subscribe options from bell prompt at any time it is needed.

Shortcodes

Use shortcode [member name] and [group name] in push notification title and custom content to display user name in title/content in push notifications, similarly for BuddyPress group activities [group name] place holder is available to display group name in title/content in push notifications.
For front end users Shortcode [subscribe_PNFPB_push_notification] is available to Subscribe/Unsubscribe push notifications

Subscribe/Unsubscribe various push notifications in front end

Front end push notification menu is available for BuddyPress Front end users to subscribe/unsubscribe various push notifications according to their choices. This menu is available in user profile – settings area. For other users, shortcode is available to display subscription menu for Front end users to subscribe/unsubscribe various push notifications according to their choices.

Scheduling Push notification

It allows Scheduled Push notifications to send push notifications hourly(every hour), twice daily(2 times per day), daily, weekly as per WordPress CRON. It also provides option to schedule push notification in background using action scheduler, this will be useful to send notification more than 100000 subscribers simultaneously in background mode.
Push notification scheduling is available for On demand/One time, WordPress Post, BuddyPress activities, BuddyPress group activities and for BuddyPress comments.

REST API

REST API to connect mobile native/hybrid apps to send push notification from WordPress site to both mobile apps and WordPress sites.
Using this REST API WordPress site gets Firebase Push Notification subscription token from Mobile app(Android/Ios).
This allows to send push notifications to WordPress site users as well as to Native mobile app Android/ios users.
REST API url is https://wp-json/PNFPBpush/v1/subscriptiontoken

HOW TO USE PLUGIN API TO INTEGRATE MOBILE APP PUSH NOTIFICATION

Android app code to integrate with this plugin
IOS app code to integrate with this plugin

Refer video tutorial under “How to use this plugin” section to configure Firebase options in plugin admin area.

PWA Progressive Web App

This plugin has facility to generate Progressive Web App (PWA). It also supports Progressier PWA.
Go to plugin settings page to enable/disable PWA app and to customize PWA app with app name, app icon, app theme color, background color for PWA and list of pages to be included in offline cache for web app offline mode.

Extra settings for NGINX server

If server is NGINX and not able to create dynamic service worker file https://pnfpb_icpush_pwa_sw.js & PWA manifest json file https://pnfpbmanifest.json then go to plugin settings->nginx tab, enable static file creation option, it will create required static service worker file, PWA manifest json files in root folder. This option is applicable only if hosting/server is based on NGINX and not creating dynamic service worker file, manifest json files. By default, this plugin creates dynamic service worker file and PWA manifest json file.

This plugin uses Firebase Cloud Messaging to send push notification using Firebase registration credentials which is free of cost.

Plugin Demo site

https://www.muraliwebworld.com

Video tutorial showing how to configure Firebase for this plugin

https://www.youtube.com/watch?v=02oymYLt3qo

Integrate Native mobile apps like Flutter mobile app with this WordPress plugin

New API to send push notification subscription from Native mobile apps like Flutter mobile app to WordPress backend and to send push notifications from WordPress to Native mobile app using Firebase.

  1. Generate secret key in mobile app tab to communicate between mobile app(in Integrate app api tab plugin settings)
  2. REST api to send subscription token from Mobile Flutter app using WebView to this WordPress plugin to store it in WordPress db to send push notification whenever new activities/post are published.

Note:- All REST api code is already included in the code, below is only for reference as guide,

REST API using POST method, to send push notification in secured way using AES 256 cryptography encryption method to avoid spams

REST API url post method to send push notification
https://domainname.com/wp-json/PNFPBpush/v1/subscriptiontoken

Input parameters in body in http post method in Flutter APP,
token – it should be encrypted according to AES 256 cryptography standards,

Following is sample code in dart Flutter AES 256 encryption and hash generation using AES 256 cryptography to send push notification subscription token in encrypted manner to this plugin - WordPress backend

String strPwd = "16234hgJKLmllpdcd09b2bc37293"; //secret key generated in step 1 above

      GlobalData.pushtoken = token.toString();

      final iv = EncryptPack.IV.fromLength(16);

      final key = EncryptPack.Key.fromUtf8(strPwd); //hardcode

      final encrypter = EncryptPack.Encrypter(EncryptPack.AES(key, mode: EncryptPack.AESMode.cbc));

      final encrypted = encrypter.encrypt(token.toString(), iv: iv);

      var hmacSha256 = CryptoPack.Hmac(CryptoPack.sha256,ConvertPack.utf8.encode(strPwd)); // HMAC-SHA256

      var hmacstring = hmacSha256.convert(ConvertPack.utf8.encode(token.toString()));

      var encryptedsubscription = encrypted.base64+":"+iv.base64+":"+hmacstring.toString()+":"+hmacstring.toString();

Using secret key generated from step 1, enter secret key in flutter app code as below in push_notification_manager.dart file (attached link for lib folder),

store token in global variable for other user
Generate envrypted token as mentioned below using below coding (AES 256 cryptography encryption)
Once plugin receives this token, it will unencrypt using the secret key generate and compare hash code to confirm it is sent from Flutter app

Scheduling push notifications

It allows to Schedule Push notifications to send as per below schedule using WordPress CRON scheduler hourly(every hour)
,twice daily(2 times per day)
, daily
, weekly
Firebase PUSH API is not compatible with Safari browsers and push notification using firebase push api will not work in Safari browsers. For Safari browsers,this plugin will display console log messages to indicate the browser is not supported for push api.
Service workers are created on the fly for Firebase Cloud Messaging while activating the plugin
In addition to default subscription from browser, following shortcode can also be used to display toggle subscription button.
New Shortcode [subscribe_PNFPB_push_notification] to display Subscribe/Unsubscribe push notification toggle button.
Using above shortcode, toggle button to subscribe/unsubscribe can be added to sidebar or any other locations according to your need.
The shortcode [subscribe_PNFPB_push_notification] is optional, it is a additional facility to subscribe to push notification inaddition to default option from browser.

On demand or One time push notification to all subscribers

Go to plugin admin area on demand push notification to send one time notification or to schedule multiple one time notifications to start at different date and time or schedule multiple campaigns to start at different date and time with image to all subscribers

How to configure plugin

https://wordpress.org/plugins/push-notification-for-post-and-buddypress/

Following are steps to configure the plugin,

  1. Download the plugin
  2. Activate the plugin
  3. Go to settings of the plugin (in admin menu -> Settings -> Push Notification using FCM)
  4. Enable/Disable push notification for following,
    4.a. new post types,
    4.b. new custom post types (including bbpress),
    4.c. BuddyPress activities,
    4.d. BuddyPress Group members,
    4.e. BuddyPress messages,
    4.f. BuddyPress comments
    4.g. New BuddyPress member joined
    4.h. Friend request in BuddyPress
    4.i. Friendship accepted in BuddyPress
    4.j. User avatar change in BuddyPress
    4.k. Cover image change in BuddyPress
    When BuddyPress Group Members option is enabled, it will send push notification only to users who joined in Group/to Particular group members.
    When Buddypress private message notification is enabled, Private message notification will be sent only to the recipient id sent by sender. Admin can customize the text for push notification title from admin options.
  5. Configure Firebase settings as per below steps,
  6. Sign in to Firebase, then open your project click settings icon & select Project settings
  7. To get Firebase server key, select project settings from Firebase account, go to cloud messaging tab, get server key fill below first field under firebase configuration
  8. For remaining fields, you need to get it from your Firebase web app. All fields are required to configure FireBase push notification.
  9. In the Your apps card, select the nickname of the Firebase web app for which you need a config object.
  10. Select Config from the Firebase SDK snippet pane and fill below fields
  11. After saving below fields, it will ask to allow notification for this website in browser default popup, click on allow notification to get notifications
    After completing above steps, push notification will be displayed based on option selected for posts/buddypress while publishing posts or custom post types or during new BuddyPress activities or comments.
  12. New Shortcode [subscribe_PNFPB_push_notification] can also be used to display Subscribe/Unsubscribe push notification toggle button. It is a additional facility in addition to default option from browser to subscribe/unsubscribe push notifications.

  13. Go to PWA settings in plugin admin area and fill all required fields to customize and generate PWA app with offline facility.If pages are included for offline cache then users will be able to view those pages in offline mode without internet if page is not stored in cache then default offline page will be displayed.

Screenshots

screenshot-1push screenshot-2 screenshot-7 screenshot-6push push-private-message2