Demos Buy Now

Marketplace Web Push Notification for Magento 2

Web Push Notification marketplace add-on for Magento2 will allow sellers and the admin to send push notification messages directly to the web browser. The biggest advantage of using push notification is its ability to deliver notification immediately to the subscribed users. Unlike emails that sometimes fail to deliver or go to the spam folder, web push notification’s prompt and assured content delivery feature ensures that the notifications are for sure delivered to the users. As long as the browser is running, a subscribed user will get a pop-up message even without opening your website. This improves the user interaction and retention.

Please Note – This is a marketplace add-on, in order to use this module you need to have Magento2 Marketplace Multi-Vendor module installed.

Features

  • Web Push Notification module is very easy to configure and set up.
  • Compatible with Mozilla firefox and Google chrome desktop browsers.
  • It is designed to work with the SSL (Secure Sockets Layer) certificate websites.
  • There is no monthly subscription fee required to send the notifications.
  • There is no limitation on the number of subscribed users, any number of users can be added.
  • The admin can create, edit and delete notification templates from the back-end.
  • The sellers can create, edit and delete notification templates from the front-end.
  • Any particular subscribed user can be removed from the list if it doesn’t want to receive any further notifications.
  • A custom icon and redirect URL link can be added with the web push notification.
  • Notifications can be sent either to all or selected subscribed users.
  • Search options can be used to find any specific template or subscribed users from the lists.
  • The admin can manage all the subscribed users of the store from the backend.
  • Web Push Notification supports multiple languages translation.

Installation

Download the zip file and extract its content on your computer. The extracted folder will have a folder named src, inside this folder, you will find app folder. Copy this app folder into Magento2 root directory on the server as shown below.

After the successful installation, you have to run these commands in the Magento2 root directory.

First command- php bin/magento setup:upgrade

Second Command – php bin/magento setup:di:compile

Third Command – php bin/magento setup:static-content:deploy

After running these commands, you need to flush the cache from the Magento admin panel by navigating through – System > Cache management as shown below.

After flushing the Cache storage you will get a confirmation message as shown below.

Multi-Lingual Configuration

For Multilingual support, please navigate to Store>Configuration>General >Locale Options. And select your desired language from the Locale option.

Language Translation

If you need to do the module translation, please navigate to the following path in your system app/code/Webkul/MpPushNotification/i18n.
Open the file named en_US.CSV for editing as shown in the below screenshot.

Once you have opened the file for editing. Replace the words after the†comma(,)†on the right with your translated words.

After editing and translating the CSV file, you need to save the translated file name according to your region language and country code such as – de_DE.CSV. Then upload the translated file to the same folder from where you have obtained it. Now your module translation is complete.

Creating Firebase Project Credentials

In order to use this module, the admin needs to have Firebase Project Credentials, which will be used in the Magento2 configuration. Please visit this website https://console.firebase.google.com and create a new project with the Gmail account.

1. After opening Firebase page, please click CREATE NEW PROJECT button as shown in the above screenshot.

2. A small pop-up window will appear with the name of Create a project, here you have to enter your Project Name and then select your Country/Region.

3. After completing the details click CREATE PROJECT button.

4. After creating your new project click Settings menu icon and select Project Settings option. Please view below screenshot. A new Settings page will be opened.

5. After entering the Settings page, click CLOUD MESSAGING tab, here you will find your Project Credentials, copy and save your Sender ID and Server Key as displayed below.

These credentials will be used in the next step of Magento2 configuration.

Module Configuration

After successfully installing this module please log in to the admin account and go to STORES menu and then select Configuration option as shown below.

Configuration page will be opened, navigate to Webkul > MP Push Notification option. From here the admin has to enter the Firebase project credentials. Enter the Server key and Sender Id as shown in below screenshot. Click Save Config button to apply changes.

Admin management

After entering the credentials, click Marketplace Management menu, the admin will find Push Notification Manager menu options i.e. Notification Templates and Send Notification. Please refer to the below screenshot:

Notification Templates

In Notification Templates option, the admin can see all the list of templates created. The admin can create a new template by clicking Create New button. To edit any template click Edit button as shown in below screenshot:

Create New Template

To create a new template Navigate to Marketplace Management > Marketplace Push Notification > Notification Templates and click Create New button as shown in above screenshot. After that admin will arrive at Template Fieldset page where the admin needs to fill out all the necessary information about new notification message. Please click Save Template button to save new template message. Please refer to the below screenshot:

