Giống như nhiều thứ khác trong WordPress, có một số cách khác nhau mà bạn có thể nhúng Google Maps trên trang web của mình tùy thuộc vào loại nội dung bản đồ bạn muốn đưa vào.
Trong bài đăng này, Tài sẽ bắt đầu bằng cách chỉ cho bạn cách thêm Google Maps trong WordPress mà không cần plugin. Sau đó, Tài sẽ đề xuất một số plugin có thể giúp bạn nhúng Google Maps, cũng như một số lợi ích của việc tiếp cận phương pháp đó. Tài cũng sẽ đi sâu vào cách sử dụng đúng Google API API, hiện đang được yêu cầu.
API Google Maps hiện bắt buộc
Kể từ ngày 11 tháng 6 năm 2018, một khóa API hiện được yêu cầu cho Google Maps . Nếu bạn đã triển khai Google Maps trên trang web của mình và nó không còn hoạt động nữa, đây có thể là lý do. Hay đúng hơn, bạn đang thiếu khóa API. Tin tốt là, đối với 99% các bạn, nó vẫn sẽ miễn phí. Dưới đây là giá API Google Maps .
Định giá API Google Maps
Google cũng cung cấp cho bạn khoản tín dụng 200 đô la định kỳ trên tài khoản thanh toán mỗi tháng để bù đắp chi phí sử dụng. Vì vậy, như bạn có thể thấy trừ khi bạn tạo ra hàng ngàn yêu cầu, sử dụng Google Maps trên trang web của bạn sẽ không làm bạn mất bất kỳ chi phí nào.
Những gì khác đã thay đổi? Không có gì, nhưng bây giờ bạn sẽ cần phải làm như sau nếu bạn muốn sử dụng Google Maps trong WordPress:
- Đăng ký tài khoản Google Cloud Platform Console và định cấu hình nó.
- Thêm thông tin thanh toán của bạn, mặc dù bạn có thể không bao giờ được lập hóa đơn.
- Thêm khóa API vào cài đặt plugin hoặc mã nhúng Google Maps của bạn.
Cách nhận Khóa API Google Maps
Dưới đây là các bước về cách nhận khóa API Google Maps của bạn.
Bước 1
Chuyển đến Bảng điều khiển Google Cloud Platform . Nếu bạn chưa có tài khoản, hãy tạo một tài khoản, nó miễn phí.
Bước 2
Chọn hoặc tạo một dự án.
Bước 3
Thiết lập tài khoản thanh toán của bạn. Mặc dù họ sẽ yêu cầu bạn đặt thẻ tín dụng vào hồ sơ, bạn sẽ không bao giờ bị tính phí, trừ khi bạn vượt quá giới hạn sử dụng cao.
Bước 4
Bạn sẽ được yêu cầu chọn một hoặc nhiều sản phẩm. Điều này phụ thuộc vào loại bản đồ bạn đang sử dụng. Ví dụ: nếu bạn đang nhúng bản đồ trên trang web WordPress của mình mà không có plugin (như được hiển thị trong các bước tiếp theo bên dưới), thì bạn sẽ chọn API nhúng Google Maps.
API nhúng Google Maps
Nếu bạn đang sử dụng một plugin như Google Maps Widget (như được hiển thị trong các bước tiếp theo bên dưới), thì bạn sẽ chọn API tĩnh Google Maps.
Nếu bạn đang sử dụng plugin hoặc chủ đề của bên thứ ba, họ nên có tài liệu về loại triển khai Google Maps mà họ đang sử dụng. Đừng lo lắng, bạn luôn có thể thêm nhiều loại và thay đổi những loại này sau.
Bước 5
Nhấp vào Kích hoạt.
Bật API Google Maps
Bước 6
Nhấp vào trên API API, và sau đó, dưới Thông tin xác thực, bạn sẽ thấy khóa API của mình.
Khóa API của Google Maps
Bước 7
Nếu bạn chỉ đơn giản nhúng khóa API Google Maps của mình, nó sẽ hiển thị bằng văn bản thuần trong mã nguồn của bạn. Do đó, bạn nên hạn chế điều này, nếu không, mọi người có thể sử dụng khóa API của bạn trên trang web hoặc dự án WordPress của họ và nâng cao mức độ sử dụng của bạn.
Để làm điều này, chỉ cần nhấp vào tên khóa API của bạn và nó sẽ cho phép bạn thêm một hạn chế. Đối với trang web WordPress của bạn, chỉ cần thêm một người giới thiệu HTTP là đủ tốt. Chẳng hạn như https://yourdomain.com/*. Điều này sẽ cho phép nó chỉ thực hiện cuộc gọi trên trang web của bạn.
Hạn chế khóa API của Google Maps
Cách thêm Google Maps trong WordPress mà không cần plugin
Nếu bạn chỉ muốn nhúng bản đồ đơn giản và không cần chức năng chi tiết hơn như đánh dấu vị trí tùy chỉnh hoặc chú thích khác, bạn có thể nhúng Google Maps mà không cần plugin sử dụng trang web Google Maps thông thường mà bạn sử dụng hàng ngày.
Đây là cách nó hoạt động
Bước 1: Sao chép mã nhúng Google Maps
Để bắt đầu, hãy sử dụng trang web Google Maps để tạo bản đồ mà bạn muốn nhúng.
Ví dụ: nếu bạn muốn nhúng điểm đánh dấu địa điểm, hãy mở địa điểm đó trong Google Maps. Hoặc, nếu bạn muốn nhúng chỉ đường, hãy mở chỉ đường trong Google Maps.
Khi bạn có bản đồ mà bạn muốn nhúng, hãy nhấp vào menu hamburger ở góc trên cùng bên trái:
Cách truy cập mã nhúng
Trong danh sách các mục menu, chọn tùy chọn cho Chia sẻ hoặc nhúng bản đồ :
Mở các tùy chọn nhúng
Điều đó sẽ mở ra một cửa sổ bật lên Chia sẻ . Trong cửa sổ bật lên đó, nhấp vào tab Nhúng bản đồ .
Sau đó, bạn có thể chọn kích thước mong muốn của mình bằng cách sử dụng trình đơn thả xuống. Đối với hầu hết các trang web WordPress, kích thước mặc định hoạt động tốt, nhưng bạn có thể làm cho bản đồ lớn hơn hoặc nhỏ hơn nếu cần.
Khi bạn đã hoàn thành việc đó, nhấp vào nút Sao chép HTML để sao chép mã nhúng:
Mã nhúng Google Maps
Sau đó, bạn sẽ cần thêm khóa API của mình vào mã. Vì vậy, mã của bạn sẽ trông giống như thế này:
