Làm cách nào để chèn bản đồ google vào wordpress?

Hướng dẫn từng bước về cách chèn Google Maps vào trang web WP một cách nhanh chóng và không cần viết mã. Bạn cũng có thể bổ sung bằng Google Reviews để nâng cao lòng tin. Làm theo các bước để thêm bản đồ và để khách truy cập tìm thấy bạn dễ dàng

nội dung






Nhúng Google Map vào website WordPress

Để thêm bản đồ trong WordPress, hãy làm theo hai bước đơn giản

Bước 1. Lấy mã của bản đồ từ trình tạo

• Chuyển đến trang của trình tạo plugin

Để tạo bản đồ của bạn, hãy nhấp vào Trình chỉnh sửa bản đồ hoặc Đăng ký tại đây

Làm cách nào để chèn bản đồ google vào wordpress?

Video hướng dẫn

• Nhận và sao chép mã bản đồ của bạn

Trong cửa sổ bật lên tại Elfsight, bạn sẽ thấy mã cài đặt cá nhân của mình. Sao chép nó để sử dụng tiếp

Làm cách nào để chèn bản đồ google vào wordpress?

Bước 2. Thêm bản đồ vào WordPress

• Đăng nhập vào bảng quản trị WordPress của bạn

Nhập bảng điều khiển để chỉnh sửa trang web

Làm cách nào để chèn bản đồ google vào wordpress?

• Tới phần của các trang

Chọn một trang để chỉnh sửa

Làm cách nào để chèn bản đồ google vào wordpress?

• Nhúng Google Map

Thêm mã bản đồ vào nơi cần thiết

Làm cách nào để chèn bản đồ google vào wordpress?

• Xong. Bản đồ được chèn

Truy cập trang web để xem bản đồ

Làm cách nào để chèn bản đồ google vào wordpress?

Thay đổi cài đặt và áp dụng các cải tiến cho plugin

Từ hồ sơ cá nhân của bạn tại Ứng dụng Elfsight, bạn có thể thực hiện các thay đổi đối với plugin của mình mà không cần thay đổi mã

Các tính năng sau đây dành cho người dùng của chúng tôi

  • Hiển thị các địa điểm yêu thích chính trong khu vực của bạn bằng các điểm đánh dấu trên bản đồ của bạn;
  • Trung tâm bản đồ của bạn được tính toán tự động;
  • Bảng màu tùy chỉnh;

Bạn có thể đọc thêm về plugin, lợi ích của nó và các cài đặt khả dụng trên trang web của plugin bản đồ

Đôi lời về hỗ trợ Elfsight

Đây là một dịch vụ đa nền tảng có một danh mục các ứng dụng để cải thiện trang web của bạn và làm cho nó hấp dẫn hơn đối với khách hàng. Đảm bảo thành công cho trang web của bạn bằng cách sử dụng Ứng dụng Elfsight. Khám phá các plugin khác cho WordPress do nhóm của chúng tôi phát triển

Cho dù bạn điều hành một doanh nghiệp, tổ chức, sự kiện hay chỉ cần hiển thị bản đồ vì bất kỳ lý do nào khác, sẽ rất hữu ích khi biết cách thêm Google Maps vào WordPress

Hơn nữa, với plugin phù hợp, bạn thậm chí có thể tạo các bản đồ tương tác và tùy chỉnh để hiển thị tốt hơn vị trí thực của bạn hoặc các thông tin quan trọng khác

Trong hướng dẫn này, chúng tôi sẽ giới thiệu cho bạn plugin Otter Blocks, một công cụ tuyệt vời và thân thiện với người mới bắt đầu. Sau đó, chúng tôi sẽ chỉ cho bạn cách sử dụng nó để thêm Google Maps vào WordPress. Hãy cùng xem

Cách thêm Google Maps tùy chỉnh vào #WordPress

Nhấp để Tweet

Giới thiệu về Otter Blocks Google Maps Block

Làm cách nào để chèn bản đồ google vào wordpress?
Otter – Gutenberg Blocks – Trình tạo trang cho Gutenberg Editor & FSE

(các) tác giả. chủ đềđảo

Phiên bản hiện tại. 2. 2. 1

Cập nhật lần cuối. Ngày 30 tháng 1 năm 2023

khối rái cá. khóa kéo

96%Xếp hạng 200.000+Cài đặt WP 5. 9+Yêu cầu

Cách dễ nhất để thêm Google Maps vào WordPress là sử dụng đúng plugin, chẳng hạn như Otter Blocks. Themeisle đã xây dựng plugin này để giúp người dùng nhanh chóng tạo và tùy chỉnh bản đồ để đáp ứng nhu cầu của họ. Trình tạo bản đồ giao diện người dùng mạnh mẽ cho phép bạn tạo bao nhiêu bản đồ tùy thích, cũng như lưu, chỉnh sửa và thậm chí sao chép chúng

