Hướng dẫn nhúng bản đồ Bing vào website WordPress

Kiến thức hosting

Bạn có muốn nhúng Bản đồ Bing trên trang web WordPress của mình không? Nếu bạn đang tìm kiếm một sự thay thế Google Maps , thì Bing Maps là ứng cử viên phù hợp với bạn.

Tương tự như Google Maps, bạn có thể sử dụng Bing Maps để hiển thị chỉ đường, lưu lượng truy cập, tuyến đường và hướng dẫn điều hướng trên trang web WordPress của bạn. Vì nó thuộc sở hữu của Microsoft, nó là một ứng dụng bản đồ tuyệt vời với vô số dữ liệu hữu ích.

Trong bài viết này, chúng tôi sẽ chỉ cho bạn cách dễ dàng nhúng Bing Maps vào WordPress, từng bước một.

Cách nhúng Bản đồ Bing trong WordPress

Thêm Bản đồ Bing trong WordPress (Không cần Plugin)

Điều đầu tiên bạn cần làm là truy cập trang web Bing Maps và tìm kiếm vị trí hoặc bản đồ bạn muốn nhúng.

Khi bạn đã tìm thấy vị trí, nhấp vào tùy chọn ‘Khác’ với biểu tượng ba chấm và chọn tùy chọn ‘Nhúng bản đồ’.

Nhúng tùy chọn Bản đồ trong Bản đồ Bing

Sau đó, nó sẽ mở một tab mới nơi bạn có thể tùy chỉnh bản đồ để nhúng vào trang web của mình.

Tùy chỉnh Bing Map để nhúng vào trang web WordPress

Bạn có thể chọn kích thước bản đồ, loại bản đồ (bản đồ tĩnh hoặc có thể kéo), kiểu bản đồ (đường hoặc trên không) và liên kết bản đồ. Xem lại các tùy chọn tùy chỉnh và sau đó nhấp vào Tạo mã.

Sau đó, nó sẽ cung cấp cho bạn một đoạn mã. Hãy tiếp tục và sao chép mã bởi vì bạn sẽ cần nó trong bước tiếp theo.

đã tạo Mã nhúng cho Bản đồ Bing

Bây giờ, hãy quay lại trang web WordPress của bạn và tạo một trang mới hoặc chỉnh sửa trang hiện có nơi bạn muốn thêm bản đồ.

Trên màn hình chỉnh sửa trang, nhấp vào biểu tượng Thêm khối mới và chọn khối HTML tùy chỉnh.

Thêm khối HTML tùy chỉnh trong Trình chỉnh sửa trang WordPress

Sau đó, dán mã nhúng Bing Map mà bạn đã sao chép trước đó vào trường HTML.

Mã bản đồ Bing được thêm vào trong WordPress Editor

Bây giờ bạn có thể lưu hoặc xuất bản trang của mình và nhấp vào nút xem trước để xem bản đồ được nhúng trong trang của bạn. Đây là cách Bing Map xuất hiện trên trang web demo của chúng tôi.

Bản đồ Bing được nhúng trong WordPress theo cách thủ công

Thêm Bản đồ Bing bằng Plugin

Nếu bạn chỉ cần nhúng một bản đồ trên trang web của mình, thì phương pháp thủ công được hiển thị ở trên là lựa chọn tốt nhất.

Tuy nhiên, nếu bạn điều hành một trang web mà bạn thường cần thêm bản đồ, thì việc sử dụng plugin để thêm Bản đồ Bing sẽ dễ dàng hơn.

Điều đầu tiên bạn cần làm là cài đặt và kích hoạt plugin Ultimate Maps by Supsystic . Đây là một plugin bản đồ WordPress miễn phí cho phép bạn nhúng các bản đồ Bing, bản đồ Leaflet và các lựa chọn thay thế Google Maps khác trong blog WordPress của bạn.

Để sử dụng plugin này với bản đồ Bing, bạn sẽ cần phải có Khóa API Bing Map.

Chỉ cần tạo một tài khoản trên trang web Bing Maps Dev Center . Nếu bạn đã có tài khoản Microsoft, thì bạn chỉ cần đăng nhập bằng thông tin đăng nhập tài khoản của mình.

Đăng nhập vào Trung tâm Bing Dev

Khi bạn đã đăng nhập vào tài khoản của mình, bạn cần nhấp vào menu ‘Tài khoản của tôi’ và chọn tùy chọn ‘Chìa khóa của tôi’.

Bing Maps Dev Center Tùy chọn phím của tôi

Trên màn hình tiếp theo, bạn cần điền thông tin trang web của bạn để tạo khóa.

Tạo khóa API Bing Map để nhúng vào WordPress

