Website Floating Icon Button for WhatsApp, Messenger, SMS, Instagram, Telegram & More
by Taqnix https://www.taqnix.com$ 9.93
| Availability |
Odoo Online
Odoo.sh
On Premise
|
| Odoo Apps Dependencies |
•
Website (website)
• Discuss (mail) |
| Lines of code | 277 |
| Technical Name |
taqnix_whatsapp_chat |
| License | LGPL-3 |
| Website | https://www.taqnix.com |
| Versions | 16.0 17.0 18.0 19.0 |
| Availability |
Odoo Online
Odoo.sh
On Premise
|
| Odoo Apps Dependencies |
•
Website (website)
• Discuss (mail) |
| Lines of code | 277 |
| Technical Name |
taqnix_whatsapp_chat |
| License | LGPL-3 |
| Website | https://www.taqnix.com |
| Versions | 16.0 17.0 18.0 19.0 |
Website Floating Icon Button for WhatsApp, Messenger, SMS, Instagram, Telegram & More
Having trouble? Click above to reach our official support channel.
Multi-Platform Support
WhatsApp, Messenger, SMS, Telegram & More. One widget to rule all your communication channels.
The Ultimate Mobile-First Experience
Pixel-Perfect UI
Automatically adjusts to any screen size for a native app feel.
Thumb-Friendly
Ergonomic button placement ensures easy 1-handed operation.
Zero Latency
Lightweight code ensures instant loading on any network.
Dark Mode Ready
Adapts to system themes for maximum user comfort.
Front-End WhatsApp Icon
Instant connectivity with sleek, mobile-ready icons.
Configuration
Fine-tune your experience with a centralized dashboard designed for native Odoo integration.
Auto-Sync
Instant synchronization with your API credentials.
Smart Toggles
Enable auto-replies and logging with a single click.
Secure Auth
Enterprise-grade encryption for all tokens.
Customization Options
- Activate Chat Button (enable/disable)
- Button Icon (Font Awesome class)
- Link (eg. full WhatsApp link or phone number)
- Default Message (filled when clicked)
- Button Text (displayed beside the icon)
- Button Position (Right, Left, etc.)
- Button Background Color (hex code)
- Button Text Color (hex code)
- Button Icon Color (hex code)
- Show on Mobile (toggle visibility)
- Show on Desktop (toggle visibility)
Key Features
Floating WhatsApp icon visible on all website pages.
Fully responsive supports both desktop and mobile views.
Opens a WhatsApp chat with a predefined number and message.
Customizable icon, position, color, and display text.
Admin-configurable via Website Settings in the backend.
Option to display on mobile only, desktop only, or both.
How It Works
Frontend Experience
The module injects a floating <a> link using a high-performance QWeb template.
The icon stays fixed in the viewport (default bottom-right) for easy access.
Clicking it instantly triggers the WhatsApp API without slowing down your site.
https://wa.me/<number>?text=<message>
Backend Configuration
Manage everything from Website > Configuration > Settings.
Control Panel:
- Enable/Disable with one click
- Smart country code detection
- Pre-filled greeting templates
- Dynamic appearance styling
- Device-specific visibility filters
Installation Process
01. Extraction
Extract the downloaded ZIP: taqnix_whatsapp_chat.zip.
02. Deployment
Copy the module folder to your custom Odoo modules directory and restart the Odoo server.
03. Activation
Update the App List from the Odoo Apps menu and install the taqnix_whatsapp_chat module.
04. Configuration
Go to Website > Configuration > Settings to customize your chat button.
Configuration Panel
Field explanations in serial order.
Enable WhatsApp
Toggle to show or hide the floating button.
Button Icon
Font Awesome class (e.g., fa-whatsapp, fa-comment).
WhatsApp Number
WhatsApp number with country code or complete link.
Default Message
Message auto-filled when chat opens.
Button Position
Icon alignment (Right, Left, etc.).
Button Text
Optional text displayed beside the icon.
Button Color
Background color of the button.
Text Color
Color of text inside the button.
Icon Color
Color of the WhatsApp icon.
Show on Mobile
Whether to display the icon on mobile devices.
Show on Desktop
Whether to display the icon on desktops/laptops.
Frontend Display Behavior
|
A.
|
The icon is fixed at the configured location (e.g., bottom-right). |
|
B.
|
It remains visible across all website pages. |
|
C.
|
On click, it instantly opens WhatsApp with your custom number and message. |
Below is the core QWeb snippet:
<a href="https://wa.me/{{ phone_number }}" target="_blank" class="whatsapp-float">
<img src="/taqnix_whatsapp_chat/static/src/img/whatsapp-icon.png" alt="WhatsApp" />
</a>
CSS Styling Snippet
Take full control of the appearance with our developer-friendly CSS structure.
Fully Themeable
Modify colors and shadows to match your brand perfectly.
Dynamic Positioning
Set pixel-perfect offsets for both desktop and mobile views.
Zero Lag Performance
Optimized CSS classes that don't interfere with your Odoo theme speed.
.whatsapp-float { position: fixed; bottom: 20px; right: 20px; z-index: 1000; transition: all 0.3s ease; } .whatsapp-float:hover { transform: scale(1.1); filter: brightness(1.1); }
Example Contacts
Ready-to-use URL formats for your configuration
Facebook Page
Twitter (X)
Snapchat
Phone Call
SMS Protocol
Email Link
Telegram
Messenger
Professional Support
Reliable assistance for your business needs.
Please log in to comment on this module
There are no ratings yet!
fghjk
hj
fghjk
hj
fghjk
hj
fghjk
hj
fghjk
hj
fghjk
hj
fghjk
hj
fghjk
hj