Các tính năng chính

  • Tùy chỉnh nhiều yếu tố trên bản đồ của bạn, bao gồm vị trí, mức thu phóng, v.v.
  • Tạo kiểu cho bản đồ của bạn thông qua bảng phối màu và các tùy chọn khác
  • Thêm nhiều vị trí và điểm đánh dấu vào bản đồ của bạn
  • Dễ dàng sắp xếp thư viện bản đồ của bạn

Giá. khối rái cá là miễn phí

Cách thêm Google Maps vào WordPress (trong 3 bước)

Bây giờ, chúng tôi sẽ chỉ cho bạn cách tạo bản đồ cho trang web của bạn. Trước tiên, bạn sẽ muốn cài đặt Otter Blocks trên trang web WordPress của mình giống như bất kỳ plugin nào khác. Sau đó, chỉ cần làm theo các bước bên dưới để thêm Google Maps vào WordPress

Bước 1. Thêm khóa API Google Maps của bạn vào WordPress

Khi bạn đã cài đặt Otter Blocks, sẽ có một phần mới có tên là Otter trong tab Cài đặt trong bảng điều khiển của bạn. Khi bạn truy cập nó, bạn sẽ thấy phần Bản đồ có hộp dành cho khóa API của bạn, khóa này phải được thêm vào trước khi bạn bắt đầu tạo bản đồ

Làm cách nào để chèn bản đồ google vào wordpress?
Làm cách nào để chèn bản đồ google vào wordpress?

Để lấy khóa này, hãy truy cập Google APIs Dashboard. Giả sử bạn đã có tài khoản Google, bạn sẽ có thể truy cập trang tổng quan này mà không cần đăng ký bất kỳ thứ gì

Bên trong bảng điều khiển Google API, chọn nút Tạo dự án màu xanh lam ở gần đầu trang

Làm cách nào để chèn bản đồ google vào wordpress?
Làm cách nào để chèn bản đồ google vào wordpress?

Chọn Tạo trên màn hình tiếp theo. Sau đó, bạn sẽ có thể chọn tên cho dự án của mình

Làm cách nào để chèn bản đồ google vào wordpress?
Làm cách nào để chèn bản đồ google vào wordpress?

Nhấp vào Tạo một lần nữa và bạn sẽ được đưa trở lại trang tổng quan. Chọn Bật API và Dịch vụ ở gần đầu màn hình và tìm kiếm "API JavaScript của Google Maps" trong Thư viện API. Khi bạn đã tìm thấy nó, hãy chọn Kích hoạt

Làm cách nào để chèn bản đồ google vào wordpress?
Làm cách nào để chèn bản đồ google vào wordpress?

Trên màn hình tiếp theo, nhấp vào nút Tạo thông tin xác thực ở góc trên bên phải

Sau đó, trên trang tiếp theo, chọn Tôi cần thông tin xác thực nào?

Làm cách nào để chèn bản đồ google vào wordpress?
Làm cách nào để chèn bản đồ google vào wordpress?

Quay lại trang web WordPress của bạn và dán khóa vào hộp Khóa API Google Maps

Làm cách nào để chèn bản đồ google vào wordpress?
Làm cách nào để chèn bản đồ google vào wordpress?

Đừng quên lưu các thay đổi của bạn. Bây giờ, bạn đã sẵn sàng để bắt đầu xây dựng bản đồ của mình

Bước 2. Tạo bản đồ mới

Để tạo bản đồ đầu tiên của bạn, hãy chọn khối Google Maps từ phần Rái cá. Bạn sẽ ngay lập tức được cung cấp rất nhiều tùy chọn

Làm cách nào để chèn bản đồ google vào wordpress?
Làm cách nào để chèn bản đồ google vào wordpress?

Điều đầu tiên bạn có thể muốn làm là chọn nút Thêm điểm đánh dấu. Điều này cho phép bạn xác định vị trí cho bản đồ và đặt điểm đánh dấu. Bạn có thể đặt tiêu đề cho điểm đánh dấu, chọn kiểu cho điểm đánh dấu và nhập địa chỉ

Làm cách nào để chèn bản đồ google vào wordpress?
Làm cách nào để chèn bản đồ google vào wordpress?

Trong hộp văn bản, bạn cũng có thể thêm và định dạng văn bản sẽ hiển thị khi người dùng nhấp vào điểm đánh dấu

Làm cách nào để chèn bản đồ google vào wordpress?
Làm cách nào để chèn bản đồ google vào wordpress?

Sau đó, bạn có thể bắt đầu tùy chỉnh bản đồ của mình bằng một số tùy chọn khác trong trình tạo bản đồ. Hãy đi qua từng tab một

Định vị & Thu phóng

