mage2kishan/module-whatsapp 问题修复 & 功能扩展

解决BUG、新增功能、兼容多环境部署,快速响应你的开发需求

邮箱:yvsm@zunyunkeji.com | QQ:316430983 | 微信:yvsm316

mage2kishan/module-whatsapp

Composer 安装命令:

composer require 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.

README 文档

README

Magento 2 WhatsApp Integration: Floating Chat Button, Product Inquiry and Category Banner (Hyva + Luma)

Magento 2.4.4 - 2.4.8 PHP 8.1 - 8.4 Hyva + Luma Live Demo & Details Packagist Upwork Top Rated Plus Website

Let shoppers reach you on WhatsApp from any page of your store. Panth WhatsApp Integration adds a floating chat button visible on every storefront page, a dedicated inquiry button on product pages with the product name and URL pre-filled, and an assistance banner on category pages. Native templates for Hyva (Alpine.js) and Luma are both included.

Product page: kishansavaliya.com/magento-2-whatsapp.html

Quick Answer

What is Panth WhatsApp Integration? It is a Magento 2 extension that adds a WhatsApp chat button to your storefront so shoppers can contact you in one tap, without filling out a form or sending an email.

What does it add to my store?

  • A floating WhatsApp button anchored to every page with configurable position and hover text.
  • A product page inquiry button that pre-fills the product name and URL into the WhatsApp message.
  • A category page assistance banner with a button so shoppers can ask for help finding a product.
  • Advanced styling via custom CSS classes for extra control over appearance.

Which themes are supported? Both Hyva (Alpine.js, no jQuery) and Luma. The right template is picked for you based on the active theme.

What does it need? Magento 2.4.4 to 2.4.8, PHP 8.1 to 8.4, and the free mage2kishan/module-core package.

Need Custom Magento 2 Development?

Get a free quote for your project in 24 hours for custom modules, Hyva themes, performance work, M1 to M2 migrations, and Adobe Commerce Cloud.

Get a Free Quote

Kishan Savaliya

Top Rated Plus on Upwork

Hire on Upwork

100% Job Success • 10+ Years Magento Experience Adobe Certified • Hyva Specialist

Panth Infotech Agency

Magento Development Team

Visit Agency

Custom Modules • Theme Design • Migrations Performance • SEO • Adobe Commerce Cloud

Visit our website: kishansavaliya.com  |  Get a quote: kishansavaliya.com/get-quote

Table of Contents

Who Is It For

  • B2B and wholesale stores where customers want to ask about bulk pricing or custom orders before buying.
  • High-ticket product stores (jewellery, furniture, electronics) where shoppers prefer a conversation before committing.
  • Fashion and apparel stores where shoppers ask about sizing, availability, or fit.
  • Regional stores in India, LATAM, MENA, and SEA where WhatsApp is the main support channel for customers.
  • Any Magento 2 merchant who wants to turn browser traffic into direct conversations without extra software.

Key Features

Floating WhatsApp Button (All Pages)

  • Always-visible chat button anchored to every page of the storefront.
  • Configurable position from four options: bottom-left, bottom-right, top-left, top-right.
  • Optional hover text (e.g. "Chat with Us") shown next to the icon on hover.
  • Pre-filled default message so shoppers land in WhatsApp with a ready-to-send greeting.
  • Pulse animation to draw attention to the button on page load.
  • Mobile-first and works on both phones and desktop browsers.

Product Page Inquiry Button

  • Dedicated WhatsApp button rendered on product detail pages.
  • Pre-filled message with the product name and product URL inserted automatically using {product_name} and {product_url} placeholders.
  • Configurable button text and button style (default, solid, outline, icon-only, text-only).
  • Works for simple, configurable, bundle, grouped, and virtual products.

Category Page Assistance Banner

  • WhatsApp inquiry button shown on category and listing pages.
  • Configurable button text and pre-filled message template for category context.
  • Lets shoppers ask for help finding the right product from within the catalog.

Advanced Styling

  • Custom CSS classes field in admin to add Tailwind or your own classes to WhatsApp elements.
  • CSS variable theming via theme-config.json so button colors inherit from your Hyva design tokens.
  • No theme file edits required for standard setup.

Hyva + Luma Ready

  • Native Hyva templates built on Alpine.js, with no jQuery, RequireJS, or Knockout added in.
  • Native Luma templates using standard Magento block and phtml patterns.
  • Theme is detected automatically through Panth_Core\Helper\Theme so the right template loads every time.
  • Works on Magento Open Source, Adobe Commerce, and Adobe Commerce Cloud.

