Image Map Pro cho phép thêm pin, vùng vector (polygon/shape) và tooltip vào bất kỳ ảnh nào, với trình biên tập kéo-thả trên WordPress. Bạn có thể import SVG, tạo nhiều artboard/tầng (floors/layers), chỉnh hành vi click/hover, và xuất SVG/JSON.
Dành cho ai?
-
Bất động sản/Kiến trúc: sơ đồ toà nhà, mặt bằng nhiều tầng, căn hộ/diện tích có tooltip/điều hướng.
-
Giáo dục/Kỹ thuật: bản vẽ kỹ thuật, sơ đồ linh kiện có vùng “highlight” và mô tả chi tiết
-
Marketing/Infographic: ảnh sản phẩm có hotspots mở video, ảnh, nút CTA ngay trong tooltip.
Tính năng nổi bật (mô tả đúng chức năng)
-
Pins, vector shapes & polygon
Vẽ đa giác (polygon), hình vector và chấm pin trực tiếp trên ảnh; tuỳ chỉnh màu, bo tròn, viền, hiệu ứng. -
Tooltip “giàu nội dung”
Trình dựng tooltip cho phép chèn văn bản, ảnh, video YouTube, nút… sắp xếp theo lưới 12 cột; hỗ trợ mở modal/tooltip theo click/hover. -
Import SVG & làm tương tác
Nhập SVG sẵn có (ví dụ từ Illustrator) và biến từng layer/node thành vùng tương tác; có tuỳ chọn nhập một đối tượng hoặc nhiều đối tượng. -
Artboards, floors/layers
Làm việc với nhiều artboard (mặt bằng/tầng), đổi tầng qua menu; phù hợp toà nhà, khuôn viên, triển lãm. -
Responsive & fullscreen
Ảnh tương tác phản hồi kích thước tốt, có chế độ fullscreen; editor hỗ trợ zoom, undo/redo, sao chép/đổi tên shape. -
Hành vi & API
Đặt click/hover actions, hỗ trợ JavaScript/HTML API để “hook” vào logic trang, mở URL, cuộn tới section, v.v. -
Xuất/nhập & quản lý dự án
Lưu/nhúng bản đồ ảnh trong WP; có export/import (SVG/JSON) cho backup hoặc tái sử dụng. -
Cập nhật thường xuyên (nhánh 6.x)
Changelog gần đây: cải thiện tooltip editor, render SVG, sửa lỗi fullscreen/tooltips, animation z-index, các CSS fixes (từ 6.0.23 → 6.0.36).
Cách dùng nhanh (5 bước)
-
Tạo ảnh tương tác mới trong Image Map Pro → Upload ảnh gốc (sơ đồ, bản đồ, mặt bằng…).
-
Vẽ hotspots: chọn Polygon/Shape/Pin rồi vẽ vùng; đặt tên và kiểu dáng từng shape.
-
Thiết kế tooltip: mở Tooltip Builder, chèn tiêu đề/ảnh/video/nút theo layout lưới; chọn mở theo click/hover.
-
(Tuỳ chọn) Import SVG: dán mã SVG và tách thành nhiều đối tượng để gán tooltip/hành vi riêng cho từng phần.
-
Xuất bản: dùng Shortcode/Block của plugin để nhúng vào trang/bài; kiểm thử responsive/fullscreen trước khi public.
Mẹo triển khai
-
Tên lớp rõ ràng: đặt tên shape theo quy ước (tầng-khu-phòng) để tìm/ẩn/hiện nhanh khi dự án lớn.
-
Tooltip gọn, đủ ý: ưu tiên ảnh + 3–4 dòng mô tả + một CTA; tránh nhồi nội dung nặng làm chậm lần mở đầu.
-
Tối ưu SVG trước khi import: loại bỏ groups/attributes không cần, “flatten” path nếu có thể để render mượt.
-
Kiểm tra mobile & fullscreen: dùng Preview ngay trong editor và test thao tác đóng menu/tooltip trên di động.
Câu hỏi thường gặp (FAQ)
Có cần biết code không?
Không – kéo-thả hoàn toàn; nhưng có HTML/JS API nếu cần tuỳ biến nâng cao.
Tôi đã có bản vẽ SVG, có dùng lại được không?
Có – import SVG và tách thành nhiều đối tượng để gán tooltip/hành vi riêng.
Có hỗ trợ nhiều tầng/mặt bằng?
Có – quản lý floors/layers/artboard và chuyển qua lại khi xem.
Có “giật lag” trên mobile không?
Plugin responsive, đội ngũ thường xuyên sửa các lỗi liên quan fullscreen/tooltip/animation trong nhánh 6.x.
Phiên bản gần đây nhất?
Chuỗi phát hành 2025 ghi nhận đến 6.0.36 (đầu tháng 8/2025). Theme Canal

Đánh giá
Chưa có đánh giá nào.