Note – The customer needs to add the WhatsApp number in the WooCommerce Storefront Phone Number Field for placing the order through WhatsApp.
Check a quick view of the plugin in action:
After purchasing this plugin, you will get a zip file which needs to upload. Click the “Add New” menu option in the WordPress admin panel. For this login to WordPress Admin Panel and Under the Dashboard hover your mouse over the “Plugins” menu option which brings out a Sub-Menu and then select the “Add New” option.
Thereafter, you will see an option on the top of your page that is “Upload Plugin”, click the option to upload the zip file.
Afterwards, click on the “Upload Plugin” option, and you will see a button “Choose File” click on the button to browse for the zip file as per the snapshot below.
Thereafter browsing the file, click the “Install Now” button to install the plugin as per the snapshot.
Now when the plugin is installed correctly, you will see the success message and an option to activate the plugin. Click on “Activate Plugin” to activate the installed plugin.
Now, run the below-mentioned command in the respective directory (Likewise: domain/wp-content/plugins/wk-purchase-assistant) via the terminal.
composer install
Make sure that you have installed composer on your server else follow this instruction to install composer – Composer Installation
The store owner needs to register 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 the Next button.
Sign Up – To create your new Twilio account. Now, enter your Name, Email and then set your password next click on the start your free trial button.
A verification email will be sent to your registered email id as shown below.
Now, 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.
Afterwards enter the verification code, that you have received on the number provided by you and then click on the submit button.
Thereafter, a pop-up will appear on your screen click on Confirm button to activate your sandbox account as shown below.
↑ Back to top
Furthermore, 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 link.
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.
Two-Way Messaging.
Now after replying to the notification as shown above the user will have a 24-hour conversation window.
Configure your sandbox.
Let’s say the 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://storefront.com/wp-json/notification/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.
To configure the module the admin can click the WhatsApp Purchase Assistant in the sidebar menu at the admin panel.
As a result, The admin will get three tabs here as mentioned below.
General Settings
Firstly, the admin needs to enter some general information associated with their Twilio account.
Here, the admin needs to give the required inputs for the below fields.
Twilio WhatsApp Number – The admin needs to enter their Twilio WhatsApp number here.
Twilio Account SID – Now enter the fetched Twilio Account SID.
The Twilio Auth Token – Further, enter the Twilio Auth Token here.
Product Settings
Now in this section, the admin can set the front-end view by giving inputs for the below fields.
Product View Page Setting
Enable – The admin can enable or disable the WhatsApp Widget to be displayed on the product view page.
Button Text/Label – The admin can enter a custom title for the Purchase on WhatsApp button text/label.
Product List Page Settings
Enable – From here the admin can enable or disable the Purchase on WhatsApp button for the product list page.
Button Text/Label – Further, give a custom name to the WhatsApp Buy button.
Cart Page Settings
Enable – From here the admin can enable or disable the Purchase on WhatsApp button i.e show the WhatsApp Widget on the Cart Page.
Button Text/Label – Give the required name to the WhatsApp Widget displaying 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.
Notification Setting
The admin can enable WhatsApp notifications for various order events for their customer orders and also can add a custom message that will be sent to the customers.
Notification Text Product Page – Put the notification message to show the customer before placing the order through WhatsApp.
Enable Order Placed Notification – Now enable the order place notification to appear on the store.
Allow Order Placed Notification Message – Draft the custom message to send to the shoppers after placing the order.
Enable Order Cancellation Notification – Here allow the order cancellation notification to send to the shoppers.
Enable Order Cancel Notification Message – Draft out the custom message for order cancellation to send to the shoppers.
↑ Back to top
If the admin enables the purchase on the WhatsApp button the front-end view would be as shown in the below image.
Similarly, if the admin disables the purchase on the WhatsApp button the customer can only proceed to place the order using the Add to cart button.
↑ Back to top
If the admin enables the purchase on the WhatsApp button the front-end view would be as shown in the below image.
Similarly, if the admin disables the purchase on the WhatsApp button the customer can only proceed to place the order using the Add to cart button.
↑ Back to top
Firstly, add a product to the shopping cart and click on the view and Edit cart buttons. If, the hide proceed to checkout button is enabled or set as Yes, the customers can purchase only via WhatsApp.
↑ Back to top
If, the hide proceed to checkout button is enabled or set as No. Moreover, if the purchase on the WhatsApp button on the front end is enabled too then the front-end view would be as shown in the below image.
↑ Back to top
The existing customer needs to click on Purchase on WhatsApp and they are redirected to WhatsApp Web Application directly as per the below image.
↑ Back to top
When a guest user places an order a form popup appears. Now the guest user needs to provide a WhatsApp number along with other required details to complete the purchase process via WhatsApp.
Moreover, the guest user is also required to add their First name, Last name, Country/region, address, Followed by Postcode, Town/City and Email address, then click Place Order.
↑ Back to top
To place the order the customer will be redirected to their WhatsApp web application as soon as they click the purchase on the WhatsApp button on the WooCommerce store.
Select Shipping Method
As a result, the customer will be provided with various Shipping Alternatives to select from. Note: There is no shipping alternative provided for the virtual and downloadable products since they aren’t required to be shipped.
Now, to proceed with their order the customers can simply enter the number associated with the shipment of choice as shown in the above image.
Select Payment Method
The customers will be asked to select the Payment method that they wish to use from the given alternatives.
Note:
By purchasing through the WhatsApp application the customer can opt to pay using an offline mode of payment only.
Further, the customers are sent the complete Order Summary on their WhatsApp web application as shown below.
As a result, as soon as the admin approves the order from their end the Customers are notified with the message Order has been placed successfully!
WhatsApp Notification for Order Cancellation
For any order cancellation (made by the admin end) the customer will receive a notification as shown below image.
Invalid Order Request by the Customer
If under any circumstances the customer makes an invalid request over WhatsApp he/she will be sent a default message as shown in the below image.
↑ Back to top
Well, that was much about the WooCommerce WhatsApp Purchase Assistant Plugin. For any kind of issues or queries regarding the plugin kindly reach us at support@webkul.com or create a ticket at the Webkul HelpDesk system.
Thereafter, you will see an option on the top of your page that is “Upload Plugin”, click the option to upload the zip file.
Afterwards, click on the “Upload Plugin” option, and you will see a button “Choose File” click on the button to browse for the zip file as per the snapshot below.
Now when the plugin is installed correctly, you will see the success message and an option to activate the plugin. Click on “Activate Plugin” to activate the installed plugin.
