Back to Top

PrestaShop Browser Push Notifications {User-Guide}

Updated 29 July 2024

PrestaShop Browser Push Notifications: Increase engagement in your online store by sending automated push notifications for relevant events using OneSignal.

Customers can subscribe for the push notifications and get notifications for the events like abandoned carts, order status update, etc right on the browsers.

Add any number of custom notifications and schedule the time when you would like to send them to specific users.

Enhance user experience and drive conversions by notifying customers of various events of you store with PrestaShop Browser Push Notifications.

Features of PrestaShop Browser Push Notifications

  • Allow users to subscribe for notifications.
  • Automatically send push notifications to the subscribers.
  • Send welcome notification to the subscribers.
  • Send push notifications for the abandoned carts to the subscribers.
  • Show notifications to the subscribers when their order status gets updated.
  • Add notifications that you would like to send to customers from the back office.
  • Set delivery time for the notification.
  • Set after how many visits the notification prompt will display to the customer.
  • Configure the message that you would like to show for welcome, abandoned cart, and order status update notifications.
  • Various options are provided to customize the appearance of notifications.

How to Install PrestaShop Browser Push Notifications

The installation is quite simple just like the standard PrestaShop modules.

Start your headless eCommerce
now.
Find out More
  • Firstly, go to the module manager in the back office and click on ‘upload a module’.
  • After that, drag and drop the module file or select the file from the system.
  • In this way, the module installation will be successful.
image-38
image-39
image-40

Module Configuration

Account Settings

account settings

Under Account, the admin needs to specify the App ID, Rest API key, and Safari web ID that he has received from OneSignal account.

How to get credentials

To obtain the required credentials, the admin needs to login to their OneSignal account.

onesignal login

Once logged in, click on ‘New App/Website’ button.

add new app

Enter the app name, select web as first channel, and click on next button.

add app

Now select custom code under ‘Choose Integration and enter site name under site setup. Click on Save button.

web configuration

Go to Settings > Keys & IDs.

keys and ids

Under ‘Keys & Ids’, the admin can view OneSignal App ID and Rest API key.

For getting Safari web ID, go to Platforms > Web > Settings.

app settings

Under ‘Add Code to Site’, the admin can view Safari web ID.

safari web id

Subscription Bell Settings

subscription bell

Subscription bell settings allows the admin to customize the appearance of subscription bell and dialog box. Under this tab, the admin can:

  • Specify dialog title, subscribe button text, and unsubscribe button text.
  • Set dialog unsubscribe/subscribe button background and text color.
  • Select notify button bell size and position.
  • Set notify button background and foreground color.
  • Choose to show ‘powered by OneSignal’ in dialog box.

Front End View

When a user visits the store, he can view subscription bell on the position selected by the admin.

subscription bell

On clicking the icon, a dialog box appears on the page. From this dialog box, the customer can subscribe or unsubscribe to the notifications.

subscription bell

Slide Prompt Settings

slide prompt settings

Auto prompt: Enable the option to automatically show prompt when a user visits the site.

Show after visit: Here the admin needs to set the number of visits after which prompt will displayed to the customer.

Show after: Once the customer has visit the site, the prompt will displayed after the time set by admin in this field.

Message: Set the message that will show in prompt.

Accept/Cancel button text: Set the text to be displayed for the accept/cancel button.

Front End View

A prompt will display on the store after the specified time and number of visits.

prompt

Welcome Notification

Under Welcome notification, the admin can set the title and message that will display to the customer on subscribing for the notifications.

welcome notification

Front End View

On clicking the bell icon, a welcome notification prompt will display on the store.

welcome notification

Abandoned Cart Settings

These settings allows the admin to send notifications for the abandoned carts to the customers.

abandoned cart

Under Abandoned Cart tab, the admin:

  • Can choose to send abandoned cart reminder notifications to customers.
  • Needs to specify the abandoned cart template name that will be used for sending abandoned cart reminders.
  • Can set the message title and message that will display in the abandoned cart notification

Process of adding Segments for Abandoned Carts

Set up the abandoned cart segment 

Firstly, in your OneSignal dashboard, go to ‘Audience > Segments’.

segments

Now, click on ‘New Segment’ button to create a segment.

add segment

On clicking the ‘New Segment’ button, a popup appears on the page where you need to specify the name of segment.

add segment

Enter ‘cart_update’ in first column (key) and select ‘exists’ in the second column.

add segment

Click on ‘Add filter’ button below User Tag to create an ‘AND’ relationship.

add segment

Now, click on the ‘Last Session’ filter, select ‘greater than’ in first column, and enter 1 in second column.

add segment

Now, click on ‘Create Segment’ button.

segment

Set the reminder message

Go to ‘Messages > Automated. Click on ‘New Automated Push’ button.

messages

Now, set the message name and select ‘Send to particular segment(s)’ under Audience.

message

Click on ‘X’ mentioned alongside ‘Total Subscriptions’.

message

Now, click on ‘Include Segment’ button and select the created segment.

message
segment

Select the message template.

select message
select message template

Select ‘Immediately’ and ‘If the user returns to the app’ under ‘Delivery Schedule’.

delivery schedule

Now, click on ‘Make Active’ button.

Order update notification

order update notification

Under Order update notification, the admin can:

  • Configure the order status(es) on which the order update notification will be sent to the customers.
  • Set the title and message to be displayed in order update notification prompt.

Front End View

When the admin updates the status of an order, a notification will display in the front as shown in the below screenshot.

order status notification

Notification

Under this tab, the admin can add custom notifications that he wants to send to customers.

add notification

Admin can add notification by clicking on ‘Add notification’ button.

add notification

On clicking the button, a form appears with the following options:

  • Name: Specify the name of notification.
  • Title and Message: Set the title and message that will display in notification prompt.
  • Segments: Notification will be sent to users of the selected segments.
  • Icon and Image: Upload the icon and image that will display in notification prompt.
  • Launch URL: When a user clicks on the notification, he will be redirected to the URL specified in this field.
  • Delivery start time: Set the time at which notification will be send to the customers.

This was all about PrestaShop Browser Push Notifications module. I hope this document will help you in checking the functionality of the module in a better way. Also, do let us know about your views in the comments.

Support

For any kind of technical assistance or query, please raise a ticket or send us a mail at [email protected]

Also, please explore our Prestashop development services and vast range of quality Prestashop addons.

Current Product Version - 1.0.0

Supported Framework Version - 8.x.x, 1.7.x.x

. . .

Leave a Comment

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


Be the first to comment.

Back to Top

Message Sent!

If you have more details or questions, you can reply to the received confirmation email.

Back to Home

Table of Content