Tùy chỉnh màu sắc toàn cục – Global Colors

Tùy chỉnh màu sắc toàn cục – Global Colors

Đường dẫn đến tính năng: Trang quản trị WordPress > Giao diện (Appearance) > Tùy biến (Customize) > Màu sắc (Colors).

Theo mặc định, có 7 màu được thêm vào. Mỗi màu có một mục đích cụ thể. Từ trái sang phải:

  • Contrast – màu văn bản mạnh nhất
  • Contrast 2 – màu văn bản sáng hơn
  • Contrast 3 – màu văn bản hoặc đường viền nhẹ nhất
  • Base – nền tối (văn bản mạnh nhất vẫn có thể đọc được)
  • Base 2 – nền sáng hơn
  • Base 3 – nền sáng nhất (trắng)
  • Accent – màu thương hiệu chính
Global Colors

Bạn cũng có thể thay đổi hoặc thêm nhiều màu sắc của riêng mình tùy thích tại Global Colors. Hãy nhớ bạn nên chọn màu thật đơn giản và tuân theo quy tắc chọn màu như màu mặc định, vì đây là những màu bạn sẽ sử dụng lại trong toàn bộ thiết kế và nội dung của mình.

Danh sách các phần tử trên web có thể tùy chỉnh màu:

  • Base
  • Header
  • Menu chính (Primary Navigation)
  • Menu phụ (Secondary Navigation)
  • Off Canvas Panel
  • Buttons
  • Content
  • Forms
  • Sidebar Widget
  • Widget Footer
  • Footer Bar

Bộ cài đặt màu của mỗi phần tử gồm các trường màu:

  • Background – màu nền
  • Văn bản (Text) – màu văn bản
  • Link – màu đường dẫn ban đầu (Initital color), màu khi di chuột vào đường dẫn (Hover color)

Bạn có thể xóa hoặc đổi tên các màu mặc định tại phần Global Colors. Tuy nhiên, nếu làm vậy, bạn sẽ cần cập nhật lại các trường màu của các phần tử đang sử dụng màu đã xóa/đổi tên, vì những trường đó sẽ không còn giá trị nữa.

Lưu ý khi chọn màu:

  • Màu cơ bản (Base Colors): Màu cơ bản thường là màu nền của bạn. Phải có đủ độ tương phản giữa các màu này và các màu Tương phản của bạn để văn bản của bạn vẫn có thể đọc được.
  • Màu sắc tương phản (Contrast Colors): Màu tương phản của bạn thường là màu văn bản / đường viền của bạn.
  • Màu nhấn (Accent Colors): (Các) màu nhấn của bạn là những màu ít được sử dụng nhất trên trang web của bạn. Chúng nhằm thu hút sự chú ý (liên kết, nút, tiêu đề đặc biệt, v.v…).