Chuyển đến nội dung
Tài liệu

Tài liệu chính thức

Giao diện Hairsalon (tiệm tóc, salon làm đẹp)

Giao diện Hairsalon (tiệm tóc, salon làm đẹp)

Đây là hướng dẫn sử dụng Hairsalon (hairsalon), giao diện chính thức của Zittme dành cho tiệm tóc và salon làm đẹp. Trang đầu bắt đầu bằng thanh trượt phủ kín màn hình, tiếp theo là menu dịch vụ, nhà tạo mẫu, phong cách, thông tin cửa hàng và khối mời đặt lịch. Dịch vụ và nhà tạo mẫu được lấy trực tiếp từ mô-đun đặt chỗ, thông tin cửa hàng lấy từ mô-đun chi nhánh, nên nội dung trang đầu và màn hình đặt lịch luôn khớp nhau. Nền màu mực và trắng ngà được điểm xuyết màu đồng, phông chữ được đóng gói sẵn trong giao diện nên không dùng CDN bên ngoài.

Demo: hairsalon-demo.zitt.me

Demo Hairsalon

Thành phần

Thành phầnVị tríVai trò
Layoutthemes/hairsalon/layouts/hairsalonKhung website + trang đầu (thanh trượt · giới thiệu · dịch vụ · nhà tạo mẫu · phong cách · cửa hàng · mời đặt lịch)
Skin đặt chỗthemes/hairsalon/modules/reservationDanh sách dịch vụ · chọn cửa hàng/nhà tạo mẫu/ngày·giờ · xác nhận đặt lịch · kết quả · lịch hẹn của tôi
Skin chi nhánhthemes/hairsalon/modules/branchDanh sách cửa hàng (lọc theo khu vực) · chi tiết cửa hàng (giờ mở cửa · ngày nghỉ · bản đồ · tiện ích)
Skin bảng tinthemes/hairsalon/modules/boardDạng ảnh (lookbook) · dạng danh sách bài (journal)
Skin thành viên · tin nhắnthemes/hairsalon/modules/{member, communication}Đăng nhập · đăng ký · thông tin thành viên · tin nhắn
Skin zittme Paythemes/hairsalon/modules/zittme_payThanh toán tiền đặt cọc · kết quả thanh toán · hướng dẫn chuyển khoản ngân hàng

