# CHO CLAUDE ĐỌC: Bước 12. Website chuyên gia và sale page

> Tài liệu này viết cho Claude Code của học viên. Người học chỉ cần dán câu lệnh bên dưới vào Claude, Claude đọc file này rồi làm.
> Thuộc hệ thống triển khai AI 20 bước của Trương Minh Kiên. Trang bước này: https://trienkhaiweb.truongminhkien.vn

## Việc cần làm

Mở đầu bằng công cụ chẩn đoán, không phải danh mục khoá học. Sale page có mã QR chuyển khoản, lead chảy vào Lark Base.

Câu lệnh học viên dán vào Claude:

```
Tải gói https://trienkhaiweb.truongminhkien.vn/website-sale-page.zip, giải nén, đọc CHO-CLAUDE-DOC.md, cài các skill trong gói rồi dựng website chuyên gia cho ngành của tôi, mở đầu bằng công cụ chẩn đoán
```

## Luật khi làm

1. Đọc hết file này, kể cả phần bẫy, trước khi chạy lệnh nào.
2. Việc cần mật khẩu, mã OTP, token hay thanh toán thì dừng lại để học viên tự làm, không nhập hộ.
3. Không xoá dữ liệu, bản ghi DNS hay file cũ của học viên. Chỉ thêm.
4. Khoá bí mật chỉ nằm trong `.env` (đã có trong `.gitignore`), không ghi vào mã, wiki hay kết quả.
5. Xong mỗi bước thì kiểm tra thật (chạy thử, đọc lại) rồi mới báo xong.
6. Gói này chạy trên máy của học viên, không phải máy người soạn. Mọi đường dẫn tính từ thư mục giải nén hoặc thư mục vault của học viên; hỏi học viên nếu cần. Skill nào nhắc tới file `output/...` hay trang `wiki/...` mà vault học viên chưa có thì đó chỉ là nguồn tham khảo của người soạn: bỏ qua, dùng nội dung ngay trong skill. Riêng `wiki/concepts/bo-mau-thuong-hieu.md`: nếu chưa có, chép từ `mau/bo-mau-thuong-hieu.md` trong gói rồi hỏi học viên để điền.

## Skill trong gói

- `sale-page-16-buoc`
- `salepage-warrior-plus-hoc-vien`
- `tmk-mkt-ladipage`
- `tmk-mkt-sale-page-chuyen-doi-cao`
- `tmk-mkt-web-dich-vu`
- `tmk-mkt-website-wordpress-thu-lead`

Cách cài skill: chép từng thư mục trong `.claude/skills/` của gói vào `.claude/skills/` của vault Obsidian (bước 1). Tên thư mục phải trùng tên skill, file chính tên `SKILL.md`.

## Cách cài đặt từng bước (làm theo thứ tự)

### CHO CLAUDE ĐỌC — dựng website chuyên gia, mở đầu bằng công cụ chẩn đoán

> Bạn là Claude Code trên máy một người mới. Họ vừa dán: *"Dựng website chuyên gia cho ngành của
> tôi, mở đầu bằng công cụ chẩn đoán, lead chảy vào Lark Base Lead"*. Toàn bộ phương pháp nằm trong
> skill `.claude/skills/tmk-mkt-website-wordpress-thu-lead/` — chép vào bộ não của họ (hoặc
> `~/.claude/skills/`) rồi **đọc SKILL.md trước**. Tệp này chỉ thêm hai thứ skill chưa có: **chọn
> đường đăng** và **bẫy hạ tầng** đã trả giá sau ngày skill được viết.

## 0. Chọn đường đăng — hỏi người dùng một câu

| | Đường A — **trang tĩnh trên Cloudflare Pages** (khuyên dùng) | Đường B — **WordPress trên hosting** (skill viết cho đường này) |
|---|---|---|
| Hợp với | Người mới, muốn nhanh, tự chủ, 0đ | Đã có hosting/WordPress, cần blog nhiều bài, plugin |
| Claude làm được tới đâu | **Toàn bộ**: viết, dựng, đăng, gắn tên miền, nối Lark, nghiệm thu | Viết + dựng + đóng gói; **cài lên hosting, DNS, SSL do người dùng bấm** — Claude hướng dẫn từng bước |
| Biểu mẫu → Lark | Pages Function (mẫu trong gói `sach-0d-trang-thu`) | Plugin PHP của skill (`references/05`) |
| Bẫy đã gặp | Ít: biến môi trường, deploy đúng thư mục | Nhiều: DNS bị khoá, HTTPS chết, theme bó cột 645px, `wp_localize_script` câm |

