Web Push Notifications

Introduction

Web push notifications are actionable messages that appear on a user's desktop or mobile device, triggered by the website they have subscribed to, regardless of whether or not the user is currently browsing the site. These notifications allow businesses to send real-time messages to users, which can include promotions, new updates, and reminders.

Benefits & Use Cases

Web push notifications are a powerful tool for e-commerce businesses looking to increase engagement, conversions, and customer loyalty. They can be combined with other Fanplayr features and services to provide key benefits:

  • Increased engagement: Web push notifications are a great way to keep customers engaged with your brand. By sending personalized and timely notifications, you can encourage customers to visit your website and make a purchase.

  • Higher conversion rates: Web push notifications have been shown to have higher click-through and conversion rates compared to other marketing channels such as email. This is because push notifications are delivered in real-time and are difficult to ignore.

  • Abandoned cart recovery: Web push notifications can be used to remind customers of items they left in their cart and encourage them to complete the purchase. This can be particularly effective when combined with a discount or other incentive.

  • Improved customer retention: By sending relevant and personalized notifications, you can improve customer retention and loyalty. This can lead to repeat purchases and increased customer lifetime value.

  • Increased website traffic: Web push notifications can be used to drive website traffic, even when customers are not actively browsing your website. This can be particularly useful for promoting new products or seasonal sales.

Technology Details

Web push notifications are a type of messaging technology that allows websites to send notifications to users' devices, even when the users are not actively browsing the website. The technology behind web push notifications involves several different components:

  1. Push notification service: A push notification service is a server that manages the sending and receiving of push notifications. The service handles the communication between the website and the user's device.

  2. Service worker: A service worker is a JavaScript file that runs in the background of a website and handles push notifications. It is responsible for intercepting push notifications, displaying them to the user, and handling user interactions with the notifications.

  3. Push API: The Push API is a web API that allows websites to send push notifications to users' devices. It provides a way for the website to register a service worker, subscribe to push notifications, and send push messages.

  4. Web browser: Web push notifications require a web browser that supports push notifications. Most modern web browsers, including Chrome, Firefox, and Safari, support web push notifications.

  5. Device operating system: Push notifications require the user's device to be connected to the internet and to have a compatible operating system. Most modern mobile and desktop operating systems, including iOS and Android, support push notifications.

  6. Web push subscription: A web push subscription is a permission given by a website user to receive notifications from a website on their device. Subscriptions are created using a set of public and private VAPID keys so that notifications can only be sent securely from the push notification service that has the keys.

When integrating web push notifications, Fanplayr will take on the role of the push notification service and you will need to include part of our service worker logic into your website using one of the integration methods described below.

Integration Guides

Fanplayr offers two primary methods of integrating web push notifications into your website. The method you use will depend on whether your are able to configure a service worker directly on your website or need Fanplayr to manage one on your behalf.

Follow this guide if you are able to configure a service worker at the root of your website.

This is the preferred integration method as it has the widest browser support and best user experience.

Follow this alternate guide if you are unable to configure a service worker on your website.

Last updated