Chào mừng đến với
Wolf Paint
Tất cả thông tin cần thiết được viết trong các phần sau. Chúng tôi giữ mọi thứ dễ hiểu nhất có thể để bạn có thể đọc và làm theo.
- Version: 1.0
- Author: Wolf Themes
- Created: 20 July, 2026
- Update: 20 July, 2026
Nếu bạn có bất kỳ câu hỏi nào, vui lòng gửi email qua [email protected].
Cài đặt
Mua giao diện từ kho theme Sapo và cài đặt vào website
- Kích thước sử dụng cho ảnh sản phẩm đề nghị: 900x900 pixels
- Kích thước sử dụng cho ảnh tin tức sẽ đề nghị: 1200x800 pixels
Thiết lập chung
Vào Thiết lập giao diện > Thiết lập chung, bạn có thể thay đổi
- Tùy chỉnh icon đầu trang (Favicon)
- Tắt mở tính năng xem nhanh sản phẩm
- Thiết lập sản phẩm yêu thích
- Thiết lập màu sắc chủ đạo cho giao diện
- Thiết lập từ khóa cho trang chủ
Popup Banner khuyến mãi
Hiển thị popup khuyến mãi khi khách hàng vào website
Vào Thiết lập giao diện > Popup Banner khuyến mãi, bạn có thể thay đổi
- Bật tắt tính năng
- Thay đổi ảnh bao gồm
- Hình ảnh
- Kích thước mặc định
- Thẻ ALT hỗ trợ SEO
- Liên kết trỏ tới
- Thời gian hiển thị sau khi load trang.
- Thời gian hiển thị lại sau khi đóng.
Thông tin liên hệ
Hiển thị thông tin tùy chỉnh, nếu không chọn sẽ lấy thông tin mặc định từ website.
Vào Thiết lập giao diện > Thông tin Liên hệ toàn trang, bạn có thể thay đổi
- Tên cửa hàng
- Địa chỉ
- Số điện thoại
Nút liên hệ hỗ trợ
Hiển thị nút liên hệ ở góc dưới bên phải của website.
Vào Thiết lập giao diện > Nút liên hệ hỗ trợ, bạn có thể thay đổi
- Màu sắc mặc định của nút
- Thông tin Hotline
- Thông tin Zalo
- Thông tin Messenger
- Liên kết tới hệ thống cửa hàng
Popup Góc trái
Hiển thị ở góc dưới bên trái của website. Cho phép tùy chỉnh 5 thông tin khác nhau
Vào Thiết lập giao diện > Popup Góc trái, bạn có thể thay đổi nội dung cho các mục.
Bố cục
Hướng dẫn tùy chỉnh Đầu trang, Chân trang
Đầu trang
Vào Thiết lập giao diện > Đầu trang, bạn có thể thay đổi nội dung cho các mục.
- Tùy chỉnh logo trang web
- Hiển thị hệ thống cửa hàng
- Bật tắt chức năng tìm kiếm thông minh
- Thiết lâp Menu cho website
Chân trang
Vào Thiết lập giao diện > Chân trang, bạn có thể thay đổi nội dung cho các mục.
- Thiết lập thông tin mô tả cửa hàng, Liên kết đến website đăng ký Bộ công thương
- Thiết lập Menu chân trang
- Thiết lập liên kết và icon các mạng xã hội
- Thiết lâp các icon hình thức thanh toán
- Thay đổi nội dung bản quyền website
Trang chủ
Chúng tôi cung cấp các module ở trang chủ, bạn có thể lựa chọn và sắp xếp vị trí của chúng
Trang chủ - Module Slider
Vào Thiết lập giao diện > Trang chủ - Module Slider, bạn có thể thay đổi
- Bật tắt slider
- Thay đổi ảnh slider Desktop và Mobile. Lưu ý, nhập ảnh kích thước giống như kích thước khuyên dùng để hiển thị tốt nhất
- Thiết lập thẻ ALT, Liên kết tới slider
Trang chủ - Module Không gian sống
Vào Thiết lập giao diện > Trang chủ - Module Không gian sống, bạn có thể thay đổi
- Thay đổi nội dung, hình ảnh
- Thay đổi liên kết
Trang chủ - Module Danh mục sản phẩm
Vào Thiết lập giao diện > Trang chủ - Module Danh mục sản phẩm, bạn có thể thay đổi
- Thay đổi nội dung, hình ảnh
Trang chủ - Module Bộ sưu tập màu
Vào Thiết lập giao diện > Trang chủ - Module Bộ sưu tập màu, bạn có thể thay đổi
- Thay đổi thông tin: nội dung, hình ảnh
Trang chủ - Module Máy tính lượng sơn
Vào Thiết lập giao diện > Trang chủ - Module Máy tính lượng sơn, bạn có thể thay đổi
Trang chủ - Module Sản phẩm nổi bật
Vào Thiết lập giao diện > Trang chủ - Module Sản phẩm nổi bật, bạn có thể thay đổi
- Thay đổi nội dung
Trang chủ - Module Banner
Vào Thiết lập giao diện > Trang chủ - Module Banner, bạn có thể thay đổi
- Thay đổi ảnh
- Thay đổi liên kết
Trang chủ - Module Tin tức
Vào Thiết lập giao diện > Trang chủ - Module Tin tức, bạn có thể thay đổi
- Tiêu đề
- Danh mục và số lượng tin hiển thị
- Nội dung nút xem thêm
Thiết lập Sản phẩm
Cung cấp các thiết lập liên quan đến Trang danh mục sản phẩm, Bộ lọc sản phẩm và Trang chi tiết sản phẩm
Trang danh sách sản phẩm
Vào Thiết lập giao diện > Trang danh sách sản phẩm, bạn có thể thay đổi
- Số lượng sản phẩm hiển thị trên 1 trang
- 2 nội dung khuyến mãi
- Top sản phẩm bán chạy
- Menu danh mục sản phẩm
2 nội dung khuyến mãi
Menu danh mục sản phẩm
Mô tả; Ảnh banner đầu trang; Flash sale; Bộ lọc theo danh mục
Để hiển thị, sử dụng đoạn shortcode bên dưới. Đặt vào phần mô tả danh mục sản phẩm
Nội dung mô tả danh mục
------
[collections-img image1="Url ảnh 1" alt1="Thẻ ALT" url1="Liên kết" image2="Url ảnh 2" alt2="Thẻ ALT" url2="Liên kết" image3="Url ảnh 3" alt3="Thẻ ALT" url3="Liên kết"]
------
[collections-sales danhmuc="Tên danh mục" limit="6" title="Tiêu đề module" des="Mô tả"]
------
[collections-filter content="
Tiêu đề lọc (Chọn thẻ h6)
Các tag lọc, cách nhau dấu ;
"]
Bộ lọc sản phẩm
Vào Thiết lập giao diện > Bộ lọc sản phẩm, bạn có thể thay đổi
- Bộ lọc theo hãng, lấy từ thuộc tính Nhà cung cấp
- Loại sản phẩm, lấy từ thuộc tính loại
- Lọc theo mức giá
- Lọc theo Tag1, Tag2, Tag3, lấy từ tag sản phẩm
- Lọc theo tag tùy chỉnh cho từng danh mục sản phẩm
- Để dùng bộ lọc tag riêng khác nhau cho từng DMSP. Vui lòng nhập trong mô tả danh mục sản phẩm theo cú pháp Tên bộ lọc (Đặt trong thẻ h6) và dưới tiêu đề h6 sẽ là các giá trị của bộ lọc. Các giá trị cách nhau bằng dấu chấm phẩy (;)
Trang chi tiết sản phẩm
Vào Thiết lập giao diện > Trang sản phẩm, bạn có thể thay đổi
- Tắt bật Biến thể màu
- Khuyến mãi và ưu đãi
- Đăng ký nhận thông tin khi sản phẩm hết hàng
- Khối gợi ý sản phẩm mua kèm
- Đặc điểm nổi bật
Định nghĩa metafield
Tạo các metafield bên dưới để nhập thông tin cho trang chi tiết sản phẩm
Giờ vàng giá sốc
Sử dụng Quản lý số lượng tồn kho. Nhập số lượng tồn kho
Nhập metafield total_stock, là tổng sô sản phẩm. Phải lớn hơn số lượng tồn kho thực tế.
Nhập metafield time, cho thời gian đếm ngược. Định dạng giờ:phút:giây
Khuyến mãi và ưu đãi
Thiết lập nội dung hiển thị mặc định cho toàn bộ sản phẩm
Để thiết lập khuyến mãi khác nhau cho từng sản phẩm. Nhập metafield khuyenmai
Nhập mã bên dưới và thay nội dung cho phù hợp
<div class="gift-h4">Nhận ngay Thùng 10 gói giấy rút đa năng Lency</div>
<p>Khi mua đơn hàng nguyên giá từ 2 triệu VNĐ</p>
<div class="date"><svg width="20" height="20"><use xlink:href="#icon-calendar"></use></svg>Áp dụng từ 18.6.2026</div>
Đăng ký nhận thông tin khi sản phẩm hết hàng
Tính năng cho phép khách hàng nhập thông tin để nhận thông báo khi sản phẩm về hàng. Thông tin khách hàng sẽ được lưu trong file Google Sheet.
- Vào https://drive.google.com. Tạo 1 file Google trang tính. Đặt tên Đăng ký nhận thông tin sản phẩm hết hàng
- File gồm các cột thông tin sau: Tên sản phẩm; Thuộc tính; Email; Ngày đăng ký
- Vào Tiện ích mở rộng. Chọn Apps Scripts
- Nhập nội dung sau:
function doPost(e) {
try {
var ss = SpreadsheetApp.openById('SheetID');
var sheet = ss.getSheetByName('Sheet1');
// Xử lý dữ liệu
var data = e.parameter; // Dành cho application/x-www-form-urlencoded
// Kiểm tra dữ liệu hợp lệ
if (!data.scustomer_email || !data.sproduct_id) {
return ContentService
.createTextOutput(JSON.stringify({ result: 'error', message: 'Missing required fields' }))
.setMimeType(ContentService.MimeType.JSON)
.addHeader('Access-Control-Allow-Origin', '*')
.addHeader('Access-Control-Allow-Methods', 'POST, OPTIONS')
.addHeader('Access-Control-Allow-Headers', 'Content-Type');
}
// Thêm dữ liệu vào Google Sheet
sheet.appendRow([data.sproduct_id, data.svariant_id || '', data.scustomer_email, new Date()]);
// Trả về phản hồi thành công
return ContentService
.createTextOutput(JSON.stringify({ result: 'success', message: 'Data saved successfully' }))
.setMimeType(ContentService.MimeType.JSON)
.addHeader('Access-Control-Allow-Origin', '*')
.addHeader('Access-Control-Allow-Methods', 'POST, OPTIONS')
.addHeader('Access-Control-Allow-Headers', 'Content-Type');
} catch (error) {
return ContentService
.createTextOutput(JSON.stringify({ result: 'error', message: error.message }))
.setMimeType(ContentService.MimeType.JSON)
.addHeader('Access-Control-Allow-Origin', '*')
.addHeader('Access-Control-Allow-Methods', 'POST, OPTIONS')
.addHeader('Access-Control-Allow-Headers', 'Content-Type');
}
}
function doGet(e) {
// Xử lý yêu cầu OPTIONS cho CORS preflight
return ContentService
.createTextOutput()
.setMimeType(ContentService.MimeType.JSON)
.addHeader('Access-Control-Allow-Origin', '*')
.addHeader('Access-Control-Allow-Methods', 'POST, OPTIONS')
.addHeader('Access-Control-Allow-Headers', 'Content-Type');
}
- Trong đó SheetID là id của Trang tính. SheetName là tên của Sheet trang tính
- Tiếp theo bấm vào Triển khai/Tùy chọn triển khai mới
- Chọn Người có quyền truy cập làBất cứ ai. Bấm triển khai
- Sao chép ID triển khai dán vào mục URL webhook ở Thiết lập chung > Trang sản phẩm > KHỐI NHẬN THÔNG TIN KHI SẢN PHẨM HẾT HÀNG
Khối gợi ý sản phẩm mua kèm
Liệt kê các sản phẩm mua kèm với sản phẩm đang xem.
Để thiết lập các sản phẩm mua kèm khác nhau cho từng sản phẩm. Vào Cấu hình/ Metafield/ Sản phẩm
Thêm Định nghĩa metafield đặt tên fbt_products. Chọn Kiểu Văn bản nhiều dòng
Vào sản phẩm cần thêm sản phẩm mua kèm. Chọn Metafield
Nhập danh sách các url của sản phẩm mua kèm vào Metafield fbt_products. Mỗi url cách nhau bằng dấu phẩy. hỗ trợ tối đa 4 sản phẩm
Video sản phẩm
Copy link video từ youtube dán vào metafield video.
Trang Blog
Vào Thiết lập giao diện > Trang Blog, bạn có thể thay đổi
- Số lượng tin hiển thị trên 1 trang
- Thiết lập Banner đầu trang
- Tắt mở tính năng chia sẻ bài viết
Trang chi tiết bài viết
Chúng tôi cung cấp 3 mẫu shortcode để hiển thị sản phẩm trong nội dung bài viết
Mẫu hiển thị 1
Dán đoạn này vào vị trí cần hiển thị. Thay nội dung cần thiết
[article-top-products danhmuc="Tên danh mục sản phẩm" limit="5" title="Tiêu đề hiển thị bên ngoài"]
Mẫu hiển thị 2
Dán đoạn này vào vị trí cần hiển thị. Thay nội dung cần thiết
[article-one-product alias="url sản phẩm"]
Mẫu hiển thị 3
Dán đoạn này vào vị trí cần hiển thị. Thay nội dung cần thiết
[article-one-product2 alias="url sản phẩm"]
Trang Liên hệ
Vào Thiết lập giao diện > Trang liên hệ, bạn có thể thay đổi
- Thông tin địa chỉ, số điện thoại email được lấy từ phần thiết lập chung
- Thay đổi tiêu đề, nội dung mô tả
- Thiết lập bản đồ
Trang Hệ thống cửa hàng
Vào Thiết lập giao diện > Trang Hệ thống cửa hàng, bạn có thể thay đổi
- Tạo 1 trang nội dung và chọn khung giao diện là page.he-thong-cua-hang
Tạo 1 trang google sheet có các cột như hình ảnh.
2. Tạo Web App bằng Google Apps Script (API)
- Trong file Google Sheet, vào menu Extensions (Tiện ích mở rộng) -> Apps Script.
- Xóa hết code mặc định và dán đoạn mã sau vào:
function doGet(e) {
// Thay thế ID và tên trang tính của bạn ở đây
const SHEET_ID = "ID_FILE_GOOGLE_SHEET_CUA_BAN";
const SHEET_NAME = "TEN_TRANG_TINH_CUA_BAN"; // Ví dụ: 'Sheet1'
try {
const sheet = SpreadsheetApp.openById(SHEET_ID).getSheetByName(SHEET_NAME);
const data = sheet.getDataRange().getValues();
const headers = data.shift();
const jsonData = data.map(row => {
let store = {};
headers.forEach((header, index) => {
store[header] = row[index];
});
return store;
});
return ContentService
.createTextOutput(JSON.stringify(jsonData))
.setMimeType(ContentService.MimeType.JSON);
} catch (error) {
return ContentService
.createTextOutput(JSON.stringify({ error: error.message }))
.setMimeType(ContentService.MimeType.JSON);
}
}
Triển khai Web App:
- Nhấn nút màu xanh Deploy -> New deployment.
- Nhấn vào biểu tượng bánh răng (⚙️) và chọn Web app.
- Trong phần "Configuration":
- Execute as: Me (email của bạn).
- Who has access: Chọn Anyone (Rất quan trọng).
- Nhấn Deploy, cho phép các quyền cần thiết.
- Sao chép lại URL của Web app. Đây là link API của bạn.
Vào thiết lập giao diện. Chọn trang bảo hành, dán link API vào URL Web App.
Trang Bảng màu
Tạo 1 danh mục sản phẩm mới. Với khung giao diện collection.bangmau
Trang Chi tiết màu
Tạo 1 sản phẩm mới. Chọn khung giao diện product.bangmau
Tạo các metafield bên dưới để nhập thông tin cho trang chi tiết màu
Tính năng nổi bật, nhập ở Thiết lập giao diện > Trang Chi tiết màu
Nhập Chi tiết màu
Tag Màu sắc thịnh hành 2026 nhập metafield color_badge
Phần mô tả Tím đỏ, sắc màu của hoàng gia.... nhập ở mô tả ngắn của sản phẩm
Mã SKU màu 50RB 10/219, Nhập ở Mã SKU
Màu màu HEX #624B6E nhập metafield color_hex
Màu màu RGB 98, 75, 100 nhập metafield color_rgb
Màu màu Độ sáng 10% nhập metafield color_lightness
Hình ảnh. Upload hình ảnh có kích thước vuông, lên phần Ảnh sản phẩm
Nhập Bộ sưu tập màu
Nhập metafield related_colors. Nhập alias của mỗi màu, mỗi alias cách nhau dấu ,
Nhập Gợi ý phối màu
Nhập metafield color_combinations. Copy/paste cấu trúc văn bản này vào (mỗi dòng 1 kiểu phối, tên và các mã màu cách nhau bởi dấu |)
California Raisin & Trắng Sứ | #624B6E, #E5DFE6, #FFFFFF
California Raisin & Be Ấm | #624B6E, #DBCBB8, #F2EAE1
California Raisin & Hồng Đất | #624B6E, #B88FA1, #E3CDD6
California Raisin & Vàng Đồng | #624B6E, #C49B55, #E6D5B8
California Raisin & Xanh Sage | #624B6E, #98A89A, #C5CEC6
California Raisin & Xám Khói | #624B6E, #92949C, #CFD1D6
California Raisin & Nâu Walnut | #624B6E, #7A5B4C, #B89C8F
California Raisin & Xanh Navy | #624B6E, #344C68, #A6B3C2
California Raisin & Băng Gốc (Ice Blue) | #624B6E, #A9C2C6, #DDF2F4
Nhập Sản phẩm gợi ý
Nhập metafield suggested_paints. Mỗi alias sản phẩm cách nhau dấu ,
Trang Flash Sale
Xem demo tại đây
Tạo trang nội dung. Chọn khung giao diện là page.deal
Tại đây có 4 mã shortcode để tạo 4 module khác nhau.
Module 1
Copy shortcode bên dưới và thay nội dung tương ứng
[promotionbanner title="Tiêu đề" url="Liên kết" image="URL Ảnh Desktop" imagemb="URL Ảnh Mobile"]
Module 2
Copy shortcode bên dưới và thay nội dung tương ứng
[flashsale title1="Tiêu đề 1" title2="Tiêu đề 2" title3="Mô tả" time="21:30:45" danhmuc="Danh mục sản phẩm" limit="7"]
Module 3
Copy shortcode bên dưới và thay nội dung tương ứng
[blockproduct title="Tiêu đề" title2="Mô tả" danhmuc="Danh mục sản phẩm" limit="7"]
Module 4
Copy shortcode bên dưới và thay nội dung tương ứng
[promotionlistbanner title="Tiêu đề" title2="Mô tả" image1="URL Ảnh 1" url1="Liên kết" alt1="Thẻ ALT" image2="URL Ảnh 2" url2="Liên kết" alt2="Thẻ ALT" image3="URL Ảnh 3" url3="Liên kết" alt3="Thẻ ALT" image4="URL Ảnh 4" url4="Liên kết" alt4="Thẻ ALT" image5="URL Ảnh 5" url5="Liên kết" alt5="Thẻ ALT" image6="URL Ảnh 6" url6="Liên kết" alt6="Thẻ ALT"]
Các giao diện khác
Tham khảo các giao diện khác của chúng tôi
