The WhatsApp Order Notification module makes it easier for the customers to purchase products directly using their WhatsApp account
Moreover, the store owner can send custom notifications to the buyers when an order undergoes any event either placed, shipped or cancelled.
Notifications are the most relevant and simple feature to keep your users engaged let it be for any order event, transaction, or an invoice.
Moreover, these interactions using notifications become massive sales booster for any store when integrated with a platform like WhatsApp, which itself is one of the world’s most used messaging app which develops a pre-sense of security and reliability for your online store.
Hence, it creates a unique value-added experience that enhances your product identity and it is possible only if you notify your customers in real-time with the correct message.
Note : Also check our Magento 2 WhatsApp Contact module using which admin can feature WhatsApp Contact button on the storefront allowing customers to communicate with the store owners via WhatsApp.
Watch How Magento 2 WhatsApp Shopping Bot Works?
- The admin can enable or disable buy on WhatsApp button.
- The admin can label the WhatsApp icon with the required custom text.
- Moreover, the admin can choose to hide add to cart button from the front end.
- The Admin can enable or disable notification to the customers for various order events.
- The Admin can notify the customers by delivering a custom personalized text message for the orders
- This module works for all types of product and guest users can purchase as well.
- The customer can purchase their order directly from their WhatsApp account after initiating the process from the storefront.
- Further, the buyer is notified for the orders that are placed followed by order events like invoice generation, shipment and cancellation.
- The guest users can enter their details like his/her email address using WhatsApp.
- The customer can opt to pay using an offline mode of payment only.
- Customers can also select the mode of shipping and payment options from the given alternatives.
Firstly, customers will get a zip folder and 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.
Further, the admin need to transfer this app folder into the Magento2 root directory on the server as shown below.
After the successful installation you have to run these commands in the Magento2 root directory:
First command –
composer require twilio/sdk
Second command –
php bin/magento setup:upgrade
Third Command –
php bin/magento setup:di:compile
Fourth Command –
php bin/magento setup:static-content:deploy
Fifth Command –
php bin/magento indexer:reindex
Right after that flush the cache from Magento admin panel by navigating through->System->Cache management as shown below.
Configuration of Multi-Lingual
The admin will navigate through Store > Configuration > General ->Locale Options and select the locale as German (the language into which admin wants to translate his store content).
If you need to do the module translation, please navigate the following path in your system. app/code/Webkul/OrderByWhatsappBot/i18n. Open the file named en_US.CSV for editing as shown in below screenshot.
Once you have opened the file for editing, replace the words after the comma(,) on the right with your translated words.
After editing the CSV file, save it and then upload it to the same path app/code/Webkul/OrderByWhatsappBot/i18n. The module will now get translated into your desired language. It supports both the LTR and RTL languages.
How to Setup the Twilio Account?
The store owners need to register themselves on Twilio to set up their account by undergoing the following steps.
If you already have a Twilio account, to log in enter your email id and further click over Next button.
To initiate your Twilio account.
Enter your Name, Email and then set your password next click on start your free trial button.
As a result, verification email sent to your registered email id as shown below.
Verify your email by clicking on the Confirm your Email link enclosed within the mail.
Further, you need to enter your Phone number and click on the verify button.
Then enter the verification code,
that you have received on the number provided by you and then click on the submit button.
A pop-up will appear on your screen click on Confirm button to activate your sandbox account as shown below.
WhatsApp Sandbox Configuration
To initiate working (i.e build your WhatsApp bot) in the test environment the user needs to configure his/her sandbox inbound URL.
To be able to send and receive messages from the Sandbox to the Application. The store admin needs to go to the following web page.
- Send a message to the Twilio number with the verification code to join.
You will receive a confirmation text on your device as shown below.
Send a One-Way Message.
Now after replying to the notification as shown above the user will have a 24-hour conversation window.
- Configure your sandbox.
Let’s say admin site URL is https://storefrontend.com/
Then In the below field WHEN A MESSAGE COMES IN the admin needs to paste the link https://storefrontend.com/whatsapp/bot and click on Save. Now webhooks to this URL when a message comes in.
Note: In order to move into production using the Twilio API for WhatsApp, you need a WhatsApp Business Profile in conclusion, WhatsApp has to formally approve your account.
Just go to your Twilio project under the TRIAL dropdown menu as shown below.
On the Dashboard section under your Project Name, you can view your ACCOUNT SID and AUTH TOKEN credentials.
After the successful installation of the module, the admin can now configure it from the back end. For this, the admin will navigate to Stores > Settings > Configurations > WhatsApp bot.
Twilio WhatsApp Number : The admin needs to enter his Twilio WhatsApp number here.
The Twilio uses two credentials to determine which project an API request is coming from, which are namely.
- Twilio Account SID : Which acts as a username.
- Twilio Auth Token : Which acts as a password.
Debug : For sandbox mode, we will set it as Yes and for development, we will set it as No.
Product View Page Setting
Enable : The admin can enable or disable the feature from here for the product view page.
Button Text/Title : You can enter a custom suitable text for the button label that will be visible on the product view page.
Hide Add to Cart Button : You can also hide the add to cart button from the product view page or can also select No from the dropdown to reflect the add to cart button on the product view page as shown below.
Similarly, if the admin chooses to enable the hide add to cart button or set as Yes.
Product List Page Setting
Enable : The admin can enable or disable this field and accordingly the feature will be visible on the product list page or category page.
Button Text/Title : You can enter a custom suitable text for the button label that will be visible on the product list page.
Hide Add to Cart Button : Using this field you can hide the add to cart button or show from the product list page as shown in the below images.
If the hide add to cart button is enabled or set as Yes.
Moreover alternatively, if the hide add to cart button is Disabled or set as No.
Cart Page Setting
Enable : The admin can enable or disable this field as a result, the feature will be visible on the cart page.
Button Text/Title : The admin can enter a custom suitable text for the button label that will be visible on the cart page.
Hide Proceed to Checkout Button : Using this field you can hide or show the proceed to checkout button from the cart page as shown in the below images.
Firstly, add a product into the shopping cart and click on view and Edit cart button as shown below.
If, the hide proceed to checkout button is enabled or set as Yes.
Moreover alternatively, if the hide proceed to checkout button disabled or set as No.
Order Management Notification Setting
Require WhatsApp Number Attribute(Frontend) : If enabled the WhatsApp Number will be a required value on the customer add address and the checkout page.
Attribute Label(Frontend) : The admin needs to enter a required text value for the above input field.
Enable Order placed Notification : Once enabled the customer will get the order placed notification on their Whatsapp number entered previously, if disabled they would get the message on the number using which the order is being placed.
Order Placed Notification Message : The admin can enter a custom message that will be delivered on the WhatsApp number of the customer whenever an order is placed.
Enable Invoice Notification : Once enabled the customer will get a notification for the invoice generated.
Order Invoiced Notification Message : The admin can enter a custom message that will be delivered on the WhatsApp number of the customer whenever an order invoice is generated with its order and invoice ids.
Enable Shipment Notification : Once enabled the customer will get a notification when their order is shipped. The admin can enable or disable the notification for the shipment.
Shipment Notification Message : The admin can enter a custom message that will be delivered on the WhatsApp number of the customer whenever an order is shipped with its order ID and tracking number.
Enable Order Cancelled Notification : Once enabled the customer will get a notification whenever their order has been cancelled. The admin can enable or disable the notification for the cancellation.
Order Cancelled Notification Message : The admin can enter a custom message that will be delivered on the WhatsApp number of the customer whenever an order is cancelled with its order ID.
Front End – WhatsApp Order – Notification
The store’s customer can make a purchase even without signing in on the store too, even a guest user can simply click on Purchase on WhatsApp button from the frontend.
Thereafter the guest user will be asked to add his/her details as shown below.
Then click on the Checkout on WhatsApp button next as a result the buyer will be redirected to his/her WhatsApp account.
The user needs to enter his/her email address after which a default message is sent to the user as shown further the buyer can –
- Choose the shipping method as per his/her requirement.
- Select the required payment method from the given options.
- Currently, the module supports the offline mode of payments only as shown.
- The user customer will receive instant notification for the placed order with its order ID.
- Also, on the provided email by the customer, an order confirmation along with details of the purchase and tracking info is sent.
Now the admin can go to Sales > Orders click on View tab under Action. and check the complete order details.
Now, simply click on the Invoice tab above order & account information section.
Thereby the admin can generate a New Invoice by clicking on the Submit Invoice button as shown below.
Hence, after the successful payment confirmation as shown below.
- The customer receives a notification with its order and invoice Id for the same.
- The admin can generate shipment by clicking on Ship.
Once the order has been shipped
- The customer will receive a notification as shown below.
Note -There is no shipping alternative provided for virtual and downloadable product since they aren’t required to be shipped.
Also, the admin can manually select one or more orders from the order list and opt to cancel the order as shown below.
For any order cancellation (made by admin end) the customer will receive a notification as shown below.
If under any circumstances the customer makes an invalid request over Whatsapp he will be sent a default message as shown below.
That’s all for Magento 2 Take Orders on WhatsApp and Notification extension.
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