Bạn muốn thêm công cụ định vị cửa hàng Google Maps vào WordPress? Công cụ định vị cửa hàng là bản đồ chỉ đến địa điểm kinh doanh của bạn.
Cho phép người dùng xác định vị trí trên bản đồ, tìm chỉ đường lái xe hoặc chia sẻ vị trí với bạn bè. Thêm một công cụ định vị cửa hàng vào trang web doanh nghiệp của bạn hoặc thậm chí một cửa hàng trực tuyến giúp bạn ngay lập tức có được sự tin tưởng của người dùng.
Trong bài viết này, chúng tôi sẽ chỉ cho bạn cách dễ dàng thêm công cụ định vị cửa hàng Google Maps vào WordPress.
Google Maps đã giới thiệu API trả phí để hiển thị bản đồ trên các trang web. Họ vẫn cung cấp tùy chọn miễn phí hạn chế để nhúng bản đồ Google trên các trang web nhỏ.
Hầu hết các plugin Google Maps cho WordPress đều sử dụng Google API để truy xuất và hiển thị bản đồ. Nếu bạn muốn sử dụng plugin Google Maps, bạn sẽ cần phải đăng ký với nền tảng Google API và bật tùy chọn thanh toán.
Đây là một dịch vụ trả tiền khi bạn đi, có nghĩa là bạn sẽ bị tính phí dựa trên số lượng cuộc gọi API được thực hiện từ trang web của bạn.
Chúng tôi sẽ chỉ cho bạn các phương pháp miễn phí và trả phí với những ưu điểm và nhược điểm của chúng, sau đó bạn có thể chọn phương pháp phù hợp nhất với nhu cầu của mình.
phương pháp 1. Thêm Google Maps vào trang web của bạn miễn phí
Phương pháp này dễ dàng và miễn phí. Nhược điểm là bạn không thể hiển thị nhiều cửa hàng trên một bản đồ.
Chúng tôi khuyên người dùng chỉ muốn thêm một vị trí cửa hàng Google Maps duy nhất trên trang web của họ.
Trước tiên, bạn phải truy cập trang web Google Maps trên máy tính của mình. Sau đó, nhập địa chỉ cửa hàng của bạn vào trường tìm kiếm và Google Maps sẽ hiển thị địa chỉ đó trên bản đồ với điểm đánh dấu được ghim trên bản đồ.
Hãy chắc chắn để đặt điểm đánh dấu ở vị trí chính xác. Bạn có thể chọn mức thu phóng bằng cách nhấp vào nút thu phóng. Khi bạn hài lòng với mức thu phóng, bạn nên nhấp vào nút chia sẻ ở cột bên trái.
Một cửa sổ bật lên sẽ xuất hiện nơi bạn nên chuyển sang tab “Nhúng bản đồ”. Bây giờ bạn sẽ thấy vị trí tìm kiếm của mình trên bản đồ với mã HTML.
Nhấp vào liên kết Sao chép HTML để nhận mã nhúng.
Bây giờ hãy đi qua khu vực quản trị của trang web WordPress của bạn. Khi ở trong khu vực quản trị, hãy tiếp tục và chỉnh sửa bài đăng hoặc trang nơi bạn muốn hiển thị bản đồ vị trí cửa hàng.
Thông thường, người dùng thêm bản đồ vị trí cửa hàng vào trang mẫu liên hệ của họ với số điện thoại và giờ mở cửa.
Trên màn hình chỉnh sửa tiếp theo, bạn phải thêm một khối HTML tùy chỉnh.
Trong vùng văn bản của khối HTML tùy chỉnh, bạn phải dán mã mà bạn đã sao chép từ Google Maps.
Bây giờ bạn có thể chuyển sang tab xem trước để xem Google Maps được nhúng trong trang của bạn. Nó sẽ hiển thị vị trí cửa hàng được đánh dấu của bạn trên bản đồ với các liên kết đến địa chỉ hoặc để lưu vị trí.
phương pháp 2. Thêm công cụ định vị cửa hàng Google Maps bằng cách sử dụng plugin WordPress
Phương pháp này được khuyến nghị cho người dùng muốn hiển thị nhiều vị trí cửa hàng trên bản đồ Google.
Điều đầu tiên cần làm là cài đặt và kích hoạt plugin WP Store Locator. Để biết thêm chi tiết, hãy xem hướng dẫn từng bước của chúng tôi về cách cài đặt plugin WordPress.
Đây là plugin Google Maps miễn phí cho phép bạn tạo bản đồ tùy chỉnh với nhiều vị trí cửa hàng và trường tùy chỉnh.
Nhược điểm của phương pháp này là nó yêu cầu bạn thêm khóa API. Bạn sẽ cần cung cấp thông tin thanh toán để sử dụng khóa API. Để biết giá cả và thông tin khác, hãy truy cập trang web Google Maps Platform.
Xong, hãy bắt đầu.
Anh ấy đã qua 1. Tạo khóa API Google Maps
Để sử dụng plugin WP Store Locator, bạn sẽ cần tạo hai khóa API. Cái đầu tiên được gọi là khóa API của trình duyệt và cái thứ hai được gọi là khóa máy chủ.
Trước tiên hãy bắt đầu với khóa trình duyệt. Nhấp vào liên kết này trong Bảng điều khiển dành cho nhà phát triển của Google và nó sẽ đưa bạn đến trang web Google API với tất cả các API cần thiết được bật.
Bạn phải tạo một dự án mới và đặt tên cho nó để giúp bạn xác định nó. Sau đó, bạn sẽ phải chờ một lát trong khi giao diện điều khiển tạo dự án cho bạn.
Sau đó, bạn sẽ được chuyển hướng đến trang cấu hình khóa API. Bạn phải cung cấp một tiêu đề cho khóa API của mình để bạn có thể dễ dàng xác định nó là khóa API trình duyệt cho dự án Google Maps của bạn.
Tiếp theo, bạn phải đặt “Hạn chế ứng dụng” trong “Tham chiếu HTTP”. Bên dưới đó, bạn phải đặt trường “Chấp nhận yêu cầu từ” trên tên miền của bạn theo định dạng sau.
https://example.com/*
https: //*.example.com/* (nếu bạn đang sử dụng tên miền phụ)
Cuối cùng, bấm vào nút “Tạo”. Bảng điều khiển bây giờ sẽ lưu cài đặt của bạn và hiển thị cho bạn khóa trình duyệt. Bạn phải sao chép và dán khóa này vào trình soạn thảo văn bản, bạn sẽ cần nó sau.
Tiếp theo, bạn phải tạo khóa API máy chủ. Nhấp vào liên kết này trong Bảng điều khiển dành cho nhà phát triển của Google và nó sẽ đưa bạn trực tiếp đến bảng điều khiển với các API đã chọn được bật.
Bạn sẽ thấy trang tạo dự án một lần nữa. Tuy nhiên, vì bạn đã tạo một dự án, bạn có thể nhấp vào menu thả xuống và chọn dự án của bạn.
Sau đó, bạn sẽ được chuyển hướng đến trang cấu hình API. Cung cấp tên cho khóa API này để giúp bạn nhận ra nó là khóa máy chủ.
Trong phần “Hạn chế ứng dụng”, bạn phải chọn Địa chỉ IP. Về cơ bản, chúng tôi đang bảo Google chỉ chấp nhận các yêu cầu máy chủ đến từ các địa chỉ IP cụ thể.
Bây giờ bạn sẽ cần yêu cầu nhà cung cấp dịch vụ lưu trữ WordPress của bạn cho bạn biết phạm vi IP được sử dụng bởi tài khoản lưu trữ của bạn. Nó sẽ có định dạng sau:
172.16.0.0/ 12
Sau đó, bạn cần nhấp vào nút “Tạo” để lưu cài đặt của mình và sao chép khóa API từ máy chủ.
Anh ấy đã qua 2. Thiết lập plugin WP Store Locator
Khi bạn đã tạo khóa API, bạn nên truy cập Cửa hàng định vị »Cài đặt trang để cấu hình plugin.
Nhập trình duyệt Google Maps và các khóa API của máy chủ mà bạn đã tạo trước đó. Tiếp theo, chọn ngôn ngữ và khu vực Bản đồ, sau đó nhấp vào nút Lưu Thay đổi để lưu cài đặt của bạn.
Bây giờ, bạn cần cuộn xuống trang cài đặt đến phần “Bản đồ” và nhập điểm bắt đầu cho bản đồ. Điểm xuất phát này có thể là một thành phố hoặc một quốc gia, vì vậy người dùng có thể thấy các dấu trang nằm ở các vị trí khác nhau.
Có nhiều tùy chọn khác trên trang cài đặt bao gồm kiểu bản đồ, mức thu phóng mặc định, loại bản đồ, bán kính tìm kiếm, quốc gia, v.v. Bạn có thể xem xét và điều chỉnh chúng theo nhu cầu của bạn.
Khi bạn đã hoàn tất, đã đến lúc thêm địa điểm.
Anh ấy đã qua 3. Thêm địa điểm cửa hàng
Đi đến Cửa hàng định vị »Cửa hàng mới trang để thêm vị trí đầu tiên của bạn. Trang Cửa hàng mới sẽ trông giống như bài đăng hoặc trình chỉnh sửa trang mặc định trong WordPress.
Cung cấp một tiêu đề cho cửa hàng của bạn, sau đó cuộn xuống phần “Chi tiết cửa hàng”. Từ đây, bạn phải nhập địa chỉ cửa hàng của bạn.
Bạn sẽ thấy một bản đồ ở cột bên phải, tuy nhiên nó sẽ không tự động cập nhật đến địa chỉ bạn đã nhập. Bạn sẽ cần nhấp vào nút Xuất bản để lưu vị trí của bạn. Sau đó, làm mới trang và bản đồ sẽ trỏ đến địa chỉ bạn đã cung cấp.
Bây giờ lặp lại quá trình để thêm các vị trí cửa hàng khác. Bạn có thể thêm bao nhiêu địa điểm cửa hàng tùy thích.
Anh ấy đã qua 4. Thêm bản đồ định vị cửa hàng trong WordPress
Để hiển thị công cụ định vị cửa hàng của bạn trên trang WordPress, chỉ cần tạo một trang mới hoặc chỉnh sửa trang hiện có nơi bạn muốn hiển thị bản đồ.
Trên màn hình chỉnh sửa xuất bản, bạn phải thêm khối mã ngắn gọn ngắn gọn vào khu vực chỉnh sửa xuất bản của bạn. Sau đó thêm [wpls] shortcode bên trong nó.
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 công cụ định vị cửa hàng Google Maps.
Nó sẽ hiển thị các điểm đánh dấu bản đồ của bạn cho từng vị trí cửa hàng và bắt đầu bản đồ từ điểm bắt đầu ưa thích của bạn. Ví dụ, trên bản đồ này, nó tập trung vào thành phố West Palm Beach và hiển thị hai vị trí cửa hàng trên bản đồ.
Đó là tất cả những gì chúng tôi hy vọng bài viết này đã giúp bạn tìm hiểu cách thêm công cụ định vị cửa hàng Google Maps vào WordPress. Bạn cũng có thể muốn xem danh sách các công cụ Google miễn phí của chúng tôi mà mọi chủ sở hữu trang web nên sử dụng.
Nếu bạn thích bài viết này, đăng ký kênh của chúng tôi YouTube để xem video hướng dẫn WordPress. Bạn cũng có thể tìm thấy chúng tôi tại Twitter và Facebook.
