Bỏ qua tới nội dung
Case study · Du lịch · Website mẫu

VIVU Travel

Web mẫu cho mô hình công ty lữ hành đặt tour online — hơn 120 hành trình trong nước & nước ngoài có giá niêm yết thật. Khác với web tour thường chỉ là danh sách kèm số điện thoại, web này để khách tự tìm & lọc tour, xem lịch trình chi tiết, đặt chỗ và thanh toán ngay bằng mã QR ngân hàng đúng số tiền — không qua cổng trung gian, tiền về thẳng tài khoản công ty.

Loại dự án
Web đặt tour (mẫu)
Ngành
Du lịch · lữ hành
Phạm vi
20+ trang · đặt tour & thanh toán
Nền tảng
Next.js 16 · React 19
vivu.mauweb.dev
Trang chủ web đặt tour du lịch VIVU Travel

Trang chủ — thanh tìm tour ngay trên ảnh bìa, dải điểm đến trong nước & quốc tế, tour nổi bật kèm giá, và lối vào thẳng luồng đặt tour. (Cuộn trong khung để xem toàn trang)

Tính năng

Một chuyến đi là quyết định lớn — website phải dẫn khách trọn hành trình

Người đi tour không "thêm vào giỏ" rồi mua ngay; họ tìm hiểu điểm đến, so giá, đọc lịch trình, rồi mới giữ chỗ. Web tour ở Việt Nam phần lớn dừng ở danh sách tour + số hotline. Web này được dựng lại theo đúng hành trình đó: tìm → lọc → đọc lịch trình → đặt chỗ → thanh toán QR, mỗi chặng một công cụ riêng và đều khép kín ngay trên web.

01 — Kho tour

Hơn 120 hành trình, tìm & lọc như một cửa hàng thật

Tour trong nước và quốc tế với giá niêm yết, giá gốc gạch ngang và phần trăm giảm rõ ràng. Khách gõ tên điểm đến để tìm tức thì, hoặc lọc theo khu vực, loại hình và khoảng giá — duyệt tour như duyệt một cửa hàng, không phải lướt brochure tĩnh.

  • Tìm theo từ khoá + lọc khu vực (Bắc/Trung/Nam/nước ngoài), loại hình, mức giá
  • Sắp xếp theo phổ biến, giá thấp→cao, giá cao→thấp, đánh giá
  • Thẻ tour hiện đủ: thời lượng, giá từ, điểm đánh giá & số lượt khách
Trang tất cả tour với bộ lọc khu vực, loại hình và giá
02 — Trang tour chi tiết

Lịch trình từng ngày, giá gồm gì — như một tư vấn viên

Mỗi tour có trang riêng trả lời mọi câu khách hay hỏi: thời lượng, phương tiện, quy mô đoàn, thời điểm đẹp; lịch trình từng ngày dạng dòng thời gian; bảng "giá đã gồm / chưa gồm" minh bạch. Khung đặt tour bám theo khi cuộn để khách giữ chỗ bất cứ lúc nào, kèm tour tương tự để so sánh.

  • Lịch trình từng ngày + điểm nhấn hành trình + bảng giá gồm/không gồm
  • Khung "Đặt tour ngay" bám cuộn: giá, đánh giá, nút giữ chỗ
  • Dữ liệu có cấu trúc chuẩn cho Google (sản phẩm tour + đánh giá)
Trang tour chi tiết: lịch trình từng ngày và khung đặt tour
03 — Đặt tour & thanh toán QR

Công cụ "ăn tiền" nhất: giữ chỗ và chuyển khoản ngay bằng mã QR

Luồng đặt tour gọn trong một trang ba bước: chọn tour & ngày khởi hành & số khách → điền thông tin → chọn cọc 30% hay trả toàn bộ. Web tự tính tiền (giá trẻ em 75%), sinh mã đặt tour rồi hiện mã QR VietQR đúng số tiền với nội dung chuyển khoản điền sẵn — quét bằng mọi app ngân hàng, MoMo, ZaloPay. Điểm thiết kế đáng giá: web cố tình bỏ cổng thanh toán trung gian, tiền chuyển thẳng vào tài khoản công ty, vừa tiết kiệm phí vừa minh bạch.

  • Tính tiền tự động theo số khách + giá trẻ em, chọn đặt cọc 30% hoặc toàn bộ
  • Mã QR chuẩn NAPAS 247 — số tiền & nội dung điền sẵn, khỏi lo chuyển nhầm
  • Mỗi đơn sinh một mã đặt tour riêng để công ty đối soát, không qua bên thứ ba
Màn thanh toán: mã QR VietQR đúng số tiền và thông tin chuyển khoản
04 — Dịch vụ lẻ & báo giá

Không chỉ tour trọn gói — còn vé, phòng, xe, visa

