WPTrivo Chat2Order – Messaging for WooCommerce

Version 1.0.0 · Developed by WPTrivo.
Website: https://wptrivo.com

Table of Contents

  1. 1. Introduction
  2. 2. Requirements
  3. 3. Installation
  4. 4. Activation & WooCommerce Check
  5. 5. Quick Start (Recommended)
  6. 6. Admin Menu Overview
  7. 7. Widget Settings
  8. 8. Account & Display Settings
  9. 9. WooCommerce Chat2Order Settings
  10. 10. WhatsApp Orders & Analytics
  11. 11. Other Settings
  12. 12. Frontend Behaviour
  13. 13. Translation & Localization
  14. 14. Uninstall Behaviour
  15. 15. FAQ & Troubleshooting
  16. 16. Changelog
  17. 17. Third-Party Libraries & Licenses
  18. 18. Screenshots

1. Introduction

WPTrivo Chat2Order – Messaging for WooCommerce lets your customers start a WhatsApp conversation directly from your WooCommerce store, with their cart or order details pre-filled in the message. It also includes:

This plugin is not affiliated with, endorsed, or sponsored by WhatsApp LLC. “WhatsApp” is a registered trademark of its respective owner.

2. Requirements

3. Installation

3.1 From the downloaded ZIP

  1. Log in to your WordPress Admin Dashboard.
  2. Go to Plugins → Add New → Upload Plugin.
  3. Click Choose File and select the plugin ZIP file (e.g. wptrivo-chat-two-order.zip from your Plugin folder).
  4. Click Install Now.
  5. After installation, click Activate Plugin.

3.2 Folder structure (for reference)

wptrivo-chat-two-order/
├─ admin/
├─ public/
├─ includes/
├─ languages/
├─ uninstall.php
└─ wptrivo-chat-two-order.php
    

4. Activation & WooCommerce Check

On activation, the plugin automatically checks if WooCommerce is active:

If you see a notice like “Please activate WooCommerce first”, go to Plugins → Installed Plugins and activate WooCommerce before trying again.

5. Quick Start (Recommended)

To get the plugin running in under 5 minutes:

  1. Create a WhatsApp account (agent) in the plugin.
  2. Configure the floating widget (color, text, position).
  3. Enable Chat2Order for WooCommerce buttons.
  4. Place a test order from the frontend and confirm that WhatsApp opens with the correct message.

The following sections explain each step and all available options in detail.

6. Admin Menu Overview

After activation you will see a new main menu in WordPress admin: “WhatsApp Connect” (exact label may vary slightly).

Key pages inside this menu:


7. Widget Settings

The floating widget allows visitors to start a WhatsApp chat from any page. Go to WhatsApp Connect → Widget Settings.

7.1 Main options

Option Description
Enable Widget Toggle to enable or disable the entire chat widget.
Widget heading text Heading shown at the top of the chat window. Default: Start a Conversation.
Widget label text Small label that appears next to the floating button. Default: Need help? Chat with us.
Show label on desktop When enabled, displays the label bubble next to the floating button on desktop devices.
Widget color Background color of the floating widget/button. Accepts any valid CSS color (hex, rgb, variable).
Widget text color Color of the text or icon inside the widget/button. Accepts any valid CSS color.
Label bubble background Background color for the small label bubble shown next to the floating button.
Label bubble text color Text color for the label bubble.
Floating button size (px) Diameter of the floating launcher button in pixels. Default: 56 (px).
Chat window corner radius (px) Roundness of the chat window card's corners in pixels. Default: 18 (px).
Font size of Widget title Font size (px) for the widget heading/title inside the chat panel. Default: 15 (px).
Font size of Widget description Font size (px) for any description or subtext inside the panel. Default: 10 (px).
Widget font (title/description) Font family choices for heading and description text inside the widget panel (e.g., system, Google fonts).
Glass opacity Background opacity of the chat window (0–1) to create a glassmorphism effect. Default: 0.92.
Shadow strength (CSS) Box-shadow value applied to the chat window for depth (e.g., 0 22px 64px rgba(0,0,0,.28)).
Widget radius Controls the button border radius for a pill or circular style. (Related to chat window corner radius and button shape.)
Widget button size (small/medium/large) Alternative preset sizes for the widget button (maps to pixel sizes if using presets).
Widget shadow Enable/disable a subtle shadow around the widget for better visibility and separation from page content.
Enable GDPR Notice When enabled, shows a privacy/consent notice that must be accepted before starting a conversation.
Notice text Custom text shown inside the GDPR/consent notice. Default: Please accept our privacy policy first to start a conversation.
Custom CSS (scoped to widget) Optional CSS rules that apply only to the widget wrapper. Use for advanced styling (scoped selectors only).

After changing settings, always click Save Changes at the bottom of the page. Then refresh your site frontend in an incognito window to verify the appearance.

8. Account & Display Settings

Each “WhatsApp account” represents an agent or support number. Go to Whatsapp Connect → All account.

8.1 Creating a WhatsApp account

  1. Navigate to the WhatsApp Accounts section .
  2. Click Add New.
  3. Enter a Title (e.g. “Sales Team”, “Support India”, etc.).
  4. Fill in the meta fields such as:
    • WhatsApp Number (with country code, e.g. +91XXXXXXXXXX).
    • Optional display name and description.
    • Optional working hours / availability (if present in your build).
  5. Click Publish.

8.2 Assigning accounts to the widget & pages

In the Widget Settings->Widget Account Settings screen you can control where the widget appears:

Option Description
Widget account selection Choose one or more WhatsApp accounts that will be used in the floating widget.
Display on Define where the widget should appear:
  • All pages
  • Only on posts
  • Only on pages
  • Only on products
  • Custom rules (depends on plugin version)
