Web Push Notification for Shopware 6

Shopware 6 Web Push Notification is an amazing extension, the store owner can send real-time push notifications messages to its customers. The biggest advantage of using push notification is its ability to deliver messages immediately. These messages can contain any information such as new product launch, new offers, discounts, important news. Web push notification’s prompt and assured content delivery feature ensures that the notifications are for sure delivered and seen.

• Web Push Notification module is very easy to configure and set up.
• There is no monthly subscription fee required to send the notifications.
• The admin can create, edit and delete notification templates from the back-end.
• Redirect URL links can be added with the web push notification.
• Notifications can be sent by selected subscribed users.

Shopware provides two ways to upload the plugin to the server.

1. Using Command
2. Manual Installation

Installation using commands

Customers will get a zip folder, and they have to extract the contents of this zip folder on their system. After extracting the WebkulWPN folder, the customer needs to transfer this custom > plugins on the server, as shown in the image below:

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

Go to your Shopware installation Root directory then run this command to install then activate the plugin –

./bin/console plugin:install --activate WebkulWPN.

To installing the assets(CSS/JS)

./bin/console assets:install

To clear the cache run this command –

php bin/console cache:clear

Now refresh the administration.

After that, visit administration Setting->System->Plugins, the Web Push Notification for Shopware 6 plugin will be listed there.

Manual Installation

For the manual installation of the plugin follow the steps as mentioned below:

Step 1: In the Shopware6 Backend go to plugin manager by navigating to Settings > System > Plugins.

Step 2: Just after clicking on the Plugins, the My plugins page will appear. The existing plugins are visible here. 
Click on the Upload plugin to add a new plugin to the list. Select the zip folder of the plugin which has to be updated.

Step 3: After that, the recently uploaded plugin will be visible on the top of the list of plugins in My plugins page. 
Further, in the newly added plugin, two actions can be performed which are:  Install and Delete.

The admin will install the plugin by clicking on the Install option in the dropdown.

Once the plugin gets installed the success message will popup saying “Your plugin has been installed.”
Step 4: After the installation, the admin will activate the plugin by turning the radio button ON.

After the installation, run this command to clear the cache:

php bin/console cache:clear

To use Web Push Notification for Shopware 6, you need to have Firebase Project Credentials. It is required during module configuration. Please click here then create a new project with your Google account.

1.  After opening the Firebase page. Please create a project by clicking the Add project button.

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

Then click the Create Project button.

3. After creating your new project click the Settings menu icon.

Then select Project Settings option. After that a new Settings page will open.

4. After entering the Settings page, go to the Cloud Messaging tab. From here you will find your Project Credentials. Copy then save your Server Key and Sender ID as visible below.

After installing this module please login to your Magento backend admin panel then follow Setting>>System>>Plugin>>Configuration.

Here you have to enter your Firebase project credentials. Enter the Server key and Sender ID as shown in the below screenshot.

After that click the Save Config button to apply changes.

Once you have installed this module, you will find a Web Push Notification menu option on the left. Click it.

Then you will see the new menu that is the Manage template.

Creating A New Manage Template

After clicking the Manage Templates option you will find all the push notification messages created. Here you can find template title, message, redirect URL, logo, tags, creation date and time. The admin can add, edit or delete notification messages.

Now to create a new push notification message, click on Add Templates

After clicking the Add Templates button you will arrive at the Template Fieldset page. Here you need to fill out all the necessary information about your new template.

Then click to Save button

Template Fieldset:

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

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

Redirect URL – The web page link will be displayed on the notification message.

Template Tags – Add tags to your messages to identify them.

Template Logo – You can upload any customized logo for the notification.

Send Web Push Notification

After creating the template there will be two options edit and send. With the help of the edit, you can edit the created template.

Click on the Send button to send the notification.

After the installation of the module when a user visits your website, it will see a push notification. This first push notification will ask users whether to allow or block notifications. The users have to click the Allow button to receive notifications from your website. Please refer from the below screenshot:

Sample Push Notification

Please see the below screenshot to see how your push notification will appear on the front-end. Template Title, Template Logo, Template Message and the Redirect URL are visible to the users.

That’s all about Web Push Notification for Shopware 6 Share module, still, you have any query, please raise a ticket at- https://webkul.uvdesk.com/en/customer/create-ticket.