Câu hỏi: *"Anh/chị đã có hosting WordPress chưa? Chưa → tôi dựng trang tĩnh trên Cloudflare, miễn
phí, xong trong buổi."*

## 1. Làm theo skill — thứ tự không đổi

1. `references/01` mổ xẻ 3 đối thủ cùng ngách (đọc thật, không bịa).
2. `references/02` khung 11 khối trang chủ — viết chữ **cùng người dùng**, duyệt từng khối.
3. `references/04` công cụ chẩn đoán 10–15 câu: khách tự chấm → điểm hiện ngay → phần khuyến nghị
   khoá sau số điện thoại. Đây là lý do cả website tồn tại.
4. Thang 3 bậc: quà 0đ (gói `sach-0d-trang-thu`) → sản phẩm vào cửa → sản phẩm chính.
5. `references/05` dây chuyền lead → Lark Base → thư xác nhận (gói `may-gui-thu`).
6. Nghiệm thu bằng `scripts/kiem-website.sh https://<tên-miền> / /cong-cu/ /gioi-thieu/` — **luôn
   thêm `?n=$RANDOM`**, trình đọc trang giữ bộ đệm 15 phút và đã hai lần báo nhầm "trang hỏng".

## 2. Đường A — đăng trang tĩnh

```
npx wrangler pages project create <ten-du-an> --production-branch main
cd site && npx wrangler pages deploy . --project-name <ten-du-an> --branch main
```
Gắn tên miền: API `POST /accounts/{acc}/pages/projects/{du-an}/domains` + DNS CNAME proxied (xem gói
`ten-mien-cloudflare`). Công cụ chẩn đoán viết bằng HTML/JS thuần, điểm tính ở trình duyệt, kết quả
+ số điện thoại POST về `/api/lead` (chép `functions/api/lead.js` từ gói `sach-0d-trang-thu`, thêm cột
`Điểm` và `Câu trả lời`).

## 3. Đường B — WordPress: bẫy hạ tầng đã trả giá (ngoài 10 bẫy trong `references/06`)

| # | Bẫy | Cách xử |
|---|---|---|
| 1 | Cài WordPress xong nhưng **nhà đăng ký khoá DNS** (Mắt Bão: cờ DNSSEC kẹt) → trang không lên, HTTPS chết | Đo trước bằng gói `ten-mien-cloudflare`; đưa tên miền về Cloudflare **trước** khi cài |
| 2 | HTTPS "chết" hoá ra là bản ghi bị **tắt proxy** trên Cloudflare | Bật lại mây cam; chứng chỉ Cloudflare mới phủ |
| 3 | Bảng điều khiển hosting (AIDA/cloudlogin) có ô **"Không quản lý DNS"** bật cho riêng tên miền | Bỏ tích; vùng dữ liệu sinh lại ngay |
| 4 | Thiết kế đẹp nhưng **theme ép vào cột 645px** — nhìn như xấu | Đo từng tầng bằng DevTools: thường chỉ một thẻ bị chặn → 2 dòng CSS bổ sung, **không dựng lại** |
| 5 | Chuyển hướng tên miền cũ → mới bằng công cụ của hosting **không chạy** vì WordPress bắt đường dẫn trước | 3 dòng `RewriteRule` ở **đầu** `.htaccess`, ngoài cặp `# BEGIN/END WordPress` |
| 6 | Ảnh mượn từ máy chủ bên thứ ba (Webcake/pancake) chết lặng lẽ | Tải về máy chủ mình; nén webp bằng plugin |
| 7 | Việc đến tay người dùng (đăng nhập hosting, dán mã) mà hướng dẫn mơ hồ | **Hướng dẫn chi tiết ngay lần đầu**: từng nút, từng ô, ảnh chụp nếu được |
| 8 | Nhấp chuột tự động lệch toạ độ trên bảng điều khiển hosting | Đổi kích thước cửa sổ trình duyệt rồi nhấp lại |