Position Select widget position (e.g. bottom-right, bottom-left).

9. WCOrder Settings

These settings control how WhatsApp buttons integrate with WooCommerce. Go to WhatsApp Connect → WCOrder Settings ->Setting.

9.1 Enable Chat2Order buttons

Setting Effect
Enable single product WhatsApp button Shows a WhatsApp button on the single product page, usually after the “Add to cart” button.
Enable shop page WhatsApp button Adds a WhatsApp button on the shop / archive pages for each product (where supported).
Enable checkout via WhatsApp button on cart page Adds a button on the cart page to start a WhatsApp chat with cart details.
Disable checkout button Optionally hides the default “Proceed to checkout” button if you want orders only via WhatsApp.
Enable WhatsApp redirect after checkout After a standard WooCommerce order is placed, redirect the customer to WhatsApp with an order confirmation message pre-filled.

9.2 WhatsApp number & message template

Setting Description
WhatsApp Number The default number used for WooCommerce Chat2Order buttons. Use full international format, e.g. +919876543210.
Order Message Template Text sent to WhatsApp when a customer clicks the button or is redirected after checkout.
You can use placeholders:
  • {order_number}
  • {customer_name}
  • {order_total}
  • {payment_method}
  • {order_date}
Example:
Hi, I just placed order #{order_number} on your store.
Name: {customer_name}
Total: {order_total}
Payment: {payment_method}
Date: {order_date}
Single Product Button Text Text label for the button on single product pages (e.g. “Order on WhatsApp”).
Cart Button Text Text label for the button on the cart page (e.g. “Checkout via WhatsApp”).
Allow guest users to order via WhatsApp Let visitors without an account start Chat2Order flows.
Select user role Restrict WhatsApp ordering to specific roles if needed (e.g. only logged-in customers).

9.3 Assign WooCommerce accounts

In the same screen you can also choose which WhatsApp accounts (agents) handle WooCommerce Chat2Order:


10. WhatsApp Orders & Analytics

10.1 WhatsApp Orders Dashboard

Go to WhatsApp Connect → WCOrder Settings → Orders Dashboard.

Here you’ll see:

Data is pulled from the custom tables {prefix}_wptwww_orders and {prefix}_wptwww_analytics which are automatically updated when users click or order via WhatsApp.

10.2 Orders Tracking (detailed list)

Go to WhatsApp Connect → WCOrder Settings → Orders Tracking.

You can:

If you do not see any data yet, place a test order via WhatsApp from the frontend and then refresh this page.

11. Other Settings

Go to WhatsApp Connect → Settings for global behaviour options.

Option Description
Enable tracking Enable/disable event tracking for widget and buttons (stored in analytics table).
Link open (new tab) When enabled, WhatsApp web / API links open in a new browser tab for desktop users.

12. Frontend Behaviour

12.1 Floating Widget

12.2 WooCommerce Buttons

12.3 Mobile vs Desktop


13. Translation & Localization

The plugin is fully ready for translation and uses the text domain wptrivo-chat-two-order.

To translate:

  1. Use a plugin like Loco Translate or Poedit.
  2. Locate the languages/wptrivo-chat-two-order.pot file.
  3. Create a new translation for your locale (e.g. wptrivo-chat-two-order-hi_IN.po).
  4. Translate the strings and save. The plugin will automatically load the correct translation file.

14. Uninstall Behaviour

When you uninstall the plugin (not just deactivate – but click Delete in Plugins screen):

This means your WhatsApp orders and analytics data will be permanently deleted. Export your data before uninstalling if you need to keep it.


15. FAQ & Troubleshooting

Q1. I activated the plugin but don’t see the widget.

Q2. WhatsApp does not open when the button is clicked.

Q3. Buttons are not appearing on product/cart pages.

Q4. Analytics dashboard is empty.

Q5. How can I get support?

For support, feature requests or customization, please contact the developer via https://wptrivo.com or your marketplace support channel.


16. Changelog

Version 1.0.0 Initial Release


17. Third-Party Libraries & Licenses

WPTrivo Chat2Order may bundle the following open-source libraries for admin UI and charts:

Library Usage License
Select2 Enhanced dropdowns for account and settings selection. MIT License
SweetAlert Styled alerts / confirmation dialogs in admin. MIT License
Chart.js (or similar) Render charts in WhatsApp Orders Dashboard. MIT License

All included third-party assets are used under their respective licenses. Please refer to each project’s official repository for more details.

“WhatsApp” and its logo are registered trademarks of their respective owners. This plugin only integrates with the publicly documented WhatsApp API/URL scheme and does not claim any official partnership.


18. Screenshots

The following screenshots show key parts of the WPTrivo Chat2Order plugin inside the WordPress admin area. You can replace the placeholder images in the Documentation/screenshots folder with real screenshots from your own site (keep the same file names).

Widget Settings
Screenshot 1: Widget Settings – configure the floating WhatsApp widget.
Account & Display Settings
Screenshot 2:Add Account & Display Settings – manage WhatsApp agents.
Account & Display Settings
Screenshot 3:Widget Account & Display Settings – manage WhatsApp agents and display rules.
WooCommerce Chat2Order Settings
Screenshot 4: WooCommerce Order Settings – buttons and templates for products and cart.
WhatsApp Orders Dashboard
Screenshot 5: WhatsApp Orders Dashboard – analytics and orders overview.
WhatsApp Orders Dashboard
Screenshot 6: Woocommerce Setting –show chat on single product page setting.
WhatsApp Orders Dashboard
Screenshot 5: Other Setting – hide agent etc.