Built to Last

  • Clean, MEQP-style code with constructor dependency injection only.
  • Per-store-view configuration so multi-country stores can use different numbers, texts, and templates per store.
  • Translation ready: every frontend label uses Magento's __() function.
  • Zero third-party scripts loaded on the page. The button is a simple server-rendered link.

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 to 2.4.8
PHP 8.1.x, 8.2.x, 8.3.x, 8.4.x
Hyva Theme 1.3+ (native Alpine.js support)
Luma Theme Native support
Required Dependency mage2kishan/module-core (free)

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

  1. Download the latest release from Packagist or from the product page.
  2. Extract it to app/code/Panth/WhatsApp/ in your Magento install.
  3. Make sure Panth_Core is installed too (required dependency).
  4. Run the commands above starting from bin/magento module:enable.

Verify Installation

bin/magento module:status Panth_WhatsApp
# Expected: Module is enabled

After install, open:

Admin -> Stores -> Configuration -> Panth Extensions -> WhatsApp Integration

Configuration

Go to Stores -> Configuration -> Panth Extensions -> WhatsApp Integration.

Setting Group Default Description
Enable WhatsApp Float Button Float Button Settings No Master toggle for the floating button on all pages.
WhatsApp Phone Number Float Button Settings +918401270422 Phone number in international format, e.g. +1234567890.
Default Message Float Button Settings Hi! I have a question... Pre-filled message when a shopper clicks the floating button.
Button Text Float Button Settings Chat with Us Hover label shown next to the floating icon.
Button Position Float Button Settings bottom-left Position of the floating button: bottom-left, bottom-right, top-left, or top-right.
Enable WhatsApp on Product Pages Product Page Settings No Toggle the inquiry button on product detail pages.
Button Text Product Page Settings Ask on WhatsApp Label on the product page button.
Message Template Product Page Settings Hi! I'm interested in {product_name}. {product_url} Pre-filled message with product context. Supports {product_name} and {product_url}.
Button Style Product Page Settings default Visual style of the button (default, solid, outline, icon-only, text-only).
Enable WhatsApp on Category Pages Category Page Settings No Toggle the inquiry button on category listing pages.
Button Text Category Page Settings Chat with Us Label on the category page button.
Message Template Category Page Settings Hi! I need help finding products... Pre-filled message for category inquiries.
Custom CSS Classes Advanced Styling (empty) Extra CSS or Tailwind classes added to WhatsApp elements. One class per line.

All settings respect Magento's scope order (default, website, store view), so each store view can have its own number, text, and templates.

How It Works

  1. The floating button block is injected into every page via layout XML.
  2. On page load, the button renders as a plain <a href="https://wa.me/..."> link with the phone number and pre-filled message URL-encoded. No JavaScript is required for the link to work.
  3. On product pages, the product name and URL are resolved server-side by the Block\Product\Button block and inserted into the message template.
  4. On category pages, the Block\Category\Banner block renders the inquiry button with its own configurable message.
  5. For Hyva themes, Alpine.js handles any animated or interactive behavior. For Luma, standard phtml templates are used.
  6. Custom CSS classes from the admin config are added to the button element at render time.

FAQ

Does this use the WhatsApp Business API?

No. The module uses the public wa.me click-to-chat URL, which is free and needs no API key or approval. Shoppers click the button and WhatsApp opens with the pre-filled message ready to send.

Do I need a WhatsApp Business account?

No, any valid WhatsApp number works. A WhatsApp Business account is recommended for commercial use because it supports auto-replies and a business profile, but it is not required.

Can I use a different number for each store view?

Yes. Every setting respects Magento's scope hierarchy, so each store view can have its own phone number, message templates, and button labels.

Does it work with Hyva themes?

Yes. The module ships native Alpine.js templates for Hyva and standard phtml templates for Luma. Theme detection is automatic through Panth_Core.

Will the button slow down my pages?

No. The button is rendered server-side as a plain HTML link. There are no third-party scripts, no external trackers, and no blocking resources loaded on any page.

Can I change the button text shown on the product page?

Yes. The "Button Text" field in the Product Page Settings group lets you set any label, such as "Ask on WhatsApp", "Inquire Now", or any translated string.

Can I control which pages show the floating button?

