Cách đọc ảnh: ô khung đỏ có số là chỗ cần bấm hoặc cần sửa. Số trong ảnh khớp với số trong danh sách ngay dưới ảnh. Bấm vào ảnh để xem ảnh to.
1Mở trình chỉnh sửa giao diện
Đăng nhập Shopify Admin, ở menu bên trái bấm Online Store. Trang này liệt kê các theme của cửa hàng.
- Ở theme New 0211 (theme đang có trang Event mới), bấm Edit theme.
Khi theme New 0211 đã được đưa lên làm theme chính, nó sẽ nằm ở ô lớn phía trên. Lúc đó bấm Edit theme ở ô lớn. Các bước còn lại giống hệt.
2Chọn trang Event
Trình chỉnh sửa mở trang chủ trước. Chuyển sang trang Event như sau:
- Bấm vào ô tên trang ở giữa thanh trên cùng (lúc đầu ghi Home page).
- Chọn Pages.
- Chọn event. Màn hình giữa sẽ hiện trang Event.
3Làm quen màn hình chỉnh sửa
Bên trái là danh sách các khu vực của trang, ở giữa là bản xem trước, bên phải là ô để sửa (hiện ra khi bấm vào một khu vực).
- Các khu vực của trang, xếp theo thứ tự từ trên xuống dưới giống trên web:
- WA Event Hero: banner ảnh lớn đầu trang.
- WA Upcoming Events: các sự kiện sắp tới.
- WA Past Events: các sự kiện đã qua.
- WA Event RSVP: form đăng ký tham dự.
- WA Campaign Duo: hai banner ảnh cuối trang.
- Xem trên điện thoại: bấm để xem trang ở khổ điện thoại, bấm lần nữa để quay lại khổ máy tính.
- Save: bấm sau khi sửa xong để lưu. Chưa bấm Save thì thay đổi chưa được lưu.
- Publish: đưa cả theme này lên làm giao diện chính của web. Chỉ bấm khi đã thống nhất muốn đưa lên web thật. Sửa nội dung bình thường thì chỉ cần Save.
4Banner đầu trang (WA Event Hero)
Đổi ảnh / video
- Bấm WA Event Hero ở danh sách bên trái.
- Image: ảnh banner. Bấm vào ảnh để đổi ảnh khác (chọn ảnh có sẵn hoặc tải ảnh mới lên). Nên dùng ảnh ngang, rộng từ 1920px.
- Video: không bắt buộc. Có video thì video tự chạy (không tiếng) thay cho ảnh.
- Mobile image: ảnh riêng cho điện thoại, không bắt buộc. Để trống thì điện thoại dùng ảnh ở trên.
- Image crop: chọn phần ảnh muốn giữ khi ảnh bị cắt cho vừa khung: Keep the top (giữ phía trên), Keep the centre (giữa), Keep the bottom (dưới).
Đổi chữ trên banner
Kéo ô bên phải xuống phần Text:
- Heading: tiêu đề lớn trên banner (đang là "Our Community").
- Text: dòng chữ nhỏ dưới tiêu đề, một hai câu ngắn.
- Button label: chữ trên nút. Để trống thì không có nút. Có nút thì điền thêm đường dẫn ở ô Button link ngay dưới.
Kéo xuống thêm còn có: chiều cao banner (Small / Medium / Large), vị trí chữ (dưới trái / dưới giữa) và độ tối phủ lên ảnh để chữ dễ đọc.
5Sự kiện sắp tới (WA Upcoming Events)
Khu vực này có phần cài đặt chung (tiêu đề, số thẻ mỗi hàng…) và từng thẻ sự kiện bên trong.
5.1 Cài đặt chung
- Heading: tiêu đề khu vực ("Upcoming Events").
- Intro: đoạn giới thiệu ngắn dưới tiêu đề.
- Cards per row on computer: số thẻ trên một hàng ở máy tính (2, 3 hoặc 4). Hiện đang là 4.
- Photo shape: hình dạng khung ảnh của các thẻ (dọc 2:3, dọc 4:5, vuông, ngang 3:2, hoặc giữ nguyên hình gốc).
5.2 Thêm, xoá, đổi thứ tự sự kiện
- Add Event: thêm một thẻ sự kiện mới (tối đa 12 thẻ). Thẻ mới hiện ở cuối, bấm vào nó để điền nội dung.
- Danh sách thẻ, mỗi dòng là một sự kiện, theo đúng thứ tự trên web:
- Đổi thứ tự: rê chuột vào dòng, giữ biểu tượng 6 chấm ở đầu dòng rồi kéo lên hoặc xuống.
- Tạm ẩn: rê chuột vào dòng, bấm biểu tượng con mắt. Bấm lại để hiện.
- Xoá: rê chuột vào dòng, bấm biểu tượng thùng rác (hoặc nút Remove block ở cuối ô sửa của thẻ).
- Coming soon tile: ô "More cities coming soon" tự hiện để lấp chỗ trống khi số sự kiện ít hơn số thẻ mỗi hàng (ví dụ 1 sự kiện mà mỗi hàng 4 thẻ). Đủ 4 sự kiện thì ô này tự ẩn. Chữ, nút và màu của ô này sửa ngay ở đây.
Thẻ Whenever Tour · Stop 02 / 03 / 04 hiện đang là nội dung tạm. Khi có lịch sự kiện thật, bấm vào từng thẻ và thay ảnh, chữ, ngày giờ theo hướng dẫn 5.3.
5.3 Sửa một thẻ sự kiện
Bấm vào tên thẻ trong danh sách (ví dụ Event – From Vietnam to Melrose). Ô sửa bên phải có các phần sau.
- Thẻ đang sửa được tô xanh trong danh sách, và có khung xanh ở bản xem trước.
- Image: ảnh của sự kiện (poster hoặc ảnh chụp). Bấm vào ảnh để đổi.
- Image style: kiểu hiển thị ảnh:
- Fill the frame: ảnh phủ kín khung (hợp với ảnh chụp).
- Poster: whole image on a colour: ảnh hiện nguyên, đặt trên nền màu, có dòng chữ bên dưới (như 4 thẻ hiện tại).
- Poster colour (màu nền) và Poster text colour (màu chữ). Chỉ dùng cho kiểu Poster.
- Poster text: chữ nằm dưới ảnh trên nền màu. Mỗi dòng gõ một dòng, ví dụ dòng 1 "Los Angeles, USA", dòng 2 "Oct 17–18".
- Title: tên sự kiện (chữ in đậm dưới ảnh).
Kéo ô bên phải xuống tiếp:
- Place: tên địa điểm ngắn, hiện dưới tên sự kiện (ví dụ "Melrose Pop-up").
- Short date: ngày viết ngắn, hiện bên phải địa điểm (ví dụ "Oct 17–18").
- Description: đoạn mô tả sự kiện.
- Where: địa chỉ. Khách bấm vào địa chỉ sẽ mở Google Maps tự động.
- Address link: không bắt buộc. Chỉ điền khi muốn dùng link bản đồ riêng.
- When: ngày diễn ra, viết đầy đủ (ví dụ "October 17 – October 18, 2026").
- Time: giờ mở cửa (ví dụ "10:00 AM – 7:00 PM").
- Button label: chữ trên nút. Để trống thì không có nút.
- Button link: nút dẫn tới đâu. Để trống thì khi bấm nút, trang tự cuộn xuống form đăng ký (mục 7).
- Remove block: xoá hẳn thẻ này.
Ô nào để trống thì dòng đó không hiện trên web (ví dụ không có giờ thì bỏ trống Time).
6Sự kiện đã qua (WA Past Events)
Mỗi sự kiện đã qua là một hàng: ảnh một bên, chữ một bên, các hàng đổi bên xen kẽ.
6.1 Cài đặt chung và danh sách
- Add Past event: thêm một sự kiện đã qua.
- Danh sách: đổi thứ tự, ẩn, xoá giống như ở mục 5.2.
- Heading: tiêu đề khu vực ("Past Events").
- Photo shape: hình dạng khung ảnh. Đang dùng Widescreen 16:9 để ảnh bìa video không bị cắt chữ. First photo on ngay dưới chọn hàng đầu tiên để ảnh bên trái hay bên phải.
6.2 Sửa một sự kiện đã qua
- Image: ảnh của sự kiện. Bấm Select để chọn hoặc tải ảnh lên.
- YouTube video: dán link video YouTube. Nếu không chọn ảnh, web tự lấy ảnh bìa của video, và khách bấm vào sẽ mở video. Đã chọn ảnh thì ảnh được ưu tiên hiện.
- Image crop: giữ phần trên / giữa / dưới của ảnh khi ảnh bị cắt cho vừa khung.
- Title: tên sự kiện.
- Place: địa điểm.
- Date: ngày (ví dụ "October 17–18, 2026").
- Tags: các nhãn nhỏ, cách nhau bằng dấu phẩy (ví dụ "Pop-up, Film").
- Description: đoạn mô tả.
- Button label: chữ trên nút (ví dụ "Watch the film").
- Link: nút và ảnh dẫn tới đâu (một trang, bài viết hoặc video). Với sự kiện có link YouTube thì để trống cũng được, nút tự mở video.
7Form đăng ký tham dự (WA Event RSVP)
- Heading: tiêu đề form (thường là tên sự kiện sắp tới).
- Text: đoạn mô tả bên trái form.
- Event name in the email: tên sự kiện ghi trong tiêu đề email báo có người đăng ký, để dễ lọc thư.
- Time slots: các khung giờ cho khách chọn, mỗi dòng một lựa chọn. Để trống thì form không có ô chọn giờ.
- Button label: chữ trên nút gửi.
Thông tin khách đăng ký được gửi về email của cửa hàng (email cài trong Shopify Settings), tiêu đề thư có dạng "RSVP — tên sự kiện".
8Hai banner cuối trang (WA Campaign Duo)
- Bấm mũi tên cạnh WA Campaign Duo để thấy 2 banner (Panel), bấm vào banner muốn sửa. Khu vực này có tối đa 2 banner.
- Image: ảnh của banner (có thể chọn thêm Video ngay dưới).
- Heading: chữ lớn trên banner.
- Button label: chữ trên nút. Kéo xuống ô Link để chọn trang mà banner dẫn tới.
9Mẹo và lưu ý
Luôn bấm Save
Sửa xong bấm Save ở góc phải trên cùng. Sau đó mở trang Event trên web và tải lại trang để xem.
Lỡ sửa sai
Bấm mũi tên quay lại trên thanh trên cùng (bên trái nút Publish) để hoàn tác từng bước. Hoặc thoát mà không bấm Save thì mọi thay đổi chưa lưu bị bỏ.
Ảnh đẹp, web nhanh
Ảnh ngang rộng khoảng 1920–2400px là đủ nét. Không cần tải ảnh gốc hàng chục MB.
Chữ ngắn gọn
Tên sự kiện, địa điểm, ngày nên ngắn để thẻ gọn và thẳng hàng. Mô tả 1–3 câu là vừa.
Xem trên điện thoại
Trước khi Save, bấm biểu tượng điện thoại trên thanh trên cùng để chắc mọi thứ hiển thị ổn trên điện thoại.
Sự kiện đã diễn ra
Sau khi sự kiện kết thúc: xoá (hoặc ẩn) thẻ ở mục Sự kiện sắp tới, rồi thêm một hàng mới ở mục Sự kiện đã qua.
Không bấm Publish nếu chỉ muốn sửa nội dung. Publish là đổi giao diện chính của cả website.