mage2kishan / module-whatsapp
WhatsApp Integration for Magento 2 — floating chat button, product page inquiry button, and category page assistance banner. Supports Hyva and Luma themes with CSS variable-based styling.
Maintainers
Package info
github.com/mage2sk/module-whatsapp
Language:HTML
Type:magento2-module
pkg:composer/mage2kishan/module-whatsapp
Requires
- php: ~8.1.0||~8.2.0||~8.3.0||~8.4.0
- mage2kishan/module-core: ^1.0
- magento/framework: ^103.0
- magento/module-backend: ^102.0
- magento/module-catalog: ^104.0
- magento/module-config: ^101.2
- magento/module-store: ^101.1
README
WhatsApp Integration for Magento 2
Turn every page of your Magento 2 store into a live support channel. Panth WhatsApp Integration adds a floating chat button on all pages, a dedicated product page inquiry button, and a category page assistance banner — with configurable position, style, and colors, pre-filled message templates, and full support for both Hyva and Luma themes.
Convert more visitors into customers by letting them reach your team in one tap. The floating WhatsApp chat button is visible on every storefront page; the product inquiry button lets shoppers ask questions about specific SKUs with the product name and URL pre-filled; and the category page assistance banner invites browsers to get help finding the right product. Every message template, position, icon color, and button style is configurable from the Magento admin — no theme edits required.
🚀 Need Custom Magento 2 Development?
Get a free quote for your project in 24 hours — custom modules, Hyva themes, performance optimization, M1→M2 migrations, and Adobe Commerce Cloud.
Visit our website: kishansavaliya.com | Get a quote: kishansavaliya.com/get-quote
Table of Contents
- Key Features
- Use Cases
- Compatibility
- Installation
- Configuration
- Message Templates
- Theme Support
- Troubleshooting
- FAQ
- Support
- About Panth Infotech
- Quick Links
Key Features
Floating Chat Button (All Pages)
- Always-visible WhatsApp icon anchored to the storefront on every page
- Configurable position — bottom-right, bottom-left, top-right, top-left
- Configurable offsets (X/Y) so the button never collides with cookie banners or back-to-top widgets
- Customisable icon size, background color, and icon color
- Optional tooltip/label ("Chat with us", "Need help?", etc.)
- Smooth hover/entry animations out of the box
- Mobile-first responsive behaviour
Product Page Inquiry Button
- Dedicated "Ask on WhatsApp" button rendered on product pages
- Pre-filled message template with the product name, SKU, price, and URL automatically injected
- Positioned near the Add-to-Cart button (configurable)
- Works for simple, configurable, bundle, grouped, and virtual products
- Encourages B2B-style pre-purchase questions and increases conversions
Category Page Assistance Banner
- Optional "Need help finding the right product? Chat with us" banner on category listing pages
- Configurable headline, body text, and CTA label
- Displayed at the top, middle, or bottom of the product grid
- Pre-filled message includes the category name so your support team knows the context
Admin Configuration (Zero-Code)
- Single consolidated config section under
Stores → Configuration → Panth Extensions → WhatsApp - Separate toggles for each surface (floating button / product button / category banner)
- Per-store-view configuration for multi-country stores with different WhatsApp numbers
- Live preview of icon color and size
Business Hours & Greetings
- Optional business hours — show a different message / icon outside working hours
- Time-zone aware
- Optional greeting message sent as the first pre-filled line
Theme-Aware Styling
- Full Hyva (Alpine.js + Tailwind) and Luma (jQuery + Knockout) templates shipped in the module
- Styling driven by CSS variables so the button inherits your theme's brand tokens
- Theme detection via
Panth_Core— automatically serves the right template
Analytics & Tracking
- Optional Google Analytics / GTM event on button click (
whatsapp_click) - Event includes surface (
floating/product/category) and product/category context - Helps measure chat-driven conversion rate
Use Cases
- B2B wholesale stores — instant quote requests per product
- High-ticket items — jewellery, furniture, electronics where shoppers want to talk before buying
- Fashion & apparel — size and fit questions pre-purchase
- Regional stores — where WhatsApp is the dominant messaging channel (India, LATAM, MENA, SEA)
- Services & custom orders — turn the product page into a lead-capture tool
Compatibility
| Requirement | Versions Supported |
|---|---|
| Magento Open Source | 2.4.4, 2.4.5, 2.4.6, 2.4.7, 2.4.8 |
| Adobe Commerce | 2.4.4, 2.4.5, 2.4.6, 2.4.7, 2.4.8 |
| Adobe Commerce Cloud | 2.4.4 — 2.4.8 |
| PHP | 8.1.x, 8.2.x, 8.3.x, 8.4.x |
| Hyva Theme | 1.3+ |
| Luma Theme | Native support |
| Required dependency | mage2kishan/module-core |
Installation
Composer Installation (Recommended)
composer require mage2kishan/module-whatsapp bin/magento module:enable Panth_Core Panth_WhatsApp bin/magento setup:upgrade bin/magento setup:di:compile bin/magento setup:static-content:deploy -f bin/magento cache:flush
Manual Installation via ZIP
- Download the latest release from Packagist or GitHub
- Extract to
app/code/Panth/WhatsApp/ - Ensure
Panth_Coreis installed atapp/code/Panth/Core/ - Run the same commands listed above
Verify Installation
bin/magento module:status Panth_WhatsApp
# Expected output: Module is enabled
Then navigate to:
Admin → Stores → Configuration → Panth Extensions → WhatsApp
Configuration
All settings live at Stores → Configuration → Panth Extensions → WhatsApp.
General
| Setting | Description |
|---|---|
| Enable WhatsApp Module | Master toggle for the entire module |
| WhatsApp Number | Destination number in international format (e.g. +918401270422) |
| Enable on Mobile / Desktop | Show only on selected devices |
Floating Chat Button
| Setting | Description |
|---|---|
| Enable Floating Button | Turn the storefront-wide button on/off |
| Position | bottom-right, bottom-left, top-right, top-left |
| Offset X / Y | Pixel offset from the edge |
| Icon Size | Small / Medium / Large or custom px |
| Icon Background Color | Hex color picker |
| Icon Color | Hex color picker |
| Tooltip Text | Optional label shown next to the button |
| Pre-filled Message | Default greeting (supports {store_name}) |
Product Page Inquiry Button
| Setting | Description |
|---|---|
| Enable Product Inquiry Button | Toggle the per-product button |
| Button Label | e.g. "Ask on WhatsApp" |
| Button Position | Before / after Add-to-Cart |
| Pre-filled Message | Template with variables — see below |
Category Page Assistance Banner
| Setting | Description |
|---|---|
| Enable Category Banner | Toggle the category-page banner |
| Banner Position | Top / middle / bottom of the product grid |
| Headline | e.g. "Need help finding the right product?" |
| CTA Label | e.g. "Chat with us on WhatsApp" |
| Pre-filled Message | Template with {category_name} variable |
Business Hours
| Setting | Description |
|---|---|
| Enable Business Hours | Show different behaviour outside working hours |
| Time Zone | Store time zone |
| Working Hours | Per-day open/close times |
| Offline Message | Shown outside business hours |
Message Templates
Pre-filled message templates support these variables:
| Variable | Available on | Description |
|---|---|---|
{store_name} |
All | Store view name |
{product_name} |
Product button | Current product name |
{product_sku} |
Product button | Current product SKU |
{product_price} |
Product button | Final price with currency |
{product_url} |
Product button | Canonical product URL |
{category_name} |
Category banner | Current category name |
{category_url} |
Category banner | Canonical category URL |
{customer_name} |
All (logged in) | Current customer first name |
Example product template:
Hi {store_name}, I have a question about {product_name} (SKU {product_sku}) — {product_url}
Theme Support
Hyva
Templates are Alpine.js-powered with Tailwind utility classes. No extra dependencies, no jQuery, no Knockout — drop-in compatible with any Hyva-based theme.
Luma
Templates use the standard Luma block/phtml pattern with graceful CSS. No RequireJS mixin conflicts, no layout XML overrides of core containers.
Theme detection is handled automatically by Panth_Core\Helper\Theme — the correct template set is selected on every page load.
Troubleshooting
| Issue | Resolution |
|---|---|
| Floating button not visible | Check "Enable Floating Button" and flush cache; verify phone number format |
| Product button not rendering | Confirm product type is enabled; flush full-page cache |
| Wrong theme template loaded | Run bin/magento cache:flush and confirm Panth_Core is enabled |
| WhatsApp opens with empty message | Template variables may contain unsupported characters — review the template |
| Number format rejected by WhatsApp | Use international format without spaces or dashes (e.g. +918401270422) |
FAQ
Do I need a WhatsApp Business account?
No — any valid WhatsApp number works. However, a WhatsApp Business account is strongly recommended for commercial use (auto-replies, labels, catalog).
Does this use the WhatsApp Business API?
No. This module uses the public wa.me click-to-chat link, which is free and requires no API setup. For automated outbound messaging you would need the WhatsApp Business API (separate product).
Can I use different numbers for different stores?
Yes. Every setting respects Magento's scope hierarchy (default → website → store view), so each store view can have its own number, templates, and colors.
Does it work with Hyva?
Yes. Full native Hyva templates are shipped. No compatibility module needed — the module ships with both Hyva and Luma templates and switches automatically.
Will it slow down my store?
No. The button is rendered server-side as a simple <a> tag. There are no third-party scripts, no trackers, and no blocking resources.
Can I track clicks in Google Analytics?
Yes. Enable Analytics Events in the config — every click fires a whatsapp_click event with surface and context.
Does it support multi-language stores?
Yes. All admin and frontend strings use Magento's __() translation function and can be translated to any language.
Can I hide the button on specific pages?
Yes. Use standard Magento layout XML to remove the panth.whatsapp.floating block from specific handles.
Support
| Channel | Contact |
|---|---|
| kishansavaliyakb@gmail.com | |
| Website | kishansavaliya.com |
| +91 84012 70422 | |
| GitHub Issues | github.com/mage2sk/module-whatsapp/issues |
| Upwork (Top Rated Plus) | Hire Kishan Savaliya |
| Upwork Agency | Panth Infotech |
Response time: 1-2 business days.
💼 Need Custom Magento Development?
Looking for custom Magento module development, Hyva theme customization, store migrations, or performance optimization? Get a free quote in 24 hours:
About Panth Infotech
Built and maintained by Kishan Savaliya — kishansavaliya.com — a Top Rated Plus Magento developer on Upwork with 10+ years of eCommerce experience.
Panth Infotech is a Magento 2 development agency specializing in high-quality, security-focused extensions and themes for both Hyva and Luma storefronts. Our extension suite covers SEO, performance, checkout, product presentation, customer engagement, and store management — over 34 modules built to MEQP standards and tested across Magento 2.4.4 to 2.4.8.
Browse the full extension catalog on the Adobe Commerce Marketplace or Packagist.
Quick Links
- 🌐 Website: kishansavaliya.com
- 💬 Get a Quote: kishansavaliya.com/get-quote
- 👨💻 Upwork Profile (Top Rated Plus): upwork.com/freelancers/~016dd1767321100e21
- 🏢 Upwork Agency: upwork.com/agencies/1881421506131960778
- 📦 Packagist: packagist.org/packages/mage2kishan/module-whatsapp
- 🐙 GitHub: github.com/mage2sk/module-whatsapp
- 📧 Email: kishansavaliyakb@gmail.com
- 📱 WhatsApp: +91 84012 70422
Ready to add WhatsApp chat to your Magento 2 store?
SEO Keywords: magento 2 whatsapp, whatsapp chat button, whatsapp product inquiry, whatsapp business magento, customer support chat, magento 2 whatsapp integration, magento 2 floating whatsapp button, whatsapp click to chat magento, hyva whatsapp module, luma whatsapp extension, magento 2 product inquiry, magento 2 live chat, magento 2 customer support, wa.me magento, whatsapp contact button magento, magento 2.4.8 whatsapp, php 8.4 magento whatsapp, magento 2 b2b whatsapp, whatsapp lead capture magento, panth whatsapp, mage2kishan whatsapp, kishan savaliya magento, top rated plus magento developer, hire magento developer upwork, custom magento development, magento 2 hyva development