ChatGPT
CopilotĐối với các đơn vị thiết kế website hoặc người am hiểu quản trị web, việc nhúng Google Map chỉ mất vài phút. Tuy nhiên nếu bạn là người đang kinh doanh, không rành kỹ thuật hoặc mới làm quen với WordPress thì đôi khi chỉ một đoạn mã nhỏ cũng khiến bạn khá bối rối.
Đừng lo, trong bài viết này tôi sẽ hướng dẫn bạn từng bước thật chi tiết và dễ làm nhất, kể cả khi bạn không biết lập trình vẫn có thể tự chèn Google Map vào website của mình.
1. Cách lấy mã nhúng Google Map (Embed)
Mã nhúng Google Map hay còn gọi là embed là một đoạn mã chứa định vị địa chỉ nhà, công ty hay bất cứ nơi nào chúng ta đi qua. Giúp người dùng dễ dàng tìm đến vị trí đó thông qua chỉ dẫn của Google.
Để nhúng bản đồ google vào website trước tiên chúng ta cần lấy mã nhúng này, bạn hãy làm theo các hình ảnh ben dưới, rất dễ dàng làm theo thôi.
Truy cập vào google
Nhấp Google maps
Bước này bạn nhập địa chỉ nhà hoặc công ty bạn vào nhé, địa chỉ càng chính xác càng tốt.
Nhập vào ô tìm địa chỉ bạn muốn lấy địa chỉ
Đến đây bạn đã có được đoạn mã bản đồ có dạng như sau:
- height là chiều cao muốn hiển thị bản đồ, đơn vị là px.
- width bạn nên để là width = “100%” nó sẽ hiển thị chuẩn ngay cả trên giao diện điện thoại.
Còn trường hợp bạn chỉ muốn copy đường dẫn địa chỉ công ty thì làm theo hình dưới:
2. Cách chèn bản đồ vào Website mới nhất
Sau khi có mã nhúng google ở bước 1, bạn có thể nhúng chúng vào bất kì mẫu thiết kế website nào, từ web php code thuần đến WordPress hay CMS nào cũng chạy tuốt.
Nếu website bạn đang dùng là WordPress, bạn cần chú ý xem trình soạn thảo bạn đang dùng là gì? Classic editor hay Gutenberg. Mỗi trình soạn thảo khác nhau sẽ có cách chèn khác nhau.
2.1 Chèn mã nhúng vào web WordPress bằng soạn thảo Classic editor
Đăng nhập vào quản trị WordPress, tìm đến trang cần chèn mã nhúng, ở đây tôi nhúng mã này vào trang liên hệ để khách hàng dễ dàng tìm kiếm.
2.2 Chèn mã nhúng vào web WordPress bằng soạn thảo Gutenberg (Block editor)
2.3 Còn trong Elementor thì làm cách nào?
Nhúng google map vào trong elementor
3. Bản đồ Google Map là gì?
Bản đồ Google Map là loại bản đồ hiển thị trên các website, thường được dùng để nhúng vào các trang liên hệ, giúp khách hàng dễ dàng tìm đến công ty, trụ sở hay các cửa hàng của các Shop.
Ngoài việc hiển thị đúng vị trí địa chỉ, Google map còn hướng dẫn chỉ đường đến vị trí một cách chính xác nhất. Vì vậy việc nhúng bản đồ Google map vào website là rất quan trọng.
Hi vọng bài viết này sẽ giúp khách hàng dễ dàng thay đổi mã nhúng vị trí cửa hàng, công ty mình một cách dễ dàng nhất nhé.
Hiển thị địa điểm trong Website
Câu hỏi thường gặp (FAQs)
Bản đồ Google Map là gì và tại sao nó quan trọng cho website?
Bản đồ Google Map là loại bản đồ hiển thị trên các website, thường được dùng để nhúng vào các trang liên hệ, giúp khách hàng dễ dàng tìm đến công ty, trụ sở hay các cửa hàng của các Shop. Việc nhúng bản đồ Google Map là rất quan trọng vì nó không chỉ hiển thị đúng vị trí địa chỉ mà còn hướng dẫn chỉ đường đến vị trí một cách chính xác nhất.
Cách lấy mã nhúng Google Map (Embed) để chèn vào website như thế nào?
Để lấy mã nhúng Google Map, bạn cần truy cập Google, sau đó nhấp vào Google Maps. Tại đây, bạn nhập địa chỉ nhà hoặc công ty mình vào ô tìm kiếm, khi tìm thấy doanh nghiệp của bạn, nhấn vào nút chia sẻ để lấy đoạn mã nhúng.
Mã nhúng Google Map có các thông số điều chỉnh nào cần lưu ý để hiển thị tốt trên website?
Trong đoạn mã nhúng Google Map, bạn cần lưu ý đến thông số height là chiều cao hiển thị bản đồ, đơn vị là px. Đối với thông số width, bạn nên đặt là width = 100% để bản đồ hiển thị chuẩn trên mọi giao diện, kể cả trên điện thoại.
Có những cách nào để chèn bản đồ Google Map vào website, đặc biệt với WordPress?
Sau khi có mã nhúng Google Map, bạn có thể chèn chúng vào bất kì mẫu thiết kế website nào như web code thuần, WordPress hoặc các hệ thống CMS khác. Với WordPress, cách chèn sẽ khác nhau tùy thuộc vào trình soạn thảo bạn đang dùng là Classic editor hay Gutenberg.
Hướng dẫn cụ thể cách chèn mã nhúng Google Map vào WordPress bằng Classic editor.
Để chèn mã nhúng vào web WordPress bằng soạn thảo Classic editor, bạn cần đăng nhập vào quản trị WordPress, tìm đến trang mà bạn muốn chèn bản đồ (ví dụ trang liên hệ), sau đó dán đoạn mã nhúng Google Map vào phần soạn thảo của trang đó.
ChatGPT