Sau đó, bạn có thể thấy thông báo ‘Khóa được tạo thành công’ và các chi tiết chính trong hộp.

Đã tạo khóa API Bing Maps

Bạn có thể chỉ cần nhấp vào liên kết ‘Sao chép khóa’ hoặc liên kết ‘Hiển thị khóa’ và sao chép khóa API của Bản đồ Bing.

Sau đó, bạn cần dán khóa trong cài đặt plugin.

Truy cập Ultimate Maps by Supsystic » Settings từ bảng điều khiển của bạn và chọn ‘Bing Microsoft’ làm công cụ bản đồ của bạn. Sau đó, dán khóa API bạn đã sao chép trước đó vào trường khóa API Bing Maps.

Dán khóa API Bing Maps của bạn trong Ultimate Maps bằng cài đặt plugin Supsystic

Đừng quên lưu cài đặt plugin của bạn.

Sau đó, bạn cần thêm các danh mục đánh dấu bằng cách truy cập Ultimate Maps by Supsystic » Marker Categories » Add Category .

Thêm danh mục đánh dấu cho bản đồ Bing

Tạo nhiều danh mục đánh dấu như bạn cần.

Tiếp theo, nhấp vào menu Thêm Bản đồ để tạo bản đồ mới. Nhập tên cho bản đồ của bạn, xác định chiều rộng và chiều cao của bản đồ, chọn chế độ thanh điều hướng, v.v.

Thêm bản đồ Bing bằng cách sử dụng plugin

Bạn cũng có thể định cấu hình các tùy chọn để làm cho bản đồ có thể kéo được, sử dụng nhấp đúp để thu phóng và hơn thế nữa. Quan trọng nhất trong tất cả, nhập vị trí để hiển thị trong trung tâm bản đồ.

Tiếp theo, cuộn xuống và cấu hình nhiều tùy chọn bên dưới. Sau khi hoàn tất, nhấp vào nút ‘Lưu bản đồ’ bên dưới hộp xem trước bản đồ.

Sau đó, bạn có thể thêm các điểm đánh dấu để hiển thị các điểm vị trí chính trong bản đồ của bạn. Bấm vào tab Đánh dấu, rồi thêm tên cho nhà sản xuất của bạn.

Thêm điểm đánh dấu mới cho bản đồ Bing trong WordPress

Bạn có thể sử dụng tên của địa điểm hoặc tổ chức làm tên đánh dấu.

Ví dụ: chúng tôi đã sử dụng ‘Đại học Florida’ làm tên đánh dấu vì chúng tôi muốn hiển thị một số trường cao đẳng tốt nhất ở Florida trong bản đồ demo của chúng tôi.

Sau đó, bạn có thể thêm văn bản mô tả đánh dấu cũng như hình ảnh.

Cuộn xuống và chọn một biểu tượng cho điểm đánh dấu mới của bạn. Tiếp theo, bạn cần nhập địa chỉ để trỏ điểm đánh dấu. Và, cũng chọn danh mục đánh dấu.

Lưu điểm đánh dấu cho Bản đồ Bing

Xem lại tất cả các tùy chọn khác, rồi bấm vào nút ‘Lưu điểm đánh dấu’.

Bạn có thể thêm nhiều điểm đánh dấu bằng cách làm theo các bước tương tự.

Khi bạn thêm các điểm đánh dấu, bạn có thể xem trước chúng trực tiếp trên hộp xem trước. Khi bạn hài lòng với bản đồ của mình, hãy điều hướng đến tùy chọn ‘Bản đồ mã ngắn’ ở trên cùng và sao chép mã ngắn.

Sao chép mã bản đồ Bing để nhúng vào WordPress

Sau đó, tạo một trang mới hoặc chỉnh sửa một trang hiện có để nhúng bản đồ Bing mới của bạn.

Khi đã vào trình chỉnh sửa trang, nhấp vào biểu tượng Thêm khối mới và chọn khối Shortcode trong phần Widgets.

Thêm khối mã ngắn trong WordPress

Bây giờ bạn cần dán mã ngắn bản đồ Bing mà bạn đã sao chép trước đó.

Dán BIng Bản đồ nhúng Shortcode trong Trình chỉnh sửa trang WordPress

Sau khi hoàn tất, hãy lưu hoặc xuất bản trang của bạn và xem trước bản đồ Bing trông như thế nào trên trang web của bạn.

Đây là cách bản đồ Bing nhúng xuất hiện trên trang web demo của chúng tôi.

Bản đồ Bing được nhúng trong WordPress bằng cách sử dụng Plugin

Chúng tôi hy vọng bài viết này đã giúp bạn tìm hiểu cách nhúng Bing Maps vào WordPress một cách dễ dàng

Leave a Reply

Your email address will not be published. Required fields are marked *