Cách gắn nhanh bản đồ Google Map vào trang liên hệ Opencart

by 4:31:00 PM 2 nhận xét
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:

Cách gắn bản đồ Google Map vào trang liên hệ Opencart

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 

2 comments:

  1. Mình làm theo bạn hướng dẫn, nhưng bị báo lỗi, bạn có thể chỉ mình cách khác phục được không. Thanks
    "Oops! Something went wrong.
    This page didn't load Google Maps correctly. See the JavaScript console for technical details."

    ReplyDelete
    Replies
    1. Chào bạn, làm theo đúng các bước thì sẽ thành công. Nhưng nếu gặp vấn đề thì bạn có thể download và cài đặt plugin này vào shop của bạn dùng thử xem. => http://www.opencart.com/index.php?route=extension/extension/info&extension_id=5561&filter_search=google%20maps

      Delete