## 4. Nghiệm thu cuối (đủ mới xong)

- [ ] Trang chủ, trang công cụ, trang giới thiệu, trang liên hệ: 200, đúng chữ đã duyệt, co giãn ở 402px.
- [ ] Làm bài chẩn đoán thật trên điện thoại → điểm hiện → điền số → dòng vào Base Lead.
- [ ] Thư xác nhận tới.
- [ ] Không có khoá/secret trong mã nguồn trang.
- [ ] `kiem-website.sh` toàn OK.

## 5. Báo cáo cuối (khuôn)

```
✅ Website <tên-miền> — đường A/B · 4 trang · công cụ chẩn đoán <n> câu
📊 Lead → Base Lead ✔ · thư xác nhận ✔
⚠️ Còn: <nội dung khối 7–9 chờ ảnh thật / blog chưa có bài / …>
```


## Hướng dẫn chi tiết và các bẫy đã gặp

(Bản đầy đủ có hình và nút bấm: https://trienkhaiweb.truongminhkien.vn)

Ví dụ sống — đã làm thật, đang chạy thật

Chính [truongminhkien.vn](https://truongminhkien.vn) bạn đang xem — website chuyên gia có công cụ tự chẩn đoán, thu lead qua form nối thẳng vào Lark Base. Còn có **VK Wedding** (website thiệp cưới online) và trang [Thiết Kế Website](https://truongminhkien.vn/thiet-ke-website/) — cùng dựng bằng đúng công thức trong trang này.

## Dùng theo đúng thứ tự này

1Website chuyên gia/cá nhân thu lead

HubSpot Website Grader (10+ triệu lead), Phạm Thành Long (long.vn)

Mở đầu bằng công cụ tự chấm điểm/chẩn đoán (không phải danh mục khoá học ngay từ đầu) — khung 11 khối trang chủ: mở màn → bản đồ vấn đề → gương soi → vì sao là bạn → bằng chứng → 3 bậc sản phẩm → blog → ai không nên mua → FAQ → CTA cuối → chân trang.

"Dựng website chuyên gia cho \[ngành/dịch vụ\] của tôi, mở đầu bằng công cụ chẩn đoán."

2Trang bán hàng thu tiền thật

Phạm Thành Long (13 sale page thắng), Joe Vitale, Alex Hormozi

15 khối copy đầy đủ, có mã QR chuyển khoản động, đơn hàng lưu vào Lark Base, gửi thư xác nhận tự động — dùng cho bán khoá học/vé sự kiện/sản phẩm cụ thể.

"Dựng trang bán hàng cho \[sản phẩm\], giá \[X\], có QR chuyển khoản."

3Website ngành dịch vụ

Ran Segall, Alex Hormozi, Michał Malewicz, Payton Clark Smith

Đủ khối chuyển đổi chuẩn: hero rõ ràng → nỗi đau → offer đóng khung giá trị → khác biệt → bằng chứng → quy trình → đảo ngược rủi ro → FAQ → CTA cuối. Dùng cho doanh nghiệp dịch vụ chưa có website hoặc muốn làm lại.

"Dựng website cho doanh nghiệp dịch vụ \[ngành\], khách hàng \[X\], USP \[Y\]."

## Triển khai thật (không dừng ở lý thuyết)

Website tĩnh (công cụ 1 và 3) — tự chứa 1 file, deploy bằng lệnh thật

Yêu cầu Claude AI viết xong thì tự triển khai bằng đúng 2 lệnh này (không phải mô tả suông):

npx wrangler pages project create ten-du-an-cua-ban\
npx wrangler pages deploy site --project-name=ten-du-an-cua-ban

Gắn tên miền riêng (2 phần, thiếu 1 phần không lên được): **(1)** CNAME tại nơi quản lý DNS của bạn, Đích = `ten-du-an-cua-ban.pages.dev`; **(2)** Cloudflare Dashboard → Workers & Pages → đúng project → tab "Custom domains" → "Set up a custom domain" → nhập tên miền đầy đủ. Chờ vài phút tới vài giờ để DNS lan truyền trước khi kết luận lỗi.

Trang bán hàng thu tiền thật (công cụ 2) — đã có sẵn code thật, không phải viết lại

Gói [website-sale-page.zip](https://trienkhaiweb.truongminhkien.vn/website-sale-page.zip) (mục `.claude/skills/tmk-mkt-sale-page-chuyen-doi-cao`) có sẵn: `mau-trang.html` (trang 15 khối tự chứa, mã QR chuyển khoản động), `scripts/dang-ky.js` (Cloudflare Pages Function ghi đơn vào Lark Base + gửi thư xác nhận qua Resend/Brevo). Đưa link này cho Claude AI: *"Đọc skill tmk-mkt-sale-page-chuyen-doi-cao ở repo trên, dựng cho tôi trang bán \[sản phẩm\], giá \[X\]."* Mọi chỗ đánh dấu `ĐỔI:` trong code là chỗ cần điền thông tin thật của bạn (giá, ngân hàng, tên khoá...) trước khi deploy.

## ⚠ Bẫy đã gặp thật + cách gỡ

1\. Đặt khoá bí mật đúng cách mà vẫn không hoạt động

Nếu dự án có file cấu hình riêng đi kèm khi triển khai, nó có thể âm thầm "đè" và bỏ qua sạch mọi khoá bí mật đã đặt qua giao diện quản trị — không báo lỗi gì, mọi dấu hiệu khác đều trông như đã đúng.

**Cách gỡ:** nếu khoá bí mật vẫn không nhận dù đặt đúng, kiểm tra và xoá file cấu hình dư thừa đó, triển khai lại.

2\. Dán mật khẩu/khoá bí mật bằng Ctrl+V trong cửa sổ dòng lệnh làm sai dữ liệu

Trên Windows, dán bằng Ctrl+V vào cửa sổ dòng lệnh có thể chèn thêm 1 ký tự vô hình vào đầu chuỗi — hệ thống báo "khoá không hợp lệ" dù bạn đã dán đúng.

**Cách gỡ:** dán bằng chuột phải thay vì Ctrl+V; nếu vẫn lỗi, dán qua Notepad trước rồi đưa file vào dòng lệnh.

3\. Menu/mục lục trên website bị rỗng dù đã cấu hình đủ

Menu điều hướng của trang có thể đang trỏ tới 1 mục đã bị xoá — giao diện vẫn hiện bình thường nhưng menu trống trơn, không báo lỗi gì.

**Cách gỡ:** kiểm tra lại đúng mục menu đang tồn tại thật, trỏ lại cho đúng.

4\. Đặt tên màu tuỳ chỉnh nhưng dùng lại tên đó bị sai màu

1 số nền tảng tự động thêm tiền tố vào tên màu bạn đặt (ví dụ đặt "xanh-navy" thì hệ thống tự lưu thành "custom-xanh-navy") — nếu bạn dùng đúng tên gốc đã gõ, màu không lên, nền trong suốt/chữ trắng trên nền trắng.

**Cách gỡ:** luôn kiểm tra lại tên màu THẬT sự được lưu (qua công cụ kiểm tra trang), dùng đúng tên đó thay vì tên đã gõ ban đầu.

5\. Vừa gắn tên miền xong, trang báo lỗi/không lên ngay

Sau khi thêm CNAME + gắn Custom Domain ở Cloudflare Pages, DNS cần thời gian lan truyền — TTL bản ghi thường đặt 5 phút nhưng thực tế có lúc mất tới vài giờ tuỳ nơi. Không phải lỗi cấu hình.

**Cách gỡ:** đợi rồi kiểm tra lại thay vì vội sửa/xoá cấu hình đang đúng.

Bước tiếp theo

Đã có nơi chuyển đổi, sang bước kế tiếp: viết nội dung và video đều đặn để kéo người tới website và mồi câu.

[Sang bước 13: Content & Video →](https://trienkhaicontent.truongminhkien.vn/)