Lofi Clean
Hướng dẫn sử dụng theme Lofi Clean
Xin chào! Cám ơn bạn đã chọn giao diện của chúng tôi. Dưới đây là những hướng dẫn để bạn cài đặt cũng như sử dụng chủ đề của chúng tôi. Mọi thắc mắc bạn có thể gửi về [email protected]. Chúng tôi thực sự đánh giá cao và hi vọng bạn sẽ thích giao diện của chúng tôi.
Bắt đầu nhanh
Tại đây bạn có thể xem các trang cần tạo trên Sapo và giao diện cần gán để theme hoạt động đầy đủ.
| Trang | Tạo ở | Giao diện |
|---|---|---|
| Danh sách dịch vụ | Danh mục sản phẩm | collection.dich-vu |
| Chi tiết dịch vụ | Sản phẩm | product.dich-vu |
| Đặt lịch | Trang nội dung | page.dat-lich |
| Giới thiệu | Trang nội dung | page.gioi-thieu |
| Tuyển dụng | Danh mục blog | blog.tuyen-dung |
| Hệ thống chi nhánh | Trang nội dung | page.store |
| Liên hệ | Trang nội dung | page.contact |
| Sản phẩm yêu thích | Trang nội dung | page.wishlist |
Sau đó vào Giao diện > Tùy chỉnh giao diện chọn các trang, danh mục, blog, menu vào đúng ô. Mỗi nhóm cài đặt đều có ghi chú ngay bên dưới.
Các yêu cầu đặt lịch, hồ sơ ứng tuyển, email đăng ký nhận ưu đãi và tin nhắn liên hệ đều gửi qua form liên hệ của Sapo, xem ở mục Liên hệ trong trang quản trị.
Thiết lập chung
Tại đây bạn có thể tùy chỉnh:
- Màu sắc và phông chữ: 4 màu chính (xanh đậm, xanh nhấn, màu link, màu nền), font nội dung và font tiêu đề lấy từ Google Fonts.
- Logo & favicon: dùng ảnh logo (164×40 pixel) hoặc logo chữ theo mẫu; logo riêng cho chân trang.
- Thông tin liên hệ: hotline, email, địa chỉ, giờ làm việc, link Zalo, Facebook, YouTube, TikTok. Để trống sẽ lấy thông tin cửa hàng trên Sapo.
- Giỏ hàng: mức miễn phí giao hàng, ghi chú dưới tổng tiền, dòng chữ khi giỏ trống, khối gợi ý 4 sản phẩm ở trang giỏ hàng.
- SEO trang chủ: từ khóa trang chủ.
Tiện ích
Tại đây bạn có thể tùy chỉnh:
- Đặt lịch: chọn trang Đặt lịch (giao diện page.dat-lich) và chữ nút đặt lịch trên header.
- Sản phẩm yêu thích: bật/tắt và chọn trang danh sách yêu thích.
- Tìm kiếm: chữ gợi ý trong ô tìm kiếm, các từ khóa phổ biến (cách nhau dấu ;), bật tìm cả bài viết.
- Khác: nút lên đầu trang, chat Facebook, popup thông báo (tối đa 6 mục) và nhóm icon liên hệ (hotline, Zalo, địa chỉ, email).
Đầu trang & menu
Tại đây bạn có thể tùy chỉnh thanh thông báo trên cùng (3 dòng thông báo chuyển bằng nút ‹ › và dòng chữ bên phải), menu chính, hai kiểu mega menu và ghi chú đầu giỏ hàng trượt.
Menu chính
Menu hỗ trợ 3 cấp. Mục có menu con sẽ hiện danh sách thả xuống; muốn mục đó mở mega menu thì khai báo ở một trong hai ô dưới đây.
Mega menu dạng cột (như Dịch vụ)
- Nhập đường dẫn mà mục menu trỏ tới vào ô "Mục menu mở mega menu dạng cột", VD
dich-vucho mục trỏ tới /collections/dich-vu. Nhiều mục cách nhau dấu phẩy. - Link cấp 2 có menu con thành một cột (tên cột + các link cấp 3); link cấp 2 không có menu con nằm chung cột đầu tiên.
- Các cột tự chia đều chiều ngang theo số cột (2, 3 hoặc 4 cột); nhiều hơn 4 cột thì xuống hàng.
- Ô nổi bật bên phải (nhãn, tiêu đề, mô tả, nút) có thể bật/tắt; để trống link nút thì dẫn tới trang Đặt lịch.
Mega menu dạng cửa hàng (như Cửa hàng)
- Nhập đường dẫn của mục menu vào ô "Mục menu mở mega menu dạng cửa hàng", VD
san-pham. - Cột trái là các link cấp 2 kèm số sản phẩm; link có menu cấp 3 hiện thêm khung khi rê chuột.
- Cột giữa hiện 3 sản phẩm đầu của danh mục bạn chọn; cột phải là ảnh banner (220×295 pixel) và ô khuyến mãi, để trống tiêu đề để ẩn.
Chân trang
Tại đây bạn có thể tùy chỉnh dải đăng ký nhận ưu đãi, đoạn giới thiệu ngắn, 3 cột menu, tiêu đề cột chi nhánh, phương thức thanh toán, logo Bộ Công Thương, dòng bản quyền và thông tin thêm (MST, chính sách…).
Cột chi nhánh lấy 4 chi nhánh đầu tiên ở nhóm Trang hệ thống chi nhánh (Google Sheet hoặc nhập nhanh) và chỉ hiện khi bật hệ thống chi nhánh.
Trang chủ
Tại nhóm Bố cục trang chủ bạn có thể chọn khối cho 9 vị trí từ trên xuống dưới (chọn "Không dùng" để bỏ trống vị trí). Nội dung từng khối chỉnh ở các nhóm "Trang chủ – …" tương ứng.
Đầu trang
Tại đây bạn có thể tùy chỉnh tiêu đề lớn, mô tả, 3 số liệu nổi bật, ảnh lớn (tối thiểu 1600×600 pixel), bật/tắt form đặt lịch nhanh, các khung giờ cho khách chọn và dòng báo sau khi gửi.
Dịch vụ
Tại đây bạn có thể chọn 2 danh mục dịch vụ Gia đình / Doanh nghiệp và tên nhóm, tùy chỉnh tiêu đề, số dịch vụ mỗi tab, số ký tự tối đa của dòng mô tả, dòng gợi ý và link xem tất cả. Hai danh mục này dùng chung cho form đặt lịch nhanh.
Về chúng tôi
Tại đây bạn có thể tùy chỉnh đoạn giới thiệu, các mốc phát triển (mỗi dòng "Năm | Nội dung"), 2 ảnh, ô số liệu trên ảnh, chữ và link nút.
Cam kết
Tại đây bạn có thể tùy chỉnh tiêu đề, 6 cam kết và 3 ảnh bên dưới (có thể ẩn).
Cửa hàng
Tại đây bạn có thể chọn danh mục cho tab "Tất cả", các tab tiếp theo (chọn tối đa 5 danh mục, hoặc dùng một menu nếu để trống cả 5 ô), số sản phẩm mỗi tab, ô sản phẩm nổi bật kèm nhãn, mô tả và dải khuyến mãi. Nên dùng ảnh sản phẩm vuông.
Đánh giá khách hàng
Tại đây bạn có thể tùy chỉnh điểm trung bình, dòng dưới số sao và tối đa 6 đánh giá (nội dung, tên khách, thông tin thêm, nhãn dịch vụ / sản phẩm).
Tin tức
Tại đây bạn có thể tùy chỉnh tiêu đề, chọn blog và chữ link xem tất cả. Khối hiện 5 bài mới nhất: 1 bài lớn và 4 bài nhỏ. Để trống ô Chọn blog thì lấy bài của tất cả blog (trừ blog tuyển dụng).
Dịch vụ & đặt lịch
Tại đây bạn có thể tùy chỉnh tiêu đề, mô tả trang danh sách dịch vụ, tên tab, quy trình 4 bước, khối tư vấn cuối trang, các dòng chữ ở trang chi tiết dịch vụ, 4 câu hỏi thường gặp chung và trang Đặt lịch.
Cách thiết lập
Mỗi dịch vụ là một sản phẩm, gán giao diện product.dich-vu, thêm vào danh mục chứa tất cả dịch vụ và một trong hai danh mục Gia đình / Doanh nghiệp (chọn ở nhóm Trang chủ – Dịch vụ). Danh mục dịch vụ gán giao diện collection.dich-vu.
| Nhập trên Sapo | Hiển thị |
|---|---|
| Tên, ảnh | Tên và bộ ảnh dịch vụ |
| Mô tả ngắn | Dòng mô tả dưới tên trên thẻ dịch vụ và trang danh sách |
| Mô tả | Nội dung trang chi tiết. 3 mục đầu của danh sách bullet ngay dưới tiêu đề Heading 6 "Dịch vụ bao gồm" hiện thành các dòng ✓ trên thẻ dịch vụ |
| Phiên bản | Mỗi phiên bản là một gói trong bảng giá. Giá 0 hiện "Liên hệ". Nhãn "Từ …" tự lấy giá thấp nhất |
| Đơn vị tính của phiên bản | Gói tính theo đơn vị: nhập VD m2, giờ → hiện "15.000đ/m²". Gói trọn gói để trống |
Thông tin thêm (không bắt buộc) nhập bằng metafield sản phẩm:
- custom.service_duration: thời gian thực hiện.
- custom.service_staff: nhân sự.
- custom.service_faq: câu hỏi thường gặp, mỗi dòng "Câu hỏi | Trả lời". Để trống thì dùng 4 câu chung trong cài đặt.
- custom.service_before_after: 2 link ảnh trước/sau cách nhau dấu phẩy. Để trống thì ẩn.
Trang đặt lịch
Tạo trang nội dung giao diện page.dat-lich rồi chọn ở Tiện ích > Trang Đặt lịch. Link có ?id=[id sản phẩm] chọn sẵn dịch vụ, ?brn=[tên chi nhánh] chọn sẵn chi nhánh. Khung giờ và lời nhắn sau khi gửi dùng chung với form đặt lịch nhanh ở trang chủ.
Danh mục sản phẩm
Tại đây bạn có thể tùy chỉnh mô tả dưới tiêu đề, số sản phẩm mỗi trang và cột lọc:
- Menu danh mục: mỗi link là một dòng danh mục kèm số sản phẩm.
- Sản phẩm giảm giá: nút gạt chuyển sang danh mục giảm giá bạn chọn.
- Ô khuyến mãi cuối cột lọc, dùng chung nội dung với mega menu dạng cửa hàng.
- Bộ lọc: giá (theo các mốc giá bạn nhập), tag, loại sản phẩm, xuất xứ (lấy từ ô Nhãn hiệu của sản phẩm).
Cách thiết lập
Để trang Tất cả sản phẩm không lẫn dịch vụ, tạo một danh mục chỉ chứa sản phẩm bán lẻ (VD danh mục tự động với điều kiện Loại sản phẩm khác "Dịch vụ") và chọn ở ô Danh mục cho tab "Tất cả" (nhóm Trang chủ – Cửa hàng).
Chi tiết sản phẩm
Tại đây bạn có thể tùy chỉnh 3 dòng cam kết cạnh nút mua, tên tab Mô tả, thêm 2 tab lấy nội dung từ trang (VD Giao hàng, Đổi trả), tiêu đề nhóm sản phẩm liên kết, số sản phẩm liên quan, khối sản phẩm đã xem và thanh mua hàng dính khi cuộn.
Cách thiết lập
- Nhóm sản phẩm liên kết: gắn tag cauhinh_[alias danh mục] cho các sản phẩm cùng nhóm, tag config_[nhãn] để đặt nhãn ngắn (VD config_2L). Không có tag config_ thì hiện tên sản phẩm.
- Swatch (nhóm Biến thể): bật để hiện lựa chọn phiên bản dạng nút. Tùy chọn có tên chứa "Màu" hoặc "Color" hiện chấm màu theo bảng màu (tối đa 10 màu); màu không có trong bảng sẽ lấy ảnh phiên bản.
Tin tức
Tại đây bạn có thể tùy chỉnh tiêu đề trang tin, menu chủ đề, số bài mỗi trang, tên tác giả, khung lời nhắn cuối bài, danh sách đọc thêm, mục lục bài viết (kèm nút mục lục nổi) và khối sản phẩm trong bài.
Cách thiết lập
- Chủ đề bài viết là tên danh mục của bài.
- Hiện danh sách sản phẩm ở cột phải: gắn tag sanpham_[đường dẫn danh mục].
- Hiện dịch vụ liên quan kèm nút đặt lịch: gắn tag dichvu_[đường dẫn dịch vụ].
- Chèn sản phẩm vào giữa bài:
[san-pham-tin danhmuc="nuoc-lau-san" limit="8" title="Sản phẩm trong bài"](limit và title có thể bỏ). - Mục lục tự tạo từ các tiêu đề H2, H3 trong bài (cần ít nhất 2 tiêu đề).
Trang /blogs/all tự ẩn các bài của blog tuyển dụng.
Giới thiệu
Tại đây bạn có thể tùy chỉnh tiêu đề, ảnh và 2 số liệu đầu trang, tiêu đề các phần, đội ngũ điều hành (tối đa 4 người) và khối tuyển dụng.
- Câu chuyện thương hiệu là nội dung của trang (giao diện page.gioi-thieu).
- Hành trình phát triển lấy từ các mốc ở nhóm Trang chủ – Về chúng tôi; 6 giá trị lấy từ 6 cam kết ở nhóm Trang chủ – Cam kết.
- Khối tuyển dụng hiện 3 vị trí mới nhất của blog tuyển dụng.
Tuyển dụng
Tại đây bạn có thể tùy chỉnh tiêu đề, ảnh và số liệu đầu trang, 6 quyền lợi, quy trình tuyển dụng 4 bước và form ứng tuyển.
Cách thiết lập
- Tạo danh mục blog Tuyển dụng, chọn giao diện blog.tuyen-dung, rồi chọn blog này ở ô Đường dẫn blog tuyển dụng.
- Mỗi vị trí là một bài viết: tiêu đề bài là tên vị trí; nội dung gồm các tiêu đề H3 (VD Mô tả công việc, Yêu cầu) kèm danh sách, mỗi tiêu đề thành một cột.
- Nhập thông tin ngắn bằng tag: cn_Hà Nội (nơi làm việc, tên trùng tên chi nhánh, gắn nhiều tag nếu tuyển nhiều nơi), ht_Toàn thời gian, luong_8 – 11 triệu, sl_10 người, han_31/10/2026.
Khách có thể lọc vị trí theo chi nhánh và hình thức. Vị trí đầu tiên luôn mở sẵn, mở vị trí khác thì vị trí cũ tự đóng. Hết tuyển thì ẩn bài viết.
Hệ thống chi nhánh
Tại nhóm Trang hệ thống chi nhánh bạn có thể bật/tắt hệ thống chi nhánh, chọn trang chi nhánh (giao diện page.store), nhập danh sách chi nhánh (nhập nhanh hoặc Google Sheet), tùy chỉnh mô tả đầu trang, ảnh từng chi nhánh và khối kêu gọi cuối trang. Tắt hệ thống chi nhánh thì ẩn link Chi nhánh trên header, menu điện thoại, chân trang và trang Liên hệ.
Danh sách chi nhánh dùng chung cho trang chi nhánh, cột chi nhánh ở chân trang và ô chọn chi nhánh trong các form đặt lịch, liên hệ, tuyển dụng.
Cách 1: Nhập nhanh (1–4 chi nhánh)
Để trống ô link Google Sheet, rồi điền Tên, Địa chỉ, Điện thoại, Giờ mở cửa, Link Google Maps của từng chi nhánh ở phần Nhập nhanh chi nhánh. Chi nhánh cần có Tên và Địa chỉ mới hiển thị; ảnh tải ở ô Ảnh chi nhánh trong khối của chi nhánh đó.
Cách 2: Google Sheet (nhiều chi nhánh)
- Tạo Google Sheet, dòng 1 là tiêu đề cột (thứ tự tùy ý): Tên | Tỉnh/thành | Địa chỉ | Điện thoại | Giờ mở cửa | Đội ngũ | Phục vụ | Dịch vụ | Bản đồ | Ảnh. Bắt buộc Tên và Địa chỉ.
- Chia sẻ sheet ở chế độ "Bất kỳ ai có đường liên kết" (Người xem), sao chép link và dán vào ô Link Google Sheet danh sách chi nhánh. Có link sheet thì phần nhập nhanh được bỏ qua.
- Giờ mở cửa: ghi dạng chữ (VD 7:00 – 21:00) hoặc tách 2 cột Giờ mở, Giờ đóng.
- Dịch vụ: cách nhau dấu ;.
- Bản đồ: dán link nhúng Google Maps để ghim đúng vị trí; để trống thì bản đồ tìm theo địa chỉ.
- Ảnh: dán link ảnh (https://…), dùng được link chia sẻ Google Drive ở chế độ "Bất kỳ ai có đường liên kết". Để trống thì hiện nền sọc.
Có từ 2 tỉnh/thành sẽ hiện ô lọc theo tỉnh, nhiều hơn 5 chi nhánh sẽ hiện ô tìm kiếm.
Liên hệ
Tại đây bạn có thể tùy chỉnh tiêu đề, mô tả, số điện thoại doanh nghiệp, tên Zalo OA, bản đồ trụ sở, các chủ đề hỗ trợ trong form, gợi ý trong ô nội dung và lời nhắn sau khi gửi. Hotline, email, giờ làm việc, link Zalo lấy từ Thiết lập chung.
Bản đồ trụ sở: dán mã nhúng Google Maps (Chia sẻ > Nhúng bản đồ > Sao chép HTML) để ghim chính xác, hoặc gõ địa chỉ để bản đồ tự tìm. Để trống để ẩn bản đồ.
Sản phẩm yêu thích
Tại Tiện ích > Sản phẩm yêu thích bạn có thể bật/tắt tính năng yêu thích và chọn trang hiển thị danh sách (trang nội dung giao diện page.wishlist).
Tài khoản
Tại đây bạn có thể tùy chỉnh nhãn, tiêu đề và 3 quyền lợi ở cột giới thiệu cạnh form đăng nhập, đăng ký và lời mời đặt lịch cuối trang tài khoản. Bật tài khoản khách hàng trong cài đặt Sapo để dùng các trang này.
