Whenever Atelier

Hướng dẫn sửa nội dung trang Event

Từng bước, có ảnh minh hoạ. Không cần biết code: mọi chữ, ảnh, ngày giờ và nút bấm trên trang Event đều sửa trực tiếp trong Shopify.

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.

Trang Online Store, danh sách theme, nút Edit theme của theme New 0211
  1. Ở 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:

Menu chọn trang ở thanh trên cùng, mục Pages, chọn event
  1. Bấm vào ô tên trang ở giữa thanh trên cùng (lúc đầu ghi Home page).
  2. Chọn Pages.
  3. 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).

Màn hình chỉnh sửa trang Event: danh sách khu vực, nút xem trên điện thoại, Save và Publish
  1. 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.
    Bấm vào tên một khu vực để mở ô sửa của khu vực đó. Bấm mũi tên nhỏ bên trái tên để xem các mục con bên trong (ví dụ từng sự kiện).
  2. 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.
  3. Save: bấm sau khi sửa xong để lưu. Chưa bấm Save thì thay đổi chưa được lưu.
  4. 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.

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

Cài đặt chung của Upcoming Events: tiêu đề, đoạn giới thiệu, số thẻ mỗi hàng, hình dạng ảnh
  1. Heading: tiêu đề khu vực ("Upcoming Events").
  2. Intro: đoạn giới thiệu ngắn dưới tiêu đề.
  3. 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.
  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

Danh sách các thẻ sự kiện, nút Add Event và ô Coming soon
  1. 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.
  2. 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ẻ).
  3. 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.

Ô sửa một thẻ sự kiện: ảnh, kiểu ảnh poster, màu nền, chữ trên poster, tên sự kiện
  1. Thẻ đang sửa được tô xanh trong danh sách, và có khung xanh ở bản xem trước.
  2. Image: ảnh của sự kiện (poster hoặc ảnh chụp). Bấm vào ảnh để đổi.
  3. 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).
  4. Poster colour (màu nền) và Poster text colour (màu chữ). Chỉ dùng cho kiểu Poster.
  5. 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".
  6. Title: tên sự kiện (chữ in đậm dưới ảnh).

Kéo ô bên phải xuống tiếp:

Ô sửa: địa điểm, ngày ngắn, mô tả, địa chỉ, link bản đồ
  1. Place: tên địa điểm ngắn, hiện dưới tên sự kiện (ví dụ "Melrose Pop-up").
  2. Short date: ngày viết ngắn, hiện bên phải địa điểm (ví dụ "Oct 17–18").
  3. Description: đoạn mô tả sự kiện.
  4. Where: địa chỉ. Khách bấm vào địa chỉ sẽ mở Google Maps tự động.
  5. Address link: không bắt buộc. Chỉ điền khi muốn dùng link bản đồ riêng.
Ô sửa: ngày, giờ, chữ trên nút, link của nút, xoá thẻ
  1. When: ngày diễn ra, viết đầy đủ (ví dụ "October 17 – October 18, 2026").
  2. Time: giờ mở cửa (ví dụ "10:00 AM – 7:00 PM").
  3. Button label: chữ trên nút. Để trống thì không có nút.
  4. 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).
  5. 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

Past Events: nút thêm sự kiện, danh sách, tiêu đề, hình dạng ảnh
  1. Add Past event: thêm một sự kiện đã qua.
  2. Danh sách: đổi thứ tự, ẩn, xoá giống như ở mục 5.2.
  3. Heading: tiêu đề khu vực ("Past Events").
  4. 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

Ô sửa sự kiện đã qua: ảnh, link YouTube, vị trí cắt ảnh, tên, địa điểm, ngày
  1. Image: ảnh của sự kiện. Bấm Select để chọn hoặc tải ảnh lên.
  2. 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.
  3. Image crop: giữ phần trên / giữa / dưới của ảnh khi ảnh bị cắt cho vừa khung.
  4. Title: tên sự kiện.
  5. Place: địa điểm.
  6. Date: ngày (ví dụ "October 17–18, 2026").
Ô sửa: nhãn, mô tả, chữ trên nút, link
  1. Tags: các nhãn nhỏ, cách nhau bằng dấu phẩy (ví dụ "Pop-up, Film").
  2. Description: đoạn mô tả.
  3. Button label: chữ trên nút (ví dụ "Watch the film").
  4. 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)

Ô sửa form đăng ký: tiêu đề, mô tả, tên sự kiện trong email, khung giờ, chữ trên nút
  1. Heading: tiêu đề form (thường là tên sự kiện sắp tới).
  2. Text: đoạn mô tả bên trái form.
  3. 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ư.
  4. 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ờ.
  5. 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)

Ô sửa banner cuối trang: chọn banner, ảnh, tiêu đề, chữ trên nút
  1. 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.
  2. Image: ảnh của banner (có thể chọn thêm Video ngay dưới).
  3. Heading: chữ lớn trên banner.
  4. 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.