Hướng dẫn cập nhật thông tin liên hệ hiển thị trên website doanh nghiệp
Back To Blogs
Nguyễn Thị Thanh Tuyền - Chuyên viên Marketing
Sau khi hoàn thiện các trang chính của website, thông tin liên hệ là một trong những nội dung cần được cập nhật trước khi đưa website vào sử dụng thực tế.
Ở website Ezyvora hiện tại, khu vực Thông tin liên hệ đã có sẵn giao diện nhưng vẫn đang sử dụng nội dung mặc định "Đang cập nhật" cho các trường: Email, Điện thoại, Địa chỉ, Giờ làm việc.
Trong bài này, chúng ta sẽ sử dụng AI Assistant trong VS Code để xác định nơi những thông tin này đang được quản lý, sau đó thay bằng thông tin thật của doanh nghiệp và kiểm tra kết quả trên website.
Bước 1: Chuẩn bị thông tin liên hệ của doanh nghiệp
Trước khi yêu cầu AI chỉnh sửa website, hãy chuẩn bị đầy đủ những thông tin muốn hiển thị. Ví dụ:
| Trường | Giá trị |
|---|---|
| Tên doanh nghiệp | Ezyvora |
| contact@ezyvora.com | |
| Điện thoại | 0988 123 456 |
| Địa chỉ | Hà Nội, Việt Nam |
| Giờ làm việc | Thứ 2 – Thứ 6, 08:00 – 17:30 |
Đây nên là những thông tin doanh nghiệp thực sự sử dụng để tiếp nhận yêu cầu từ khách hàng. Nếu website còn hiển thị các thông tin này ở Footer hoặc những trang khác, chúng ta cũng nên cập nhật đồng nhất.
Bước 2: Yêu cầu AI kiểm tra thông tin liên hệ hiện tại
Mở dự án website trong VS Code, sau đó mở Claude Code hoặc Codex. Thay vì tự tìm từng đoạn HTML có chữ "Đang cập nhật", hãy để AI kiểm tra toàn bộ dự án trước.
Prompt mẫu
"Hãy kiểm tra mã nguồn website hiện tại và tìm khu vực "Thông tin liên hệ" đang hiển thị:
- Email.
- Điện thoại.
- Địa chỉ.
- Giờ làm việc.
Hiện các giá trị đang hiển thị là "Đang cập nhật".
Hãy xác định:
- File hoặc component đang hiển thị khu vực này.
- Dữ liệu hiện đang được hard-code hay lấy từ EzyPlatform.
- Những vị trí khác trên website đang sử dụng cùng thông tin liên hệ.
Chưa chỉnh sửa code.
Trước tiên hãy báo cho tôi cấu trúc hiện tại và đề xuất cách cập nhật phù hợp."
AI sẽ đọc dự án và xác định chính xác nơi dữ liệu đang được sử dụng và trả kết quả như sau:
Bước này đặc biệt quan trọng vì cùng một số điện thoại hoặc email có thể xuất hiện ở nhiều vị trí như:
- Trang Liên hệ
- →
- Footer
- →
- Header
- →
- CTA
Nếu sửa thủ công từng chỗ, sau này rất dễ xảy ra tình trạng mỗi trang hiển thị một thông tin khác nhau.
Bước 3: Kiểm tra thông tin có thể quản lý từ EzyPlatform hay không
Nếu website đã sử dụng dữ liệu thật từ EzyPlatform và đã kết nối MCP Server, chúng ta nên kiểm tra xem hệ thống đã có nơi quản lý thông tin doanh nghiệp hay chưa. Thay vì đưa ngay email, số điện thoại và địa chỉ vào HTML, hãy yêu cầu AI kiểm tra EzyPlatform trước.
Prompt mẫu
"Hãy sử dụng MCP Server để kiểm tra EzyPlatform hiện tại.
Tôi cần quản lý các thông tin doanh nghiệp sau:
- Email.
- Số điện thoại.
- Địa chỉ.
- Giờ làm việc.
Hãy kiểm tra xem EzyPlatform đã có dữ liệu hoặc Ezy Function phù hợp để lưu và lấy các thông tin này hay chưa.
Nếu đã có, hãy cho tôi biết cách sử dụng chức năng hiện tại.
Ưu tiên tái sử dụng chức năng có sẵn.
Chưa chỉnh sửa code.
Nếu EzyPlatform đã có cấu trúc phù hợp, nên sử dụng dữ liệu đó làm nguồn thông tin cho website."
AI sẽ đọc dự án và trả kết quả như sau:
Nhờ đó, khi thông tin thay đổi, chúng ta không phải tìm từng file HTML để sửa. Sau khi đã xác định được nơi dữ liệu đang được quản lý, cung cấp thông tin thật cho AI. AI sẽ dựa trên cấu trúc vừa phân tích để thực hiện thay đổi như kết quả dưới đây.
Bước 4: Kiểm tra các hành động liên hệ
Thông tin liên hệ không nên chỉ để đọc. Với email và số điện thoại, website có thể giúp khách thực hiện hành động ngay.
Ví dụ, khi bấm vào contact@ezyvora.com, website có thể mở ứng dụng email. Khi khách sử dụng điện thoại và bấm 0988 123 456, thiết bị có thể mở chức năng gọi điện. Nếu website hiện chưa hỗ trợ, có thể yêu cầu AI bổ sung.
Prompt mẫu
"Hãy kiểm tra khu vực Thông tin liên hệ vừa cập nhật.
Đảm bảo:
- Email sử dụng liên kết
mailto:phù hợp. - Số điện thoại sử dụng liên kết
tel:phù hợp. - Nội dung hiển thị cho người dùng vẫn giữ nguyên định dạng hiện tại.
- Không thay đổi thiết kế của section.
- Không ảnh hưởng đến desktop và mobile.
Như vậy, khu vực liên hệ không chỉ cung cấp thông tin mà còn giúp khách hàng thực hiện hành động nhanh hơn.
Bước 5: Preview và kiểm tra kết quả
Sau khi AI hoàn thành, mở Preview website và quay lại khu vực Thông tin liên hệ.
Nếu thông tin này cũng xuất hiện trong Footer hoặc những khu vực khác, hãy kiểm tra thêm để bảo đảm toàn bộ website sử dụng thống nhất một thông tin.
Kết luận
Sau bước này, khu vực liên hệ trên website đã được thay từ dữ liệu mẫu sang thông tin thực tế của doanh nghiệp. Việc quản lý tập trung các thông tin như email, điện thoại, địa chỉ và giờ làm việc cũng giúp website dễ cập nhật và hạn chế tình trạng dữ liệu không đồng nhất giữa các trang.