Back to Top

Live Sales Order Popup Notification for Magento 2

Updated 9 November 2023

Introduction

Live Sale Order Popup Notification module for Magento 2 helps the admin to show the live sale notification and review notification to the customers. Every time if a customer buys some product from the store, then the sale popup notification will appear to other customers.

Additionally, once the admin has approved the review of the product from the back-end, then also the customer receives the review popup notification.

The popup notification has the name of the product along with its price. Also, the customer can click on the product name and it’ll redirect them to the product page.

Check the working of the plugin, a quick glance –

Feature List

  • Customers can see order popup notifications of the products.
  • The customer can see live rating notifications.
  • The customer will be able to go on the product whose notifications are being popped-up.
  • The admin can show/hide the customer’s name and city.
  • Select animation of the notification popup.
  • Set display time (in seconds) of the notification popup.
  • The admin can select three different layouts for the order and review popup notifications.
  • Select the popup position as Top-left, Top-Right, Bottom-Left, and Bottom-Right.
  • The admin can set the text color, link color, border color, background color of the notification popup.
  • Set the border width of the notification popup.

Note – Make sure telnet and nohup are already installed on your server.

Searching for an experienced
Magento 2 Company ?
Find out More

Module Installation

Customers will get a zip folder. Then they have to extract the contents of this zip folder on their system. The extracted folder has an src folder, inside the src folder you have the app folder.

You need to transfer this app folder into the Magento2 root directory on the server as shown below:

Live Sales Order Popup Notification for Magento 2-installation-1

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

First Command –

composer require cboden/ratchet

Second Command –

php bin/magento setup:upgrade

Third Command –

php bin/magento setup:di:compile

Fourth Command –

php bin/magento setup:static-content:deploy

After running the commands, you have to flush the cache from the Magento admin panel by navigating through System > Cache management as shown below:

Live Sales Order Popup Notification for Magento 2-installation-2

Language Translation

For translating the module language, navigate through src/app/code/Webkul/LiveNotifications/i18n and edit the en_US.csv file.

Thereafter, rename the CSV as “en_SA.csv” and translate all right side content after the comma in the Arabic language. After editing the CSV, save it.

Then upload it to the path src/app/code/Webkul/LiveNotifications/i18n where the Magento2 is installed on the server.

The module gets translated into the Arabic Language. It supports both RTL and LTR languages.

Live Sales Order Popup Notification for Magento 2-transalation

Thus, in this way, the admin can translate the module language.

Module Configuration

After the successful installation of the Live Sale Order Popup Notification module, the admin needs to navigate towards the Store > Configuration >Live Notification for configuring the module as shown below:

webkul-magento2-live-sales-order-popup-notification-configuration

General Settings:

From here the admin can enable or disable the module, for the reference check the below snapshot:

webkul-magento2-live-sales-order-popup-notification-configuration-general-settings

Show “Someone” instead of customer name – The admin can disable this option to Show the name of the customer on the live notification pop up or else “Someone” will get displayed at the place of the customer name.

Show Customer City – From here, the admin can decide whether to show the city of the customer or not.

Animation – The admin can decide the animation effect of the live notification pop up. There are various types of bounce effects such as; Bounce In, Bounce In Down, Bounce In Left, Bounce In Right, Boun In Up.

  • In Bounce In effect, the popup will just bounce at the popup position set by the admin.
  • In the case of Bounce In Down, the popup comes down from the top of the website.
  • Under Bounce In Left, the popup will appear on the left side of the website.
  • In the case of Bounce In Right, the popup will appear on the left side of the website.
  • In the case of Bounce In Up, the popup will bounce up from the downside of the website.

Display Time (Second) – Also, the admin can decide for how much time the popup will show to the customer on the website.

Server Settings:

webkul-magento2-live-sales-order-popup-notification-configuration-server-settings

Form the server settings, the admin can configure the following details:

Host Name – The admin has to enter the hostname.

Port Number – Here, the has to enter the port number.

Sub Folder Path if any – If the admin has any subdomain folder path, then they need to provide it’s URL here.

HTTPs Enabled If the admin is having SSL website then they need to enable this option.

webkul-magento2-live-notification-configuration-server-settings-1

Upload Server Certificate File – Here the admin needs to upload the server certificate file with the name server.crt to work on https.

Upload Server Private Key File – Here the admin needs to upload the server private key file with the name sever.key to work on https.

Sales Popup:

webkul-magento2-live-notification-configuration-sale-popup-2

Status – The admin can enable or disable the live notification popup on the sale form here.

Popup Layout – Select the layout of the popup as Default Layout, With Image, and without Image.

  • In the default layout, the name and the price of the product will be shown.
  • with the image layout, the name, price and also the image of the product will be visible. Also, the name of the product will redirect the customer to the product page.
  • Without image, the layout will only show the name and the price of the product. Also, the name of the product will redirect the customer to the product page.

Popup Position – From here, the admin can decide the position of the popup on the website. The positions are Top Left, Top Right, Bottom Left, and Bottom Right.

Margin X and Margin Y – The admin can set the border-spacing of the popup on the website.

Text Color and Link Color – The admin can select the color of the text and the product link.

Background Color and Border Color – The admin can select the background color and also the border color of the popup.

Border Width (px) – Also the admin can enter the width of the border in pixel.

Box Shadow – The admin can enable or disable the shadow of the popup box.

Rating Popup:

webkul-magento2-live-notification-configuration-rating-popup

Status – The admin can enable or disable the live notification popup on the review approval form here.

Thus, the rest of the configuration is the same as the Sale Popup.

Front View – Sale Popup Notification

Once the admin has enabled the popup notification for sale from the back-office, then the customer will see the live sale notification if any customer’s buy any product.

For the reference, you can check below snapshot:

webkul-magento2-live-notification-customer-sale-2

In the above snapshot, you can see all the 3 types of popup layout i.e. Default Layout, With Image, and Without Image with having Top-Right Position on the website.

Also, the customer can be redirected to the product page by clicking on the hyperlinked name of the product as shown below:

webkul-magento2-Live-Sales-Order-Popup-Notification-product-page

Front View – Review Popup Notification

Also, when the admin enables the pop-up notification for the review. The customer will see the review notification of the product, once the admin has saved the review.

For the reference, you can check the below snapshot:

webkul-magento2-live-notification-customer-review

In the above snapshot, you can see all the 3 types of popup layout i.e. Default Layout, With Image, and Without Image with having Bottom-Left Position on the website.

Also, the customer can be redirected to the product page by clicking on the hyperlinked name of the product as shown below:

webkul-magento2-Live-Sales-Order-Popup-Notification-product-page-1

Thus, that’s all for the Live Sales Order Popup Notification for Magento 2. If you face any issue, feel free to add a ticket at our HelpDesk system.

Current Product Version - 3.0.0

Supported Framework Version - Magento 2.0.x, 2.1.x, 2.2.x,2.3.x, 2.4.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