Cách thêm chế độ Dark Mode vào website Wordpress dễ dàng

Bạn có muốn thêm chế độ tối vào trang web WordPress của mình không?

Nhiều thiết bị hiện có hỗ trợ chế độ tối tự nhiên. Việc thêm chế độ tối vào trang web của bạn sẽ tự động điều chỉnh thiết kế của bạn theo sở thích trình duyệt của người dùng. Bạn thậm chí có thể thêm công cụ chuyển đổi chế độ tối vào trang web của mình.

{tocify} $title={Table of content}

Trong bài viết này, tôi sẽ chỉ cho bạn cách dễ dàng thêm chế độ tối vào trang web WordPress của bạn cả giao diện người dùng và khu vực quản trị.


Chế độ tối là gì và tại sao lại thêm nó vào trang web của bạn?

Chế độ tối được sử dụng trên thiết bị di động và máy tính để giảm lượng ánh sáng trắng từ màn hình.

Một số thiết bị có chế độ ban đêm thực sự sử dụng tông màu ấm hơn. Chế độ tối sử dụng một cách tiếp cận khác bằng cách thêm màu tối vào nền.

Nếu bạn có thiết bị iPhone hoặc Android, bạn có thể chuyển sang chế độ tối chỉ bằng cách sử dụng nút gạt.

Ngoài ra, trên máy tính của mình, bạn có thể xem các trang web ở chế độ tối bằng tiện ích mở rộng của Chrome, chẳng hạn như Night Eye. Dưới đây là một ví dụ giao diện tối của một website khi sử dụng tiện ích mở rộng đó:


Thêm chế độ tối vào trang web của bạn cung cấp cho người dùng tùy chọn để bật và tắt chế độ tối trong khi xem trang web của bạn. Nó cũng cho phép bạn kiểm soát nhiều hơn đối với cách trang web của bạn trông như thế nào trong chế độ tối.

Các trang web phổ biến như YouTube cũng cung cấp bảng màu tối. Điều này cho phép người dùng xem video vào ban đêm với trải nghiệm xem thoải mái hơn.


Ngoài việc thêm chế độ tối vào giao diện trang web của bạn, bạn thậm chí có thể thêm chế độ tối cho quản trị viên WordPress của mình. Điều này có thể hữu ích nếu bạn làm việc trên trang web của mình vào buổi tối hoặc ban đêm.

Đầu tiên, chúng ta sẽ xem xét thêm chế độ tối vào trang web WordPress của bạn . Sau đó, chúng tôi sẽ đề cập đến việc thêm chế độ tối vào bảng điều khiển quản trị WordPress của bạn.

Mẹo: Bạn có muốn một trang web có bảng màu tối, ngay cả khi thiết bị của người dùng ở chế độ bình thường hoặc ban ngày? Bạn nên tìm một số giao diện tối được hỗ trợ tốt nhé.

Thêm Chế độ tối vào trang web WordPress của bạn

Đầu tiên, bạn cần cài đặt và kích hoạt plugin WP Dark Mode . Để biết thêm chi tiết, hãy xem hướng dẫn từng bước của chúng tôi về cách cài đặt plugin WordPress .

Sau khi kích hoạt, hãy chuyển đến trang Cài đặt »WP Dark Mode trong quản trị viên WordPress của bạn và nhấp vào tab Cài đặt chung. Bạn sẽ được chuyển hướng tự động đến đó.

Tại đây, cài đặt 'Bật Chế độ tối nhận biết hệ điều hành' đã được bật cho bạn. Điều này có nghĩa là khách truy cập sẽ tự động nhìn thấy phiên bản chế độ tối của trang web của bạn khi thiết bị của họ được đặt ở chế độ tối.

Cài đặt 'Hiển thị công tắc nổi' cũng đã được bật. Điều này có nghĩa là người dùng có thể chuyển chế độ xem trang web của họ sang chế độ tối bất kỳ lúc nào, ngay cả khi họ chưa bật tùy chọn Chế độ tối trên thiết bị của mình.


Chỉ cần truy cập trang web của bạn và bạn sẽ thấy nút chuyển ở góc dưới cùng bên phải. Nhấp vào nó để chuyển ngay trang web của bạn sang chế độ tối trên thiết bị của bạn:


Có nhiều tùy chọn tùy chỉnh hơn có sẵn trên trang Cài đặt »WP Dark Mode . Tuy nhiên, những điều này khá hạn chế với plugin miễn phí.

Ví dụ: bạn chỉ cần nhấp vào tab Cài đặt hiển thị để thay đổi kiểu của công tắc nổi:


Bạn cũng có thể tùy chỉnh màu chế độ tối bằng cách sử dụng tab Cài đặt kiểu:


Đảm bảo rằng bạn nhấp vào nút Lưu Cài đặt sau khi thực hiện bất kỳ thay đổi nào.

Lưu ý: Với phiên bản miễn phí của WP Dark Mode, bạn chỉ nhận được 2 kiểu chuyển đổi nổi đầu tiên và 2 cài đặt trước màu đầu tiên để lựa chọn.

Phiên bản pro của WP Dark Mode cung cấp nhiều tùy chọn thiết kế hơn, ngoài ra còn có khả năng bật chế độ tối vào những thời điểm cụ thể và tùy chọn thêm mã CSS tùy chỉnh.

Thêm Chế độ tối cho quản trị viên WordPress của bạn

WordPress đi kèm với các lược đồ màu quản trị, nhưng không có lược đồ màu mặc định nào làm giảm ánh sáng trắng phát ra từ màn hình của bạn. May mắn thay, plugin này cũng giải quyết được vấn đề đó.

Hãy cùng xem cách dễ dàng thêm chế độ tối vào khu vực quản trị viên WordPress của bạn để có trải nghiệm người dùng thú vị hơn trong những giờ làm việc muộn.

Chỉ cần truy cập trang Cài đặt »WP Dark Mode và nhấp vào tab Cài đặt chung. Sau đó, chuyển công tắc 'Bật chế độ tối phụ trợ' sang vị trí bật. Đừng quên nhấp vào nút Lưu Cài đặt ở cuối trang:


Bây giờ, bạn sẽ thấy một nút chuyển mới ở thanh trên cùng của khu vực quản trị của bạn:


Chỉ cần nhấp vào công tắc này để chuyển ngay khu vực quản trị của bạn sang chế độ tối.

Mẹo: Nếu trang web của bạn có nhiều người dùng WordPress , mỗi người có thể bật và tắt chế độ tối tùy thích.

Vì 'Chế độ tối' không phải là một bảng màu quản trị, bạn có thể dễ dàng sử dụng nó cùng với một bảng màu quản trị WordPress hiện có. Để thiết lập điều này, chỉ cần đi tới Người dùng »Hồ sơ và nhấp vào một tùy chọn trong Bảng màu dành cho quản trị viên.

Lưu ý rằng bạn sẽ cần tắt chế độ tối để xem các tùy chọn phối màu quản trị:


Khi viết một bài đăng trong trình chỉnh sửa khối WordPress , bạn cũng có thể bật chế độ tối. Nhấp vào biểu tượng màu nhỏ ở trên cùng bên trái, sau đó chọn chế độ bạn muốn sử dụng:


Giờ đây, bạn có thể thoải mái viết và làm việc trên trang web của mình vào ban đêm mà không phải căng mắt. Chúc các bạn thành công.
Nguyễn Hoàng

Thích viết, thích chia sẻ những gì mình biết. Mặc dù viết không hay. Nên không quan tâm người ta có thích đọc không? :D

Đăng nhận xét

Mới hơn Cũ hơn