Làm cách nào để chèn bản đồ google vào wordpress?
Làm cách nào để chèn bản đồ google vào wordpress?

Để đặt một mức thu phóng nhất định và vị trí cho bản đồ của bạn, bạn chỉ cần phóng to và thu nhỏ bản đồ mẫu và kéo nó đến bất cứ đâu bạn muốn. Cách bạn thiết lập nó trong trình chỉnh sửa là cách nó sẽ hiển thị trên trang web của bạn

Bạn cũng có thể thay đổi loại bản đồ, từ địa hình, vệ tinh, đường bộ hoặc kết hợp

điều khiển

Làm cách nào để chèn bản đồ google vào wordpress?
Làm cách nào để chèn bản đồ google vào wordpress?

Trong phần Điều khiển, bạn có thể quyết định loại lựa chọn nào có sẵn cho người dùng. Điều này bao gồm liệu họ có thể kéo bản đồ hay không và liệu họ có tùy chọn chế độ xem phố hay không

phong cách

Làm cách nào để chèn bản đồ google vào wordpress?
Làm cách nào để chèn bản đồ google vào wordpress?

Trong phần Kiểu, bạn có thể điều chỉnh hình thức bản đồ của mình. Bạn cũng có thể chọn từ một số kiểu bản đồ được xác định trước hoặc thậm chí tạo kiểu bản đồ của riêng bạn

Tuy nhiên, bằng cách điều chỉnh các cài đặt ở trên, bạn sẽ có thể tạo một bản đồ vừa phong cách vừa hữu ích cho khách truy cập của mình

Bước 3. Đặt bản đồ trên trang web của bạn

Khi bản đồ của bạn được tinh chỉnh đến mức hoàn hảo, đừng quên lưu nó. Sau khi thực hiện xong, bạn sẽ thấy nó xuất hiện trên trang cùng với các nút để điều chỉnh độ rộng, thay đổi kiểu hoặc xóa bản đồ

Làm cách nào để chèn bản đồ google vào wordpress?
Làm cách nào để chèn bản đồ google vào wordpress?

Nhấn xuất bản và thế là xong. Bản đồ của bạn bây giờ sẽ hiển thị hoàn hảo ở mặt trước của trang web của bạn

Làm cách nào để chèn bản đồ google vào wordpress?
Làm cách nào để chèn bản đồ google vào wordpress?

Bạn có thể sử dụng phương pháp này để đặt cùng một bản đồ ở nhiều nơi hoặc thậm chí thêm nhiều loại bản đồ vào trang web của mình. Đó là tất cả những gì cần thiết để thêm Google Maps vào WordPress

Phần kết luận

“Hiển thị, không nói” là một quy tắc thông minh để tuân theo trên trang web của bạn. Ví dụ: bao gồm một bản đồ, hiển thị cho khách truy cập chính xác cách doanh nghiệp hoặc tổ chức của bạn phù hợp với cộng đồng của họ. Bản đồ là một cách hấp dẫn hơn để khuyến khích mọi người ghé thăm vị trí thực tế của bạn hơn là chỉ cung cấp địa chỉ – đặc biệt khi chúng tương tác

Để tận dụng kỹ thuật này trên trang web của riêng bạn, bạn có thể sử dụng plugin Otter Blocks để thêm Google Maps vào WordPress. Chỉ cần làm theo ba bước sau

  1. Thêm khóa API Google Maps của bạn vào WordPress
  2. Tạo một bản đồ mới và định cấu hình nó bằng cài đặt của plugin
  3. Đặt bản đồ trên trang web của bạn bằng mã ngắn được cung cấp

Bạn có câu hỏi nào về cách sử dụng khối Otter Blocks Google Maps hiệu quả không?

Google Maps ở đâu trong WordPress?

Hiển thị Google Maps trong WordPress . Khi bạn đang ở trong trình chỉnh sửa khối, hãy nhấp vào nút '+' ở trên cùng và thêm khối 'AIOSEO Local – Map' vào bất kỳ đâu trên trang . Sau đó, Google Map của bạn sẽ được thêm vào trang.

Bạn có thể nhúng Google Maps vào trang web không?

Nhúng bản đồ hoặc chỉ đường . Nhấp vào Nhúng bản đồ. Sao chép văn bản trong hộp. Dán nó vào HTML của trang web hoặc blog của bạn .

Google Map có miễn phí cho WordPress không?

WP Google Map là plugin WordPress miễn phí để thêm Google Map được tùy chỉnh hoàn toàn vào các bài đăng và trang của bạn. Nó hỗ trợ chỉ đường với bản đồ, nhận dạng vị trí tự động, khả năng thay đổi mức thu phóng, v.v. Nó hoạt động tuyệt vời với tất cả các plugin WordPress phổ biến khác.