Bật dark mode cho giao diện chọn mã nhúng trong Init Embed Posts
Giao diện chọn mã nhúng (modal) của Init Embed Posts hỗ trợ dark mode – giúp đồng bộ với các trang quản trị đang dùng giao diện nền tối.
Plugin tự động nhận diện dark mode nếu bạn đã cấu hình sẵn theme bằng JavaScript. Nếu chưa, bạn có thể kích hoạt dark mode như sau:
1. Cấu hình trước khi plugin khởi chạy
Thêm đoạn sau vào <head> hoặc ngay trước khi nhúng JavaScript chính của plugin:
window.InitPluginSuiteEmbedPostsConfig = {
theme: 'dark'
};
Giá trị theme hỗ trợ các tuỳ chọn:
'light': Luôn dùng giao diện sáng'dark': Luôn dùng giao diện tối'auto': Tự phát hiện theo theme hệ thống của người dùng
Ví dụ tự bật dark mode nếu website đang dùng class uk-light:
document.addEventListener('DOMContentLoaded', function () {
if (document.body.classList.contains('uk-light')) {
window.InitPluginSuiteEmbedPostsConfig = {
theme: 'dark'
};
}
});
2. Dark mode áp dụng ở đâu?
- Modal chọn mã nhúng (hiện khi click “Nhúng”)
- Icon trong trang quản trị (nếu bạn tích hợp icon hoặc UI của plugin vào block editor hoặc trang cài đặt)
Lưu ý
- Plugin sẽ tự động thêm class
iep-darkvào modal nếu theme là'dark'hoặc'auto'và phát hiện nền tối. - Bạn có thể tùy biến CSS của modal qua class
.iep-darknếu cần điều chỉnh thêm về màu sắc.
Bình luận