Thêm hoặc chỉnh sửa màu sắc trong Block Editor

Thêm hoặc chỉnh sửa màu sắc mặc định trong Block Editor một cách đơn giản.

Không biết vì lý do gì mà kể từ phiên bản 6.0, WordPress đã loại bỏ tính năng cho phép lựa chọn màu sắc tùy chỉnh trong Block Editor. Cộng thêm với việc plugin Advanced Editor Tools (tên gọi cũ là TinyMCE Advanced) đã hơn 2 năm không được cập nhật, khiến cho người dùng không thể lựa chọn được màu sắc theo ý thích trong trình soạn thảo (ngoại trừ các màu đã được theme thiết lập sẵn và sẽ bị thay đổi tùy theo theme). Thật may mắn khi MotoPress đã đưa ra một giải pháp hoàn toàn miễn phí giúp giải quyết khó khăn này. Nó có tên là Block Editor Colors.

Tham khảo thêm:

• Chuyển từ Classic Editor sang Block Editor (Gutenberg)
• Gỡ bỏ Gutenberg stylesheet khỏi website WordPress

Tại sao bạn nên chọn Block Editor Colors?

• Hoàn toàn miễn phí, tất nhiên rồi.
• Cho phép thêm cả màu mới theo nhu cầu, lẫn tùy chỉnh các màu sắc mặc định của theme.
• Hỗ trợ màu sắc cho gần như mọi thành phần trong Block Editor: màu văn bản, màu nền văn bản, màu nền block, màu văn bản trong block, màu các nút bấm…

Thêm hoặc chỉnh sửa màu sắc mặc định với Block Editor Colors

1. Đầu tiên, các bạn phải cài đặt và kích hoạt plugin Block Editor Colors (download).

2. Truy cập Settings => Editor Colors. Tại đây, các bạn sẽ nhìn thấy giao diện như sau:

Trong đó, hãy chú ý 2 mục:

• Custom Colors: cho phép các bạn tạo thêm màu sắc theo ý thích. Hãy chọn màu trong mục Color, đặt tên trong mục Name và đường dẫn trong mục Slug. Cuối cùng, click vào nút Add Color để thêm. Những màu sắc này sẽ chỉ có thể áp dụng theo cách thủ công và không bị thay đổi khi bạn đổi theme.
• Default Colors: cho phép các bạn thay đổi các màu sắc mặc định của theme. Những thay đổi này sẽ được áp dụng tự động trên toàn trang. Tuy nhiên, chúng cũng sẽ bị mất khi bạn đổi theme khác.

3. Quay trở lại trình soạn thảo Block và kiểm tra kết quả.

• Đây là một ví dụ về trình lựa chọn màu sắc mặc định của WordPress:

• Còn đây là ví dụ về một màu sắc tùy chỉnh được thêm bởi Block Editor Colors:

Giờ đây, bạn đã có thể lựa chọn những màu sắc yêu thích của mình một cách nhanh chóng mà không phải mất công nhớ mã màu hexa nữa. Thật tuyệt vời phải không nào? Chúc các bạn thành công!

Bạn biết giải pháp khác đơn giản và hiệu quả hơn để thêm hoặc chỉnh sửa màu sắc trong Block Editor? Đừng quên chia sẻ nó với chúng tôi thông qua khung bình luận bên dưới.

Nếu bạn thích bài viết này, hãy theo dõi blog của tôi để thường xuyên cập nhật những bài viết hay nhất, mới nhất nhé. Cảm ơn rất nhiều. :)