Cài đặt và áp dụng

  1. Cài từ cửa hàng hoặc giải nén vào themes/hairsalon.
  2. Trong Quản trị > Cài đặt thiết kế, chọn Hairsalon để áp dụng.
  3. Cài mô-đun đặt chỗ và tạo trang đặt lịch (ví dụ mid reservation), sau đó nhập /reservation vào Cài đặt layout > Cơ bản > Địa chỉ trang đặt lịch. Nút đặt lịch ở đầu trang và mục "Đặt lịch với nhà tạo mẫu này" trên thẻ nhà tạo mẫu sẽ liên kết tới địa chỉ này.
  4. Nếu có nhiều cửa hàng, hãy đăng ký cửa hàng bằng mô-đun chi nhánh. Giao diện vẫn hoạt động khi không có mô-đun chi nhánh, chỉ riêng khối thông tin cửa hàng trên trang đầu không hiển thị.
  5. Để nhận tiền đặt cọc, hãy cài zittme Pay và bật phương thức thanh toán (chuyển khoản ngân hàng hoặc PG).
  6. Môi trường khuyến nghị: Zittme 1.0.2 trở lên, đặt chỗ 1.0.0 trở lên. Đây là giao diện đáp ứng nên khuyến nghị tắt chế độ xem riêng cho di động.

    Bố cục trang đầu

    Thiết lập trong các tab Thanh trượt trang đầu và Bố cục trang đầu của cài đặt layout. Trang chủ website (menu bắt đầu) được xem là trang đầu mà không cần chỉ định riêng.

    KhốiCài đặtNội dung
    Thanh trượtSlide, khoảng thời gian chuyển, chiều caoMỗi dòng một slide theo dạng `image-url \small-text \large-text \link. \n` trong dòng chữ lớn được đổi thành xuống dòng. Đặt khoảng thời gian là 0 thì không tự động chuyển.
    Giới thiệuCâu giới thiệu · nội dung · chữ kýMột câu và một đoạn ngắn bên dưới thanh trượt. Để trống câu giới thiệu thì khối bị ẩn.
    Menu dịch vụHiện menu dịch vụNhóm các dịch vụ đã đăng ký trong mô-đun đặt chỗ theo phân loại, hiển thị thời gian thực hiện và giá.
    Nhà tạo mẫuHiện nhà tạo mẫuHiển thị người phụ trách của mô-đun đặt chỗ dưới dạng thẻ trượt ngang. Nếu không có ảnh, chữ cái đầu của tên được viết lớn.
    Phong cáchĐịa chỉ · số lượng bảng tin phong cách, ảnh lookbookNếu nhập mid bảng tin thì hiển thị ảnh của bảng tin đó, nếu để trống thì hiển thị các ảnh đã nhập trong "Ảnh lookbook" dạng khảm. Để khảm được lấp kín không có ô trống, ảnh được hiển thị theo bội số của 5 (ví dụ có 7 ảnh thì hiện 5).
    Thông tin cửa hàngHiện thông tin chi nhánhHiển thị cửa hàng của mô-đun chi nhánh cùng trạng thái đang mở cửa/đã đóng cửa.
    Mời đặt lịchCâu kết · ảnh nềnKhối nút đặt lịch ở cuối trang đầu. Để trống câu thì khối bị ẩn.

    Màu sắc và logo

    • Màu nhấn: mặc định là màu đồng (#b08d57). Khi bạn đổi màu nhấn, giao diện tự chọn màu chữ trên nút (trắng/màu mực) và màu nhấn dùng cho chữ (nhãn · liên kết), cân chỉnh độ tương phản để chữ vẫn đọc được dù bạn chọn màu sáng.
    • Logo: nếu không có ảnh logo thì dùng chữ logo, nếu cũng không có thì dùng tiêu đề website. Trên thanh trượt sẽ dùng "ảnh logo sáng".
    • Loại trang: nếu nhập m vào lớp (class) của menu trong sơ đồ website thì menu đó được vẽ như trang đầu, nếu nhập s thì được vẽ như trang con.

    Màn hình đặt lịch (skin đặt chỗ)

    1. Danh sách dịch vụ: dịch vụ · mô tả · thời gian thực hiện · giá theo từng phân loại. Nhấn vào dịch vụ để chuyển sang bước đặt lịch.
    2. Cửa hàng · nhà tạo mẫu · ngày và giờ: khi chọn cửa hàng thì chỉ còn lại nhà tạo mẫu của cửa hàng đó. Chọn "Nhà tạo mẫu bất kỳ" thì hệ thống sẽ xếp người đang rảnh. Ngày hết chỗ không nhấn được, và nếu tháng này không còn ngày trống thì tháng sau được hiển thị trước.
    3. Xác nhận đặt lịch: tên · số liên lạc · email · mật khẩu tra cứu (khách không phải thành viên) · lời nhắn và đồng ý thu thập thông tin cá nhân. Nếu có tiền đặt cọc, nút "Thanh toán và đặt lịch" sẽ chuyển sang màn hình thanh toán zittme Pay.
    4. Kết quả · lịch hẹn của tôi: hiển thị mã đặt lịch và trạng thái. Khách không phải thành viên kiểm tra trong Lịch hẹn của tôi bằng mã đặt lịch và mật khẩu tra cứu. Thành viên còn xem được điểm thưởng · hộp phiếu giảm giá.
    5. Bảng tin

      Chọn bằng kiểu danh sách trong cài đặt bảng tin. Nếu ảnh là trọng tâm thì chọn gallery (lookbook), nếu bài viết là trọng tâm thì chọn journal (thông báo · tạp chí). Khách không phải thành viên cũng có thể bình luận bằng biệt danh · mật khẩu (tùy theo quyền của bảng tin).

      Chân trang

      Trong Cài đặt layout > Chân trang, nhập thông tin doanh nghiệp (nhiều dòng, xuống dòng để tách), địa chỉ mạng xã hội (name | url) và dòng bản quyền.