Yes. Use standard Magento layout XML to remove the panth.whatsapp.float block from specific handles if you want to hide it on certain page types.

Is it translation ready?

Yes. Every frontend label uses Magento's __() function, so it can be translated from a theme or language pack.

Does it work with multi-store setups?

Yes. Settings and message templates are scoped per store view, so you can run different numbers and languages across store views from one Magento install.

Support

Channel Contact
Product Page kishansavaliya.com/magento-2-whatsapp.html
Email kishansavaliyakb@gmail.com
Website kishansavaliya.com
WhatsApp +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 work, store migrations, or performance tuning? Get a free quote in 24 hours:

Get a Free Quote

Hire on Upwork    Visit Agency    View Product Page

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 that builds high quality, security focused extensions and themes for both Hyva and Luma storefronts. The extension suite covers SEO, performance, checkout, product presentation, customer engagement, and store management, with each module built to MEQP standards and tested across Magento 2.4.4 to 2.4.8.

Browse the full extension catalog on our Magento extensions page or on Packagist.

Quick Links

Resource Link
Product Page magento-2-whatsapp.html
Packagist mage2kishan/module-whatsapp
GitHub mage2sk/module-whatsapp
Website kishansavaliya.com
Free Quote kishansavaliya.com/get-quote
Upwork (Top Rated Plus) Hire Kishan Savaliya
Upwork Agency Panth Infotech
Email kishansavaliyakb@gmail.com
WhatsApp +91 84012 70422

Ready to add WhatsApp chat to your Magento 2 store?
See WhatsApp Integration

SEO Keywords: magento 2 whatsapp, magento 2 whatsapp extension, magento 2 whatsapp integration, magento 2 whatsapp chat button, magento 2 floating whatsapp button, whatsapp product inquiry magento 2, whatsapp click to chat magento, hyva whatsapp, hyva whatsapp extension, luma whatsapp extension, magento 2 whatsapp module, magento 2 click to chat, magento 2 whatsapp button, magento 2 customer chat, magento 2 whatsapp business, 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, magento 2 product inquiry whatsapp, magento 2 category whatsapp button, panth whatsapp, mage2kishan whatsapp, kishan savaliya magento, top rated plus magento developer, hire magento developer upwork, custom magento development

mage2kishan/module-whatsapp 适用场景与选型建议

mage2kishan/module-whatsapp 是一款 基于 HTML 开发的 Composer 扩展包,目前已累计 46 次下载、GitHub Stars 达 0, 最近一次更新时间为 2026 年 04 月 14 日, 在 PHP 生态内属于活跃度较高的组件。

它主要适用于以下技术方向: 「contact」 「chat」 「whatsapp」 「magento2」 「magento2-module」 「hyva」 等业务场景。在实际项目中,围绕这些方向常见需要落地的问题包括:接口对接、性能调优、并发安全、与既有框架(Laravel / ThinkPHP / Yii / Webman 等)的兼容适配,以及生产环境的日志埋点与稳定性保障。

我们在过去多个企业项目中使用过 mage2kishan/module-whatsapp 或与其功能相近的方案,如果你在选型或落地过程中遇到问题,例如 版本兼容、二次改造、私有化封装、与内部系统对接、生产 BUG 排查,欢迎联系我们协助评估。

围绕 mage2kishan/module-whatsapp 我们能提供哪些服务?
定制开发 / 二次开发

基于 mage2kishan/module-whatsapp 在你已有业务上做功能扩展、字段裁剪、UI 适配、与内部账号 / 权限 / 日志系统的深度对接。

BUG 修复 & 性能优化

线上偶发问题、内存泄漏、慢查询、并发异常等排查修复;针对高流量场景做缓存、队列、索引层面的调优。

项目外包 & 长期维护

承接完整的项目从需求 → 设计 → 开发 → 上线 → 长期运维;也可按月提供技术保姆服务。

yvsm@zunyunkeji.com QQ:316430983 微信:yvsm316 西安尊云信息科技 · 专注 PHP / Go / 分布式系统研发

统计信息

  • 总下载量: 46
  • 月度下载量: 0
  • 日度下载量: 0
  • 收藏数: 0
  • 点击次数: 47
  • 依赖项目数: 1
  • 推荐数: 0

GitHub 信息

  • Stars: 0
  • Watchers: 0
  • Forks: 1
  • 开发语言: HTML

其他信息

  • 授权协议: proprietary
  • 更新时间: 2026-04-14