Giao diện website bị vỡ sau khi cập nhật — chữ chồng lên nhau, mất bố cục, lệch màu — thường khiến chủ web hốt hoảng tưởng hỏng nặng. Nhưng nguyên nhân số một lại đơn giản: cache cũ còn giữ giao diện trước. Bài này đi từ việc dễ nhất tới rollback.
1. Xoá mọi tầng cache (làm trước tiên)
Sau khi cập nhật, các tầng cache có thể vẫn phục vụ file CSS/JS cũ khiến giao diện vỡ. Xoá lần lượt:
- Trình duyệt: tải lại cứng bằng
Ctrl+Shift+R. - Plugin cache trên web (LiteSpeed, WP Rocket…): bấm xoá toàn bộ.
- CDN / Cloudflare: xoá cache ở đây — đây là bước hay bị quên nhất. Cloudflare có thể giữ file ở một địa chỉ cố định nên khách vẫn thấy bản cũ dù bạn đã sửa.
Rất nhiều ca “giao diện vỡ” biến mất chỉ sau khi xoá đủ các tầng cache này.
2. Tạo lại file CSS của trình dựng trang
Nếu dùng trình dựng trang (page builder) như Elementor, vào Công cụ → Tạo lại CSS & dữ liệu (Regenerate CSS). Một số bản cập nhật từng có lỗi tự xoá file CSS — tạo lại là khắc phục.
3. Khoanh vùng xung đột
- Đổi tạm về theme mặc định để xem giao diện có trở lại không — nếu có, lỗi do theme.
- Tắt plugin từng cái để tìm cái gây xung đột sau cập nhật.
4. Quay lại bản trước (rollback) nếu do bản cập nhật lỗi
Nếu xác định một bản cập nhật plugin/theme gây vỡ, hãy quay lại bản trước đó (dùng plugin hỗ trợ rollback hoặc khôi phục từ sao lưu). Sau khi rollback, nhớ xoá lại toàn bộ cache rồi mới kiểm tra.
Vì sao xoá cache trình duyệt vẫn chưa đủ
Một website thường có nhiều tầng cache xếp chồng: trình duyệt của khách, plugin cache trên web, cache ở máy chủ (như LiteSpeed), và CDN/Cloudflare ngoài cùng. Khi bạn cập nhật, mỗi tầng có thể vẫn giữ file CSS/JS cũ. Bạn xoá cache trình duyệt của mình thì chỉ máy bạn thấy bản mới — khách vẫn nhận bản cũ từ CDN. Đó là lý do phải xoá đủ mọi tầng, đặc biệt là CDN, mới chắc chắn ai cũng thấy giao diện đúng. Cloudflare hay giữ file ở một địa chỉ cố định nên rất dễ “kẹt” bản cũ.
Sai lầm cần tránh
Đừng vội kết luận “theme hỏng” khi thực ra chỉ là cache; và đừng sửa trực tiếp file theme gốc (sẽ mất khi cập nhật lần sau) — nếu cần tuỳ chỉnh, dùng theme con (child theme). Test cập nhật ở môi trường thử trước là cách phòng tốt nhất. Cần người xử nhanh, xem dịch vụ sửa chữa website.
Theme con — vì sao quan trọng
Nhiều ca “giao diện vỡ sau cập nhật” thực ra do trước đó ai đó sửa thẳng vào file của theme gốc. Khi theme cập nhật, mọi chỉnh sửa đó bị ghi đè, giao diện trở về mặc định hoặc lệch hẳn. Giải pháp gốc là dùng theme con (child theme): một theme nhỏ “thừa kế” theme gốc, nơi bạn để mọi tuỳ chỉnh. Theme gốc cập nhật bao nhiêu lần, tuỳ chỉnh trong theme con vẫn còn nguyên.
Nếu web bạn đang sửa trực tiếp theme gốc, đây là lúc nên chuyển sang theme con — vừa tránh vỡ giao diện mỗi lần cập nhật, vừa giữ được bản vá bảo mật từ theme gốc. Đây là một trong những thói quen giúp web “lành” lâu dài, thay vì cứ cập nhật là nơm nớp.
Câu hỏi thường gặp
Vì sao tôi sửa rồi mà khách vẫn thấy giao diện vỡ?
Gần như chắc chắn do CDN/Cloudflare còn giữ bản cũ. Hãy xoá cache ở tầng CDN, không chỉ trình duyệt của bạn.
Có nên tắt tự động cập nhật để tránh vỡ giao diện?
Không nên tắt hẳn (mất bản vá bảo mật). Tốt hơn là test cập nhật ở môi trường thử và sao lưu trước khi cập nhật.