Với một shop bán hàng thì việc gắn bản đồ vị trí cửa hàng hay showroom lên website là vô cùng quan trọng, nhưng đối với những website mã nguồn Opencart thì gắn như thế nào? Sau đây blog xin chia sẻ nhanh cách gắn đơn giản sau:

1 Lấy code Google Map địa chỉ shop của bạn:

Để lấy code địa điểm Google Map bạn vào web: https://www.google.com/maps
Sau đó search địa chỉ của bạn trên thanh search của Google Map, sau khi search ra kết quả chính xác trên bản đồ, bạn vào nút Share:

Tiếp theo bạn click vào tab Embed map, copy đọa code theo hướng dẫn trong hình:

2 Đặt code Google Map vào trang Liên hệ website của bạn:

Tìm đến file contact.tpl theo đường dẫn sau: catalog/view/theme/yourtheme/template/information/contact.tpl
 - Yourtheme là giao diện bạn đang sử dụng cho website của mình
- Mở file template này trên editor và tìm đến đoạn code sau:

<form action="<?php echo $action; ?>" method="post"

Dán đoạn code Google Map bạn vừa copy lên nằm phía trên đoạn code bạn vừa tìm thấy, rồi lưu lại.
Sau đó ra ngoài trang liên hệ của website nhấn F5 để kiểm tra kết quả.
 

Bạn có thể style lại chút để cho bố cục trang Liên hệ của bạn phù hợp với phần bản đồ vừa gắn vào nhé.

Chúc các bạn thành công!

Xem thêm:
- Hướng dẫn cách gắn Google Analytics vào Opencart
- Hướng dẫn xóa hoặc thay đổi thông tin bản quyền OpenCart dưới chân trang
- Cách ẩn số lượng sản phẩm trong danh mục OpenCart
- Tạo khung đăng ký thành viên dạng popup trong diễn đàn Xenforo
- Hướng dẫn đặt quảng cáo theo từng forum hoặc category trong xenforo
- Hướng dẫn làm slider Bootstrap với hiệu ứng Fade in - Fade out
- Tạo menu dropdowns nhanh trong Bootstrap 

Google Maps là công cụ bản đồ miễn phí và có tính năng khá mạnh, đối với bất kỳ một website hay blog nào việc tích hợp bản đồ này vào là vô cùng cần thiết để người dùng dễ dàng tìm kiếm chính xác địa chỉ công ty, chi nhánh hay địa chỉ xem sản phẩm, địa chỉ giao dịch... Sau đây là cách đơn giản để tích hợp nhanh Google Maps vào website hoặc blog với 3 bước đơn giản.

Bước 1: Truy cập vào địa chỉ https://www.google.com/maps sau đó search đúng địa chỉ bạn muốn Google Maps hiển thị trên website bạn.

Bước 2: Click vào menu Setting ở phía góc phải dưới của màn hình, chọn  Share and embed map như hình bên dưới:

Bước 3: Khi popup xuất hiện, chọn tab Embed map, chọn size bạn muốn hiển thị và cuối cùng là copy đoạn code được trong phần bôi đỏ bên hình dưới dán vào vị trí mà bạn muốn hiển thị Google Maps trên website hoặc blog của bạn ( Nên nhớ là chép đọa code này dán trong giao diện HTML hoặc giao diện code nhé.)

Chúc các bạn thành công!