Template Information:

Title – This will be the title of your notification message.

Message – This is where you have to enter the content of your message.

Redirect URL – When the user clicks the notification message it will redirect to new web page link.

Tags – Add tags to your messages to identify them.

Logo – You can upload any supported image file for the notification logo.

Delete Notification Template(s)

To delete notification template(s) navigate to Marketplace Management > Push Notification Manager> Notification Templates. After that select the particular template(s) using the checkbox option. Then go to Actions drop-down menu and click Delete. A confirmation message will appear, click OK.

Send Notification

In Send Notification option, the admin will see a page where it will show information about all the users who have clicked Allow button and agreed to receive notification messages. Here the admin can use Actions menu either to send a new push notification or to delete the user(s). The admin can use Filters option to search users using Id, User Token, Browser and Created at. Please refer to the screenshot below:

Send a New Web Push Notification

To send a new web push notification message, navigate to Marketplace Management > Marketplace Push Notification > Send Notification. After opening Notification Subscribers page, select any registered users using the checkbox or to select all users click the top checkbox near Id column.

Then go to Actions drop-down menu, click Send Notification and select any one template.

A final confirmation message will appear, click OK button.

Delete Registered User:

To delete any of the registered user(s), navigate to Marketplace Management > Marketplace Push Notification > Send Notification. After opening Notification Subscribers page select registered users using the checkbox or to select all the users click the top checkbox near Id column. Then go to Actions drop-down menu and click Delete option.

A final confirmation box will appear, click OK. Please refer to the screenshot below:

Seller End

After logging in to the seller account, there will be two sub-menu options i.e. – Registered Users and Notification Templates will be visible under menu option Push Notification as per the below image

Notification Templates

To manage notification templates click Notification Templates sub-menu option. Here the seller will find all the list of templates, to create a new template message simply click on Create Template button. To edit or delete an existing template click edit or delete icon under Action column. The seller can also search for its templates by entering the title or message in the search field and click Submit. Please refer to the screenshot below:

Create New Template

After clicking the Create Template button, the seller will see the Create New Template configuration page. Here the seller has to fill in the information and click Save button. Please refer the screenshot below:

Template Information:

Title – This will be the title of your notification message.

Message – This is where you have to enter the content of your message.

Redirect URL – When the user clicks the notification message it will redirect to new web page link.

Tags – Add tags to your messages to identify them.

Logo – The seller can upload any supported image file for the logo.

Delete Template(s)

To delete template message(s) navigate to Notification Templates and select your desired template(s) using checkbox. After selecting click Delete Template button at the top or click delete icon under Action column. A final confirmation message will appear on screen, click OK button.

Registered Users

After clicking the Registered Users menu option, the seller will see a page where it will show all the subscribed users of the website who have clicked Allow button and agreed to receive notification messages. The seller can view registered users details, send a push notification. There is also a search option on top, where the seller can find users according to the web browser and subscribe date. Please refer to the screenshot below:

Send a New Push Notification

To send a push notification message, navigate to Registered Users menu option and select the registered users using checkbox menu option. To select all users click the top checkbox near browser column and all the users will be selected. After that, select any one of the templates using the drop-down menu and click Send Notification button. Please refer to the screenshot below:

A final confirmation message will appear, click OK button to send the notification message. Please see the below screenshot:

front-end

After successfully installing Marketplace Web Push Notification module in Magento2, the website users will get a pop-up message on top of their browser window. This pop-up message will ask users to show notifications from your website, the users will have to click either Allow or Block option. Please refer from the below screenshot:

Sample Push Notification

Here’s the sample web push notification message which will appear on the front-end.

Please note: – If a seller or the admin select all the users and sends a web push notification message, that message will be seen by all the registered users of the website. 

For any further query or more information about this module please feel free to contact http://webkul.uvdesk.com/

Current Product Version - 2.0.2

Supported Framework Version - 2.0.x,2.1.x,2.2.x

. . .

Comment

Add Your Comment

Be the first to comment.

css.php
Hire Us!
Brief us about your requirements and we'll get back to you.
Woo! Hooy!
We have just recieved your project brief and our expert will contact you shortly.
Send Again
Close

Index