Bộ câu lệnh copy-paste để tự dựng Landing Page · Website · Dashboard — không cần biết code. Mỗi prompt thay [...] bằng thông tin của anh chị rồi dán vào Claude Code.
Nguyên tắc vàng: Anh chị là ĐẠO DIỄN, Claude là THỢ. Mô tả càng rõ → web càng trúng. Trang đầu luôn ~60%, sửa 2–3 lượt mới ra 100% — bình thường.
Dùng trước khi dựng bất kỳ trang nào — đây là "kịch bản" đưa cho Claude.
1. SẢN PHẨM: tôi bán [......] giá [......]
2. KHÁCH: người mua là [......] (nỗi đau lớn nhất [......])
3. MỤC TIÊU TRANG: để khách [mua / để lại SĐT / nhắn Zalo]
4. CÁC PHẦN CẦN CÓ: [hero, nỗi đau, giải pháp, giá, lời khen, FAQ]
5. CẢM GIÁC / MÀU: [vd: ấm áp nhẹ nhàng, trắng kem điểm hồng]
② Lệnh đầu tiên (test máy chạy được)
Sau khi cài Claude Code, gõ để chắc chắn mọi thứ hoạt động.
Chào Claude, tạo giúp tôi 1 trang HTML hiện dòng chữ
"Tôi làm được rồi" ở giữa màn hình, nền màu hồng.
Xong cho tôi biết mở file nào để xem.
🛬 2. Dựng Landing Page
③ Dựng landing bán hàng từ dàn ý
Dán brief/dàn ý 7 khối vào → 30 phút có trang chạy.
Dựng cho tôi 1 trang landing bán hàng, 1 cột, cuộn dọc,
HTML + CSS, tiếng Việt. Nội dung theo dàn ý sau:
[DÁN DÀN Ý 7 KHỐI: Hero · Nỗi đau · Niềm tin · Giải pháp ·
Bằng chứng · Giá · FAQ]
Yêu cầu:
- Đủ các khối đúng thứ tự. Nút hành động lặp ở đầu + sau khối giá.
- Tông màu: [......]. Chữ tiếng Việt có dấu, đọc dễ trên điện thoại.
- Xong cho tôi biết mở file nào để xem.
💡 Trang ra tiếng Anh? Gõ tiếp: "Viết lại toàn bộ nội dung bằng tiếng Việt có dấu."
🎨 3. Sửa & tinh chỉnh
④ Câu lệnh sửa CÓ KHÓA (quan trọng nhất)
Chống AI "tiện tay" phá chỗ khác khi sửa. Dùng MỌI lần sửa.
CHỈ sửa [phần cần sửa]: [mô tả thay đổi].
GIỮ NGUYÊN toàn bộ phần còn lại. Không đổi màu/bố cục chỗ khác.
⑤ Đổi màu / font + chèn ảnh thật
Khoác "áo thương hiệu" cho trang.
Đổi tông màu trang sang [vd: xanh rêu + kem], font dễ đọc hiện đại,
tiêu đề to rõ hơn. GIỮ NGUYÊN bố cục và nội dung các khối.
Trong folder có ảnh [ten-anh.jpg]. Dùng làm ảnh đầu trang,
co đúng khung, không vỡ trên điện thoại.
💡 Trước khi sửa lớn: "Lưu lại bản hiện tại trước khi sửa" — lỡ hỏng còn quay về được.
🚀 4. Đưa lên mạng (Deploy)
⑥ Đưa web lên Vercel (ra link sống)
Đưa trang web trong folder này lên Vercel giúp tôi để có link
công khai. Hướng dẫn tôi từng bước nếu cần đăng nhập.
⑦ Thêm nút chốt đơn (Zalo / gọi / mua)
Thêm nút "Nhắn Zalo đặt mua" dẫn tới https://zalo.me/[số],
và nút "Gọi ngay" gọi số [SĐT]. Đặt nút nổi cố định ở góc dưới
trên điện thoại. Giữ nguyên phần còn lại.
🌐 5. Website nhiều trang & Dashboard
⑧ Dựng website nhiều trang + chuẩn điện thoại
Dựng website cho [tên] gồm 4 trang: trang chủ, sản phẩm,
giới thiệu, liên hệ. Có thanh menu nối các trang.
Chạy đẹp trên điện thoại (responsive).
💡 Web vỡ trên điện thoại? "Trên màn hình điện thoại, chỉnh lại [khối X] cho gọn, không đè nhau."
⑨ Thêm form thu khách + Zalo/Map + SEO
Thêm form thu tên + số điện thoại, nút Zalo, nhúng Google Map
[địa chỉ]. Thêm tiêu đề + mô tả SEO cho từng trang để lên Google.
⑩ Dựng dashboard báo cáo + khóa mật khẩu
Dựng 1 trang dashboard hiện: đơn hôm nay, doanh thu tháng,
biểu đồ 7 ngày. Bảo vệ bằng mật khẩu. Lấy data từ [Google Sheet].
Bắt đầu bằng data mẫu cho tôi xem trước.
🛠️ 6. Gỡ lỗi (web hỏng đừng sợ)
⑪ Nhờ Claude tự sửa lỗi
Bí quyết: anh chị không cần biết sửa — chỉ cần đưa lỗi cho Claude.
[Dán nguyên dòng lỗi vào đây]
Lỗi này trên máy [Windows/Mac] của tôi sửa sao? Hướng dẫn từng bước,
giải thích đơn giản như cho người không biết code.