Bên cạnh tour, web có riêng mảng dịch vụ lẻ: vé máy bay, đặt phòng khách sạn, thuê xe du lịch, làm visa, combo tiết kiệm, teambuilding. Mỗi dịch vụ có trang riêng nêu quyền lợi và câu hỏi thường gặp, kèm form yêu cầu báo giá ngay trên trang để khách để lại nhu cầu trong một phút.

  • 6 nhóm dịch vụ, mỗi nhóm một trang riêng có quyền lợi + hỏi đáp
  • Form yêu cầu báo giá ngay tại trang — giảm rào cản phải gọi điện
  • Điều hướng chéo: từ dịch vụ về tour và ngược lại
Trang dịch vụ lẻ với form yêu cầu báo giá
05 — Cẩm nang & SEO

Chuyên mục cẩm nang viết để khách tìm thấy trên Google

Mảng cẩm nang du lịch với bài nổi bật trình bày dạng tạp chí và lưới bài viết bên dưới — kinh nghiệm điểm đến, ẩm thực, hướng dẫn đặt tour. Mỗi bài có ảnh bìa, thời lượng đọc, nội dung mạch lạc và dữ liệu có cấu trúc bài viết, là nền móng để web lên top tìm kiếm tự nhiên thay vì phụ thuộc quảng cáo.

  • Bài nổi bật dạng tạp chí + lưới cẩm nang theo chủ đề
  • Mỗi bài có ảnh chia sẻ, thời lượng đọc, bài viết liên quan
  • Dữ liệu có cấu trúc + thẻ meta chuẩn — sẵn sàng cho SEO
Trang cẩm nang du lịch với bài nổi bật và lưới bài viết
06 — Website đầy đủ

Đủ trang nền tảng để một công ty lữ hành trông đáng tin

Trang giới thiệu kể câu chuyện thương hiệu và chặng đường phát triển, trang liên hệ có bản đồ chỉ đường cùng form tư vấn, và bộ 4 trang chính sách viết riêng cho ngành tour — bảo mật, điều khoản, hoàn/huỷ tour, thanh toán. Chân trang đầy đủ liên kết, không có trang "mồ côi".

  • Liên hệ: thẻ kênh liên lạc + bản đồ nhúng + form tư vấn
  • 4 chính sách theo đặc thù du lịch (hoàn/huỷ tour, thanh toán)
  • Giới thiệu có dòng thời gian phát triển — tăng độ tin cậy
Trang liên hệ với bản đồ và form tư vấn
Chốt khách

Nhiều lối vào, một đích: giữ chỗ thành công

Đặt tour rồi quét QR thanh toán, để lại yêu cầu báo giá dịch vụ, hay nhắn tư vấn — mỗi luồng đều khép kín ngay trên web để khách không phải rời trang đi tìm số điện thoại.

Đặt tour mã đơn + QR đúng số tiền Thanh toán VietQR · không cổng trung gian Báo giá form dịch vụ ngay tại trang Tư vấn form + bản đồ chỉ đường
Responsive

Khách đặt tour bằng điện thoại — web chiều theo

Từ thanh tìm tour, bộ lọc cho tới màn quét QR thanh toán đều dồn gọn cho màn hình hẹp; nút bấm đủ lớn cho ngón tay, mã QR rõ nét để quét ngay trên một thiết bị khác.

Trang chủ trên điện thoại
Trang chủ
Tìm tour trên điện thoại
Tìm tour
Thanh toán QR trên điện thoại
Thanh toán QR
Công nghệ

Nền tảng & công nghệ

Next.js 16Trang dựng sẵn, tải rất nhanh
React 19 · TypeScriptMã chắc chắn, dễ bảo trì
Tailwind CSS v4Giao diện cao cấp, đồng bộ
Thanh toán VietQRMã QR đúng số tiền, không cổng trung gian
Tìm & lọc tức thìTheo điểm đến, loại hình, mức giá
Dữ liệu có cấu trúcTour · đánh giá · bài viết
Hạ tầng đám mâyCDN toàn cầu · SSL tự động
ResponsiveTối ưu thao tác một tay
Ảnh giấy phép mởTư liệu điểm đến, bản quyền sạch
Cam kết Web22

Bản dựng mẫu thật, do chính đội Web22 code

Đây là sản phẩm mẫu Web22 tự thiết kế và lập trình để thể hiện năng lực — không phải theme mua sẵn hay bản sao rập khuôn tràn lan ngoài thị trường. Toàn bộ giao diện và tính năng đều code tay, nên khi triển khai cho bạn, mọi thứ đều có thể tuỳ biến, thêm tính năng hay chỉnh sửa theo đúng thương hiệu riêng.

  • Code tay 100%, không dựng bằng mẫu rập khuôn
  • Tuỳ biến & thêm tính năng theo nhu cầu
  • Sản phẩm độc quyền của đội ngũ Web22
Bắt đầu

Bạn làm tour, khách sạn hay dịch vụ và cần web đặt chỗ — thanh toán ngay?

Web22 thiết kế website cho công ty lữ hành, khách sạn, dịch vụ — luồng đặt chỗ rõ ràng, thanh toán QR đúng số tiền không cổng trung gian, nội dung chuẩn SEO.