Hướng dẫn chỉnh sửa website tại /guide/. Nội dung tự động đồng bộ từ theme khi admin đăng nhập WP hoặc upload code mới — không cần sửa tay page này (chỉnh trong inc/guide-page.php nếu là dev).
Rebuild homepage — toàn bộ section trang chủ thành shortcode (hero → testimonials → community).
Update Guide now — đồng bộ lại trang hướng dẫn từ theme.
Restore DB content backup — khôi phục nội dung editor trước migration.
2. Trang chủ (Homepage)
Trang chủ = page tại Settings → Reading → Homepage. Sửa trong Pages → [homepage] → Edit. Block động = block Shortcode (dán cả chuỗi kèm tham số vào một dòng).
2a.
— Video banner
Ảnh poster hiện trước khi video chạy. Video: video_url (khuyên dùng) hoặc video_id + video_version (Cloudinary).
Tham số
Ý nghĩa
Mặc định
aria_label
Nhãn accessibility
Art studio
poster
Ảnh chờ video — assets/images/ hoặc URL
hero2.jpg
video_url
URL .mp4 đầy đủ
(trống)
video_id
Public ID Cloudinary
Banner_tmdhl6
video_version
Version Cloudinary
v1780352977
video_width
Max width (px)
1920
cloudinary_folder
Ghi chú folder
video
autoplay, muted, loop, playsinline
1 hoặc 0
1
preload
auto | metadata | none
auto
video_id / video_version: từ URL Cloudinary .../v1780352977/Banner_tmdhl6.mp4.
Danh sách khóa học trên trang chủ — mỗi dòng link tới /courses/#anchor. Dữ liệu từ data/{source}.php — mỗi item: num, title, anchor.
Tham số
Ý nghĩa
Mặc định
source
File data
home-programs
label
Nhãn nhỏ (Our courses)
(từ data)
heading
Tiêu đề section
(từ data)
courses_page
Page key cho link
courses
footer_label
Link dưới cùng
Explore all courses
aria_label
Nhãn accessibility
Structured programs
[ath_home_programs source="home-programs" label="Our courses" heading="Structured programs for every stage of your artistic journey in Hanoi." courses_page="courses" footer_label="Explore all courses" aria_label="Structured programs"]
2e.
150+ artists from 40+ countries have studied at Art Tutor Hanoi.
Carousel học viên (Posts category Learner’s artworks) — PHP động, sắp xếp theo comment mới nhất. Dòng thống kê từ data/home-community.php hoặc tham số stat (hai dòng cách nhau bằng |).
Tham số
Ý nghĩa
Mặc định
source
File data
home-community
stat
Text thống kê (dòng1|dòng2)
(từ data)
limit
Số thẻ carousel
6
always_visible
1 = luôn mở (homepage)
1
footer_label
Link dưới carousel
View all
view_all_page
Page key hub artworks
students-artworks
aria_label
Nhãn accessibility
Artist community
Thêm học viên vào carousel: Posts → Add New → category Learner’s artworks → Featured image + publish. Không sửa file data.
[ath_home_community source="home-community" stat="150+ artists from 40+ countries|have studied at Art Tutor Hanoi." limit="6" always_visible="1" footer_label="View all" view_all_page="students-artworks" toggle_show="View Community" toggle_hide="Hide Community" panel_id="community-panel" toggle_id="community-toggle" aria_label="Artist community"]
2f.
Testimonials
What our students say
Perfect! In three days I learned a lot about sketching. The whole team is extraordinary. I recommend it to everyone and I hope to come back soon to Hanoi and Art Tutor Hanoi!
Marc Dunand-Roux (France)
Our teacher Giang was jovial and fun! Spoke good English and tried her best to keep my 4-year-old engaged and experimenting with different mediums.
Nicholas Teoh (Singapore)
My family gifted me a series of 3 Vietnamese silk painting classes at Art Tutor Hanoi, and it was a completely new experience for me...
Claire Helouet (France)
We loved it! We were a family of 7 with four kids, including one with a disability. The staff did an amazing job making art doable for everyone with extra care and kindness. A total highlight of our trip!
Joey & Jasmine Tell (USA)
Spent two weeks here for a tailored watercolor course (44h in total). They made sure it was the real deal – not just another YouTube-surface-lesson. The perfect place to take your art to the next level!
Theo Coppen (Sweden)
— Testimonials slider
Slider đánh giá + ảnh bên phải. Nội dung từ data/{source}.php — mỗi slide: text, author. JS slider dùng track_id / dots_id (mặc định testimonials-track).
Tham số
Ý nghĩa
Mặc định
source
File data
home-testimonials
label
Nhãn nhỏ
Testimonials
heading
Tiêu đề
What our students say
photo
Ảnh — assets/images/ hoặc URL
gallery/HTT_1707.jpg
photo_alt
Alt ảnh
(từ data)
aria_label
Nhãn accessibility
Testimonials
[ath_home_testimonials source="home-testimonials" label="Testimonials" heading="What our students say" photo="gallery/HTT_1707.jpg" photo_alt="Students at an art exhibition" track_id="testimonials-track" dots_id="testimonials-dots" prev_label="Previous review" next_label="Next review" aria_label="Testimonials"]
3. — Nút chuẩn (dùng mọi trang)
Nút teal giống thẻ trang chủ (.btn-view). Dùng block Shortcode trong bất kỳ page Gutenberg nào — thay cho nút mặc định của editor.
Book, Weekly calendar, Thank you, Links, Students’ Artworks hub
/courses/{slug}/, /workshops/{slug}/ — Pages con (template Course / Workshop), chỉnh Gutenberg sau migration
/kids-courses/{slug}/ — file data/*.php
7. Fluent Form #40 — Adult Booking (Date & time slots)
Form đặt chỗ người lớn nhúng tại /book/?tab=adult. Quy tắc Date và Preferred time slots nằm trong Custom Javascript của form — không sửa trong theme trừ VietQR (mục 7d).
Mở editor: WP Admin → Fluent Forms → All Forms → Adult Booking (ID 40) → tab Settings & Integrations → Custom CSS/JS → ô Custom Javascript → Save Form.
7a. Tên field (phải khớp trong JS)
Field trên form
Name attribute
Loại
Program
dropdown
Dropdown
Workshop
dropdown_1
Dropdown (conditional)
Date
datetime
Date/time (flatpickr)
Preferred time slot
time_slots
Radio — một lựa chọn; Value từng option phải khớp JS
Number of participants
item-quantity
Item Quantity
7b. Quy tắc Date (calendar)
Điều kiện
Date picker
Program = Art Residency
Mọi ngày đều chọn được
Program khác Art Residency
Thứ 5 bị mờ — không chọn
Workshop = Nude model drawing
Chỉ thứ 7 (Saturday)
Trong JS: getDay() === 2 = thứ 3, getDay() === 4 = thứ 5 (Date), getDay() === 6 = thứ 7 (0 = Chủ nhật).
7c. Quy tắc time slots
Slot (Value trên form)
Chỉ chọn khi
13;30 – 16:00
Workshop = Nude model drawing (lưu ý dấu ; trong form hiện tại)
18:30 – 20:30
Date đã chọn là thứ 3
Các slot khác
Bình thường (trừ khi bị rule Nude model khóa)
Đổi Date sang ngày không phải thứ 3 → slot 18:30 tự bỏ chọn và mờ. Đổi Workshop khỏi Nude model → các slot khác mở lại.
7d. Sửa rule — chỉnh biến đầu Custom Javascript
Sau khi đổi label/value option trong form editor, cập nhật các hằng số ở đầu file JS (phải trùng Value của option, không chỉ label hiển thị):
var RESIDENCY = 'Art Residency';
var NUDE_MODEL = 'Nude model drawing';
var NUDE_SLOT = '13;30 u2013 16:00';
var TUESDAY_SLOT = '18:30 u2013 20:30';
Thêm rule Date mới — sửa getDisableRules() và isDateAllowed().
Thêm rule slot mới — thêm biến var MY_SLOT = '...'; và nhánh trong isSlotAllowed().
Đổi tên field — tìm select[name="dropdown"], dropdown_1, datetime, input[name="time_slots"] trong JS và đổi cho khớp Name Attribute.
Sửa label slot trong form — mở Radio Time slots → từng option → copy cột Value → dán vào JS (ký tự en-dash – phải giống hệt; có thể dùng u2013 trong chuỗi JS).
Test — Preview form: thử từng Program/Workshop, chọn Date, chọn một slot; mở DevTools Console nếu có lỗi JS.
7e. Thanh toán & VietQR (tham khảo)
Giá — Calc Value trên Program / Courses / Duration; Custom Payment Amount công thức (Program + Courses + Duration); Item Quantity map payment_input.
VietQR — theme config/fluent-qr.php (form 40, tỉ giá USD→VND 26 500). Custom HTML cần #qr_amount và #qr_img.
Form ID tab Adult — mặc định 40 (ATH_ADULT_BOOKING_FORM_ID trong config/book-tabs.php).
