Reading list Switch to dark mode

    Prestashop WhatsApp Support and Share {User-Guide}

    Updated 20 December 2023

    With the help of Prestashop WhatsApp Support and Share, admin can chat with the customers on WhatsApp. This module lets admin create a strong relationship with his customers by giving them the support when they need it. Order sharing functionality on WhatsApp with the help of which more traffic can be generated on the website.

    Note: Prestashop WhatsApp Support and Share is  compatible with PrestaShop version 8.x.x and multi-store feature.

    Check the overview of the plugin in the video mentioned-below –

    89RM_Se1ANU

    Features

    • Add WhatsApp support button on the storefront.
    • Display WhatsApp floating support button at bottom-left or bottom-right position in the store.
    • Configure text to display in the floating support button.
    • Set header text for floating support block.
    • Add support agents by specifying the name, WhatsApp contact number, and uploading the image.
    • Choose to display the support agent’s contact number at front end.
    • Configure default chat message to display along with agent’s name at the front end.
    • Choose to display the support agent’s contact number at front end.
    • Add support group by specifying the name, group Id, and uploading the image.
    • Configure default chat message to display along with support group’s name at front end.
    • Show/Hide support agents and groups on the Prestashop storefront.
    • Assign support agents and groups to specific products & categories of your Prestashop store.
    • Enable, disable, edit or delete the support agents and groups.
    • Configure the time slots for which support agent or group will be available.
    • Once added, you can delete the time slot.
    • Allow customers to share their orders with their WhatsApp contacts.

    How to Install Prestashop WhatsApp Support and Share

    • 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.
    WhatsApp Support and Share installation
    WhatsApp Support and Share installation
    WhatsApp Support and Share installation

    Note

    You need to add these custom hooks for some additional display,

    Display button on contact us page:

    Searching for an experienced
    Prestashop Company ?
    Find out More

    Hook:

    {hook h="displayContactUsLeftColumn"}

    File: themes/classic/modules/ps_contactinfo/ps_contactinfo-rich.tpl

    Location: Before closing div of class “contact-rich” class

    Display WhatsApp Button on order list:

    You can also Display WhatsApp Button on order list beside “Reorder” Button

    Hook:

    {hook h='displayOrderHistoryRow' order=$order}

    File: themes/classic/templates/customer/history.tpl

    Location: in < td class=”text-sm-center order-actions” >, start or end anywhere you want

    Prestashop WhatsApp Support and Share Configuration

    After the installation of the module, you need to configure it.

    1-10

    Basic Configuration

    2-8

    Under Basic Configuration, you can:

    • Enable to display WhatsApp phone number at front end
    • Choose to display the floating support button, configure its text, header text, and position.
    • Enable to display the offline agents or groups and configure the message to display if the agent or group is offline.

    Front End View

    When a customer visits your online store, he can view your WhatsApp contact number in floating support button.

    3-6
    4-6

    On clicking the support button, the customer gets redirected to WhatsApp web where he needs to scan the code from his phone.

    QR Code

    When the scanning gets complete, a customer can start chat with admin on WhatsApp as shown below:

    Whatsapp Chat

    WhatsApp Support

    Post-installation, a new tab Manage Support gets available in the Prestashop back office. From this tab, you can add and manage support agents & groups.

    5-9

    Support Agent

    6-8

    You can add the support agent by specifying the name, contact number, default chat message, and uploading image of the chat agent. You can assign the support agent to specific products and categories. Also, you can configure the time slots according to which the support agents will be available.

    1-6

    Assign Categories

    This extension enables you to assign support agents to the specific categories of your Prestashop store. This means the support agent will display for the selected categories and the products that comes under these categories. When a customer visits the category or product page he can view the support agent by clicking on the support button as shown below:

    8-5
    9-3

    Assign Products

    While adding the support agent, you can assign him to specific products of your Prestashop store. This means the support agent will display on the products you have selected. On the Add User form, search product with initials of product name in “Search for a product” field. Based on the keywords entered, select the product from the list and then click on “ADD TO LIST” button.

    When a customer visits the product page, he can view the support agent you have assigned to the product as shown in the below screenshot.

    12-4

    On clicking the support button, he redirects to WhatsApp web where he has to scan the code from his phone.

    QR Code

    When the scanning gets complete, then a customer will be able to chat with a support agent on WhatsApp as shown below:

    Whatsapp Chat

    Available Time Slot

    This field enables you to configure time slots for days for which the support agent will be available online. You just need to select the day and specify the start & end time for the slot.

    4-3

    You can add multiple time slots for a day.

    5-2

    When a customer visits the store, the support agent will be visible as online for the time slots you have added.

    15-3

    You can view a list of agents added under Support Agent tab. Under this tab, you can enable or disable, edit, and delete the support agent.

    16-2

    Status – If disabled, then the support agent will not be visible to the customers at front end.

    Availability -If disabled, then the support agent will show as offline at front end. Kindly note this feature will work if you have enabled the display of offline agents or groups under Basic Configuration settings.

    Support Group

    You can add the support group by specifying the name, default chat message, group Id, and uploading the image. Also, you assign the support group to specific products & categories and configure the time slots according to which the support group will be available.

    2-6
    5-3

    Front End View

    When a customer visits the category or product page, he can view support group assigned to the category or product.

    18-1
    19-1

    On clicking the Support Group button he will be redirected to chat.whatsapp.com.

    Join group

    After clicking on “JOIN CHAT” a customer redirects to WhatsApp web where he has to scan the code from his phone.

    QR Code

    When the scanning gets complete, a web page web.whatapp.com open and the customer can view members of the support group.

    Support groups

    After clicking on “View Group” button a customer can chat with a support group on WhatsApp as shown below:

    Support Group

    Display Support Buttons

    Under “Display Support Buttons” admin can configure where to show the support buttons on the store.

    Display support button

    Front End View

    Header Position

    20-4

    When a customer clicks on Support button at Header he gets redirected to web.whatsapp.com, where he can view a pre-filled message.

    support

    Contact Us Page

    21-2

    On clicking Support button at Contact Us page, customer gets redirected to web.whatsapp.com, where he can view a pre-filled message you have set for the support button on the Contact Us page.

    Contact Us Page

    Order History Page

    22-1

    When a customer clicks on Support button he gets redirected to web.whatsapp.com, where he can view a pre-filled message set you have set for the support button at Order History Page.

    Order History Page

    Display Share Buttons

    Under “Display Share Buttons” you can configure where to show the WhatsApp share button on the store. You can choose to display WhatsApp share button on:

    • Product Page
    • Order Confirmation Page
    • Order History Page
    Product Page

    Front End View

    When a customer visits the product page, he can view the share button as shown below:

    23-1

    On clicking the share button, the customer gets redirected to web.whatsapp.com, where he can share the product’s URL by selecting his contacts.

    Product Page

    After selecting the contacts, a customer can send a message to his contacts along with product’s URL.

    Product Page

    Order Confirmation Page

    24-1

    When a customer clicks on share button at Order Confirmation Page he gets redirected to web.whatsapp.com, where he has to select the contacts with whom he wants to share an order.

    Order Confirmation Page

    Order History Page

    25-1

    When a customer clicks on share button he gets redirected to web.whatsapp.com, where he has to select the contacts with whom he wants to share an order.

    Order History Page

    Support

    For any kind of technical assistance or query, please raise a ticket at http://webkul.uvdesk.com 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 - 5.2.1

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

    . . .

    Leave a Comment

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


    2 comments

  • Piyush
    • Anuj Verma (Moderator)
  • 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