DevDiggers

WordPress Progressive Web App plugin is an innovative solution for e-commerce or blogging websites running on the WordPress platform. It transforms your website into a fully-functional Progressive Web App (PWA), providing users with a fast, reliable, and engaging experience, regardless of their network connection or device.

The WordPress Progressive Web App plugin is easy to install and use, requiring no special technical skills or coding experience. Once installed, the plugin enhances your website’s functionality, making it work like a native app on mobile devices, while maintaining the full functionality of your WooCommerce and WordPress websites.

One of the key benefits of the WordPress Progressive Web App plugin is its speed and reliability. PWAs use advanced technologies to deliver lightning-fast load times, even on slow network connections. This provides a seamless experience for users, regardless of their location or device, and helps to reduce bounce rates and increase conversions.

The WordPress Progressive Web App plugin also offers an enhanced user experience, with features such as push notifications, offline access, and a sleek, intuitive interface. This helps to improve user engagement and keeps customers coming back for more.

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. There will be push notifications that can be sent to a user via desktop web and mobile web to re-engage on your website. Push Notifications can be based on WordPress and WooCommerce like new published blogs, products, sale products, offers, instock reminders, etc.

In addition to these benefits, the WordPress Progressive Web App plugin is also highly secure, using industry-standard encryption technology to protect user data and transactions. The plugin is regularly updated to ensure that it remains compatible with the latest security and performance standards.

Another major advantage of the WordPress Progressive Web App plugin is its affordability. Unlike traditional native mobile apps, PWAs are relatively cheap and easy to develop, making it a cost-effective solution for e-commerce businesses looking to expand their reach and engage with their customers in new ways.

Overall, the WordPress Progressive Web App plugin is an excellent solution for e-commerce businesses looking to enhance their website’s functionality and user experience. With its fast and reliable performance, intuitive interface, and enhanced security features, this plugin is the ideal choice for anyone looking to take their WooCommerce or WordPress website to the next level.

Note: This WordPress Progressive Web App plugin is compatible with both WordPress and WooCommerce.

Features of WordPress Progressive Web App

  • 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 WordPress Progressive Web App

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.

Add new plugin

Then he needs to click on the Upload Plugin button to upload the plugin zip file.

Upload new plugin

After clicking Upload Plugin button, you will be able to see the below image. Then click on Choose File button to browse the plugin.

Choose WordPress Progressive Web App zip

Then, when you select the WordPress Progressive Web App plugin zip, your selected zip appears here. Now, finally click on Install Now button to install the WordPress Progressive Web App plugin.

Install the WordPress Progressive Web App plugin zip

After installing the plugin, click on Activate Plugin to activate the WordPress Progressive Web App plugin.

Activate WordPress Progressive Web App 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.

Step 1:

Click on Create a Project button to create a Firebase Project.

Push Notifications Firebase setup step 1

Now, enter Project name, check on I accept the Firebase terms and click on Continue.

Push Notifications Firebase setup step 2

Then enable Google Analytics for your project and click on Continue.

Push Notifications Firebase setup step 3

Then on last step, check all the boxes and click on Create Project.

Firebase setup step 4

After few seconds, you’ll get a confirmation page when your project is ready to use, then click on Continue.

Firebase setup step 5

Step 2:

After creating your new project click on the Storage.

Firebase setup step 6

Then on click on Get Started button.

Firebase setup step 7

Then click on Next button.

Firebase setup step 8

Step 3:

Then click on Project Overview and click on Add an app to get started button.

Firebase setup step 9

Now, Enter the App nickname, check the Firebase Hosting option and click on Register app button.

Firebase setup step 10

Then click on Next button.

Firebase setup step 11

Now, again click on Next button.

Firebase setup step 12

Then click on Continue to console button.

Firebase setup step 13

Now go to the Project Overview section and click on the App nickname that you just added and then click on settings icon.

Firebase setup step 14
Firebase setup step 15

Step 4:

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.

Firebase setup step 16

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.

Firebase setup step 17

Copy Firebase Config, Server Key and Server ID, these will be used in the module configuration.

Admin End – WordPress Progressive Web App

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.

Configuration click below WordPress Progressive Web App plugin listing in plugins page
Configuration Hover

Then, Admin can see the configuration page.

WordPress Progressive Web App configuration page

Activate License

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.

Name:

Admin can set the name of the app from here.

Short Name:

Here, Admin can set the short name of the app from here.

Theme Color:

Admin can select the theme color for the app from here.

Background Color:

Admin can select the background color for the app from here.

App Icons:

Here, Admin need to upload the icons for the app in the respective image sizes.

Push Notifications – WordPress Progressive Web App

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.

WordPress Progressive Web App Push Notifications List

Add Notification

Admin can add new notifications from this page.

WordPress Progressive Web App Add New Push Notification

Title:

Title will be displayed in the push notification to the users.

Description:

Description will be displayed in the push notification to the users.

Image:

Admin need to upload or can select previously uploaded image which will be displayed in the push notification to the users.

URL:

Admin need to enter the URL for which users gets redirected when they click on the push notifications.

Status:

This is the status of the notification which can be either Enabled or Disabled.

Analytics – WordPress Progressive Web App

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.

WordPress Progressive Web App Analytics

Customer’s End – WordPress Progressive Web App

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.

WordPress Progressive Web App Desktop  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.

WordPress Progressive Web App mobile step 1
WordPress Progressive Web App mobile step 2

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.

WordPress Progressive Web App mobile step 3

Push Notifications:

When Admin sends any notification from backend, users who have allowed notifications will receive the notifications on their mobile phone as well as desktop.

WordPress Progressive Web App mobile push notifications

After clicking the notification, app will get open with the URL set in the notification by Admin.

WordPress Progressive Web App opened by push notifications

Multilingual – WordPress Progressive Web App

Admin can use .pot file which is provided within the plugin in the languages folder from which they can translate the plugin.

Support

If you have any questions or queries or need assistance with our products or need any special customizing, you can connect with us from our contact page or can mail us at [email protected]. We will do our best to answer as quickly as possible.

4 thoughts on “Transform your Website into a Fast and Reliable Progressive Web App

  1. Marcelus says:

    Hi partner,
    Very cool this plugin and its tutorial.
    How do I add the homescreen to appear on on mobile?
    It just showed the notification.
    Grateful for the support!

    • DevDiggers says:

      Hi Sir,
      Hope you are doing well
      Thanks for the appreciation and you’ll get the popup to add the app on homescreen automatically. Kindly check this on our demo.
      If you have purchased the plugin and facing this issue on your site so it also can be some configuration issue. Kindly share the admin details of your site at [email protected] so our support team can look into your query.
      Thanks & Regards

      • Marcelus says:

        Good Morning! Homescreen opens in all browsers but samsung internet browser. Another thing: I would like to create a direct link to install pwa. I want to insert this link in the direct mail I’m going to send to clients. Do you have a tutorial or manual? Greetings

        • DevDiggers says:

          It is not supported in local internet browser of samsung as PWA support is not given in it and PWA can only be download by opening the site in the supported browsers as it gets downloaded through the browser. Also, if you like our plugin, kindly share your feedback on CodeCanyon and Trustpilot.

Leave a Reply

Your email address will not be published. Required fields are marked *

notification icon

We'd like to show you notifications for the latest news and updates.

This site uses cookies to offer you a better browsing experience. By browsing this website, you agree to our use of cookies.