Bản đồ tương tác (Interactive Map) đang ngày càng trở nên phổ biến trên mạng internet. Tích hợp Interactive Map vào website, doanh nghiệp sẽ có được rất nhiều ưu thế cạnh tranh. Vậy bản đồ tương tác là gì? Và làm sao để thêm bản đồ tương tác vào website WordPress? Câu trả lời sẽ có ngay trong bài viết sau của Diều Hâu. Hãy cùng tìm hiểu nhé!
1. Bản đồ tương tác (Interactive Map) là gì?
Bản đồ tương tác (Interactive Map) là loại bản đồ sử dụng GIS – Geographic Information Systems (Hệ thống thông tin địa lý toàn cầu). Do đó, các dữ liệu trên bản đồ tương tác được cập nhật khá chính xác theo thời gian thực.
Interactive Map cho phép người dùng điều hướng, thực hiện các thao tác như: phóng to – thu nhỏ, xoay, nghiêng, xác định vị trí địa lý cụ thể, tìm tuyến đường di chuyển,…. Ngoài ra, trong một số trường hợp, người dùng còn có thể truy vấn dữ liệu, xem báo cáo thống kê (ví dụ: tình hình kinh tế, xã hội, tình trạng kẹt xe,…) từ Interactive Map.
2. Tại sao nên gắn bản đồ tương tác vào website?
Việc thêm bản đồ tương tác vào trang web sẽ mang đến rất nhiều lợi thế cạnh tranh cho doanh nghiệp. Nó sẽ đặc biệt hữu ích đối với trang bán lẻ hoặc đại lý du lịch.
Dưới đây là một số lợi ích tiêu biểu của bản đồ tương tác:
- Giữ chân người dùng trên website lâu hơn: Interactive Map là một yếu tố thu hút, kích thích người dùng tương tác và lưu lại trang lâu hơn. Điều này đồng nghĩa với việc nó sẽ giúp tăng thời gian truy cập site và giảm tỷ lệ thoát (bounce rate) của website.
- Tiếp cận được nhiều khách hàng mới: Sử dụng bản đồ tương tác, bạn sẽ có thể tiếp cận với khách hàng địa phương dễ dàng hơn.
- Tăng thứ hạng trên Google: Bản đồ tương tác là một trong những yếu tố giúp Google tin tưởng website của bạn hơn. Từ đó, kết quả xếp hạng của trang sẽ được cải thiện đáng kể.
- Tạo sự tin tưởng và thuận tiện cho khách hàng: Với bản đồ tương tác, khách hàng sẽ biết được các thông tin cơ bản của công ty, địa chỉ và cách di chuyển đến cửa hàng khi cần mua sản phẩm/dịch vụ của bạn.
3. Cách thêm bản đồ tương tác vào website
Có rất nhiều cách để thêm bản đồ tương tác vào website. Trong đó, cách đơn giản và thông dụng nhất là sử dụng Google My Map. Ngoài ra, bạn cũng có thể sử dụng các công cụ khác (miễn phí hoặc trả phí) để tạo ra bản đồ của riêng mình.
Dưới đây là các hướng dẫn chi tiết:
Cách 1: Sử dụng Google My Maps
Các bước thực hiện như sau:
Bước 1: Truy cập trang web Google My Maps bằng tài khoản Google của mình.
Bước 2: Nhấp vào nút “Create a new map”.
Bước 3: Hệ thống sẽ chuyển đến trang chỉnh sửa bản đồ. Tại đây, bạn có thể tạo bản đồ cho riêng mình bằng cách chọn một bản đồ cơ sở (ví dụ: Bản đồ khu vực Hà Nội) và thêm vào vị trí của công ty/cửa hàng.
Tất cả các địa điểm đánh dấu đều được lưu dưới dạng layer. Bạn có thêm, xóa, chỉnh sửa, viết mô tả, add ảnh/video hoặc đổi tên địa điểm theo ý muốn.
(*) Ngoài ra, Google My Maps còn cung cấp thanh công cụ để giúp bạn thêm các tuyến đường, điểm đánh dấu, đo đạc khoảng cách,…
Bước 4: Sau khi chỉnh sửa bản đồ xong, bạn vào mục “Share” -> Bật chế độ “Enable link sharing” và “Public: everyone on the internet can find and access” để có thể chia sẻ bản đồ với tất cả mọi người trên website.
Bước 5: Trên menu chỉnh sửa bản đồ, nhấp vào dấu 3 chấm và chọn “Embed on my site” để lấy mã nhúng của Google Map.
Lúc này, một hộp thoại sẽ hiện ra. Bạn chỉ cần sao chép đoạn mã là được.
Bước 6: Chuyển đến trang web WordPress mà bạn muốn thêm bản đồ tương tác. Sau đó, trên giao diện block editor, bạn chỉ cần chọn block “Shortcode” và dán mã nhúng bản đồ vào là hoàn thành.
Khi đã thực hiện xong, bản đồ tương tác của bạn sẽ được hiển thị như hình ảnh bên dưới:
Cách 2: Sử dụng tool miễn phí Snazzy Maps
Nhúng Google My Maps vào website rất dễ dàng và thuận tiện. Tuy nhiên, thêm bản đồ tương tác theo cách này có một số nhược điểm là tính năng hạn chế và mẫu thiết kế bản đồ khá đơn điệu.
Do đó, để tăng tính tùy biến, bạn có thể suy nghĩ sử dụng các công cụ tạo bản đồ tương tác khác. Trong khuôn khổ bài viết này, Diều Hâu sẽ giới thiệu đến bạn cách tạo bản đồ với Snazzy Maps – một tool khá đơn giản và hoàn toàn miễn phí.
Sau đây là hướng dẫn chi tiết:
Cách tạo Google Maps API Key
Để tạo được bản đồ tương tác với Snazzy Maps, trước tiên, bạn cần phải tạo Google Maps API Key. Nếu đã có API trước đó, bạn có thể bỏ qua mục này và xem phần tiếp theo.
Các bước tạo Google Maps API Key:
Bước 1: Truy cập vào trang Google Cloud Platform bằng tài khoản Google của mình.
Bước 2: Trên thanh menu bên trái, chọn mục “API & Services” -> “Library”.
Bước 4: Hệ thống sẽ chuyển sang trang thư viện API. Tại đây, bạn tìm “Maps JavaScript API”, sau đó bấm “Enable” để kích hoạt.
Bước 5: Sau thao tác kích hoạt, hệ thống sẽ tự động chuyển sang trang “Google Maps Platform”. Lúc này, bạn hãy chọn mục “Credentials” -> “Create Credentials” -> “API Key” để tạo API Key mới.
Google sẽ tự động tạo API Key. Lúc này, bạn chỉ cần copy mã API đã được cung cấp để sử dụng.
Cách tạo bản đồ tương tác với Snazzy Maps
Bước 1: Vào trang chủ snazzymaps.com -> Đăng ký tạo tài khoản.
Bước 2: Login và chọn “Build a map” để bắt đầu tạo bản đồ.
(*) Ngoài ra, bạn có thể chọn mục “Create a Style” trên thanh menu của trang chủ Snazzy Maps để tự sáng tạo ra mẫu bản đồ theo ý thích của mình. Tham khảo thêm hướng dẫn chi tiết qua video bên dưới:
Bước 3: Hệ thống sẽ hiển thị trang chỉnh sửa bản đồ. Tại đây, bạn có thể tùy ý chỉnh sửa tất cả các thông tin mà mình muốn như:
- Cách bản đồ hiển thị (Snazzy Maps hiện có hàng trăm mẫu bản đồ trong thư viện. Bạn có thể chọn mẫu được cung cấp sẵn hoặc tự thiết kế mẫu riêng theo ý thích).
- Kích thước bản đồ và vị trí địa chỉ cần đánh dấu.
- Hình ảnh, màu sắc, kích cỡ của icon đánh dấu vị trí.
- Ngôn ngữ hiển thị của bản đồ, loại bản đồ.
- Các cử chỉ, tương tác cho phép thực hiện trên bản đồ.
- ….
Bước 4: Sau khi hoàn thành chỉnh sửa, bấm nút “Save” để lưu lại bản đồ. Lúc này, bạn cần gõ tên bản đồ và dán API Key đã tạo trước đó rồi lưu lại.
Bước 5: Nhấp vào ký hiệu code </>. Sau đó, copy dòng mã nhúng được Snazzy Maps cung cấp.
Bước 6: Cuối cùng, dán mã nhúng vào trang web muốn thêm bản đồ tương tác là hoàn thành.
Bonus: Các công cụ tạo bản đồ tương tác miễn phí phổ biến
Ngoài Snazzy Maps, còn rất nhiều các công cụ miễn phí khác có thể giúp tạo bản đồ tương tác nhanh chóng, hiệu quả. Dưới đây là danh sách để bạn tham khảo thêm:
Hy vọng với bài viết trên đây, bạn đã hiểu hơn về bản đồ tương tác (Interactive Map) và biết cách để thêm bản đồ vào website WordPress một cách nhanh chóng. Chúc bạn thành công!
