Progressive Web App for WordPress module provides users an app-like interface in which they can experience the high-performance benefits of the store either online or offline. There will be push notifications that can be sent to a user via desktop web and mobile web to re-engage on your website.
Admin will be able to configure any site like e-commerce (WooCommerce) or blogging (Simple WordPress) in Progressive Web App (PWA) with this plugin. Users will be able to come to your site by launching the app from their mobile and can interact with your site through an app like interface. Push Notifications can be based on WordPress and WooCommerce like new published blogs, products, sale products, offers, instock reminders, etc.
Note: This Progressive Web App (PWA) plugin is compatible with both WordPress and WooCommerce.
Features of Progressive Web App for WordPress
- Progressive Web App (PWA) increases the performance of your site.
- Users will be able to download the PWA app for your store.
- Your site can be cached at client’s end for offline view.
- Desktop app is also supported for chrome v76 and above.
- Analytics report for the PWA installations.
- Analytics report for the subscribers who have allowed notifications for your site.
- Admin can enter name, shortname and choose background and theme color for the PWA.
- Admin can upload the PWA icons from backend.
- Users can allow/block the notifications for your site.
- Admin can send push notifications to the users who have allowed the notifications.
- Unlimited number of notifications and subscribers.
- Admin can add, edit and delete notifications from the Progressive Web App menu at admin end.
- Admin can enter title, description, url and choose image for the notification content.
- All WordPress and WooCommerce themes are supported with the PWA.
- Multilingual is also supported with the given .pot file in the plugin.
Note: Secure server (https) should be needed in order to use this plugin.
Why choose our plugin?
All our products are meeting the WordPress quality standards including security, quality, performance and modern coding standards. For this, We are also awarded with WP Requirements Compliant Badge by Envato for our CodeCanyon Profile.
Installation of Progressive Web App for WordPress
The customer has to login at the admin end in WordPress and in the menu section, he has to hover his mouse over the Plugins menu which brings out a submenu, then click on the Add New submenu.
Then he needs to click on the Upload Plugin button to upload the plugin zip file.
After clicking Upload Plugin button, you will be able to see the below image. Then click on Choose File button to browse the plugin.
Then, when you select the Progressive Web App for WordPress plugin zip, your selected zip appears here. Now, finally click on Install Now button to install the plugin.
After installing the plugin, click on Activate Plugin to activate the Progressive Web App for WordPress plugin.
Creating Firebase Project Credentials for Push Notifications
In order to use this module for push notifications, you need to have Firebase Project Credentials which you need to enter in the module configuration. In order to create them, kindly visit this link https://console.firebase.google.com/ and follow the below steps.
Click on Create a Project button to create a Firebase Project.
Now, enter Project name, check on I accept the Firebase terms and click on Continue.
Then enable Google Analytics for your project and click on Continue.
Then on last step, check all the boxes and click on Create Project.
After few seconds, you’ll get a confirmation page when your project is ready to use, then click on Continue.
After creating your new project click on the Storage.
Then on click on Get Started button.
Then click on Next button.
Then click on Project Overview and click on Add an app to get started button.
Now, Enter the App nickname, check the Firebase Hosting option and click on Register app button.
Then click on Next button.
Now, again click on Next button.
Then click on Continue to console button.
Now go to the Project Overview section and click on the App nickname that you just added and then click on settings icon.
On General tab, you’ll find your added apps down below in which there is a section of Firebase SDK snippet. In this section, click on Config option to get the Firebase Config.
Now, go to the Cloud Messaging tab, here you’ll find server key which is going to be used as Google Authorization Key in the module and the Sender ID which will be GCM Sender ID.
Copy Firebase Config, Server Key and Server ID, these will be used in the module configuration.
Admin End – Progressive Web App for WordPress
Now click on Configuration to visit the configuration page of the plugin or you can also hovers on Progressive Web App admin menu, he/she is able to see 2 submenus i.e. Notifications and Configuration. Click on the Configuration to visit the configuration page.
Then, Admin can see the configuration page.
Here, You need to enter the purchase code to activate your license in order to use this plugin.
Google Authorization Key:
This is the server key from the firebase which will be used in sending push notifications.
GCM Sender ID:
This is the Sender ID from the firebase which will be used in sending push notifications.
Admin can set the name of the app from here.
Here, Admin can set the short name of the app from here.
Admin can select the theme color for the app from here.
Admin can select the background color for the app from here.
Here, Admin need to upload the icons for the app in the respective image sizes.
Push Notifications – Progressive Web App for WordPress
Here, admin can see the list of added notifications from where he can perform some operations i.e. search or edit any previously added notifications, delete any notification or send notification to the users.
Admin can add new notifications from this page.
Title will be displayed in the push notification to the users.
Description will be displayed in the push notification to the users.
Admin need to upload or can select previously uploaded image which will be displayed in the push notification to the users.
Admin need to enter the URL for which users gets redirected when they click on the push notifications.
This is the status of the notification which can be either Enabled or Disabled.
Analytics – Progressive Web App for WordPress
Here, Admin can see the analytics reports for the PWA installations and the subscribers which have allowed notifications on your site. Admin can see the recent 15 days data in the report.
Customer’s End – Progressive Web App for WordPress
Progressive Web Desktop App:
Customers can visit your site and able to download the app from this + icon as shown in the below image. Then, the app is added in customer’s desktop and he/she able to use your site with the app.
Progressive Web Mobile App:
When customer visits your site in the mobile browser, he/she will see the popup to add the PWA to your Home screen option from which he’s able to add the PWA and use the app interface for your site. Steps are mentioned in the below images.
After adding the app, users will see the app in their mobile home screen as shown in below image through which they can access your site.
When Admin sends any notification from backend, users who have allowed notifications will receive the notifications on their mobile phone as well as desktop.
After clicking the notification, app will get open with the URL set in the notification by Admin.
Multilingual – Progressive Web App for WordPress
Admin can use .pot file which is provided within the plugin in the languages folder from which they can translate the plugin.
If you have any questions/queries with the plugin or need any special customizing, please contact us at [email protected]. We will do our best to answer as quickly as possible.