Addon 2x [VNXF] Floating Contact - Nút liên hệ nổi đa kênh kết nối khách truy cập với bạn chỉ trong một cú nhấp cho XenForo 2.3 1.2.1

PVS

Super Moderator
Thành viên BQT
[VNXF] Floating Contact là add-on dành cho XenForo 2.3+, giúp bạn thêm một nút liên hệ nổi (floating button) cố định ở góc màn hình. Khi người dùng nhấn vào, một danh sách các kênh liên hệ sẽ bung ra với hiệu ứng trượt mượt mà — giúp khách truy cập dễ dàng liên lạc với quản trị viên mà không cần rời khỏi trang.

VNXF-FloatingContact.jpg

Add-on được thiết kế tối giản, hoạt động mượt trên cả desktop và mobile, không gây ảnh hưởng đến hiệu năng trang. Tất cả các kênh liên hệ đều được cấu hình trực tiếp từ Admin CP — không cần chỉnh sửa code hay template.

Tính năng nổi bật​

  • 6 kênh liên hệ — Facebook, Zalo, Telegram, YouTube, Email, Điện thoại
  • Hiệu ứng mượt mà — Cubic-bezier animation khi mở/đóng danh sách
  • Tùy chọn vị trí — Hiển thị góc trái hoặc góc phải màn hình
  • Responsive hoàn hảo — Tương thích mọi kích thước màn hình
  • Cấu hình dễ dàng — Quản lý toàn bộ từ Admin CP Options
  • Siêu nhẹ — Không thư viện ngoài, không ảnh hưởng tốc độ
  • Brand Colors — Mỗi kênh mang đúng màu thương hiệu riêng
  • Tooltip thông minh — Hiện nhãn tên kênh khi hover mỗi nút

Các kênh liên hệ được hỗ trợ​


Add-on hỗ trợ sẵn 6 kênh liên hệ phổ biến. Chỉ cần điền link/thông tin vào Options — kênh nào để trống sẽ tự động ẩn:

KênhMô tảLoại
FacebookLiên kết đến Fanpage hoặc Profile FacebookSocial
ZaloChat Zalo trực tiếp qua zalo.meChat
TelegramLiên kết t.me đến kênh hoặc cá nhânChat
YouTubeDẫn đến kênh YouTubeMedia
EmailMở ứng dụng email với mailto:Contact
Điện thoạiGọi trực tiếp trên mobile qua tel:Call



Tùy chọn cấu hình (Admin CP)​


Tất cả được quản lý tại Admin CP → Setup → Options → [VNXF] Floating Contact:

Tùy chọnMô tảMặc định
EnableBật/tắt nút liên hệ nổi toàn siteBật
PositionVị trí hiển thị: góc trái hoặc góc phảiPhải
FacebookURL trang FacebookTrống
ZaloURL Zalo (zalo.me/...)Trống
TelegramURL Telegram (t.me/...)Trống
YouTubeURL kênh YouTubeTrống
EmailĐịa chỉ email liên hệTrống
PhoneSố điện thoại liên hệTrống

Mẹo: Kênh nào không cần sử dụng, chỉ cần để trống — nút đó sẽ tự động không hiển thị trên trang.

Hướng dẫn cài đặt​

  1. Tải add-on
  2. Cài đặt từ Admin CP — Vào Admin CP → Add-ons → Install/upgrade from archive
    Hoặc sử dụng CLI:
    Mã:
    php cmd.php xf:addon-install VNXF/FloatingContact
  3. Cấu hình kênh liên hệ — Vào Options → [VNXF] Floating Contact và điền thông tin các kênh bạn muốn hiển thị
  4. Hoàn tất! — Nút liên hệ nổi sẽ xuất hiện ngay trên tất cả các trang của forum

️ Yêu cầu hệ thống​

  • XenForo 2.3.0+
  • PHP 8.0+
  • Không yêu cầu thư viện ngoài

Ghi chú kỹ thuật​


Add-on sử dụng Template Modification để inject vào PAGE_CONTAINER — không ghi đè template gốc, hoàn toàn tương thích với các add-on và style khác.

JavaScript được viết theo chuẩn XenForo Element Handler (XF.Element.register), tự động đóng khi click bên ngoài widget, và không sử dụng bất kỳ thư viện bên thứ 3 nào.

Lưu ý: Add-on sử dụng z-index: 9999. Nếu site bạn có element khác sử dụng z-index cao, có thể cần điều chỉnh trong template vnxf_floating_contact.less.


Chúc các bạn thành công.


PVS - VNXF​
 

Đính kèm

  • VNXF-FloatingContact-1.2.1.zip
    VNXF-FloatingContact-1.2.1.zip
    115.1 KB · Lượt xem: 5
  • VNXF-FloatingContact-  (1).png
    VNXF-FloatingContact- (1).png
    41 KB · Lượt xem: 10
  • VNXF-FloatingContact-  (2).png
    VNXF-FloatingContact- (2).png
    46.8 KB · Lượt xem: 10
  • VNXF-FloatingContact-  (3).png
    VNXF-FloatingContact- (3).png
    66.3 KB · Lượt xem: 8
Back
Top