Hướng dẫn đổi màu nền màu chữ, font chữ mặc định website WordPress

Bài viết đăng bởi huynhtrungbk vào lúc 06-06-2023 và cập nhật lúc 07-06-2023 369 lượt xem
Hướng dẫn đổi màu nền màu chữ mặc định website Wordpress

Cách đổi màu nền, màu chữ trong bài viết của website WordPress như thế nào? Đây là câu hỏi mình thường xuyên nhận được sau khi bàn giao web cho khách hàng của mình.

Gần đây, một độc giả của chúng tôi đã hỏi liệu có cách nào dễ dàng để thay đổi màu văn bản trong WordPress không?

Câu trả lời là có. Bạn có thể dễ dàng thay đổi màu phông chữ của mình trong WordPress trên toàn bộ trang web hoặc thậm chí chỉ cho một từ duy nhất bên trong nội dung bài đăng của bạn.

Trong hướng dẫn này, chúng tôi sẽ chỉ cho bạn cách dễ dàng thay đổi màu văn bản trong WordPress theo từng bước.

Tại sao nên đổi màu mặc định của theme website

Có rất nhiều lý do khiến bạn có thể muốn thay đổi màu văn bản trong bài viết hoặc trang của mình. Có thể bạn muốn nhấn mạnh một từ khóa, hoặc có thể bạn muốn sử dụng các tiêu đề phụ có màu trên một trang cụ thể.

Ngoài ra, bạn có thể muốn thay đổi màu văn bản trên toàn bộ trang web của mình. Có lẽ chủ đề của bạn sử dụng màu xám cho văn bản, nhưng bạn muốn làm cho nó có màu đen hoặc xám đậm hơn để dễ đọc hơn.

Chỉ cần nhấp vào một trong những liên kết đó để chuyển thẳng đến phương pháp đó.

4 Cách đổi màu văn bản và nền giao diện website WordPress

Phương pháp 1. Thay đổi màu văn bản bằng trình chỉnh sửa trực quan

Bạn có thể sử dụng trình chỉnh sửa WordPress mặc định để đặt các từ, đoạn văn hoặc thậm chí tiêu đề phụ bằng màu khác với văn bản chính của bạn.

Đây là cách bạn có thể thay đổi màu văn bản của mình bằng trình chỉnh sửa khối.

Trước tiên, bạn cần chỉnh sửa bài đăng hoặc trang mà bạn muốn thay đổi hoặc tạo một trang mới.

Tiếp theo, nhập văn bản của bạn. Bạn sẽ cần tạo một khối đoạn văn hoặc một khối tiêu đề nếu thích hợp. Để được trợ giúp về việc này, hãy xem hướng dẫn của chúng tôi về cách sử dụng trình chỉnh sửa khối WordPress .

Khi văn bản của bạn đã ở đúng vị trí, bạn có thể thay đổi màu sắc.

Thay đổi màu văn bản của một khối

Đối với ví dụ đầu tiên này, chúng ta sẽ thay đổi màu văn bản của toàn bộ khối.

Chỉ cần nhấp vào khối và bảng Cài đặt khối sẽ mở ra ở bên phải màn hình của bạn. Tiếp theo, nhấp vào mũi tên cho ‘Cài đặt màu’ để mở rộng tab đó. Bạn sẽ thấy cài đặt màu văn bản ở đây.

Bây giờ, bạn có thể chọn một màu mới cho văn bản. Trình chỉnh sửa trực quan sẽ hiển thị cho bạn một số tùy chọn dựa trên chủ đề của bạn. Bạn chỉ cần nhấp vào một trong số này để thay đổi màu văn bản của mình.

Ngoài ra, nếu bạn có ý nghĩ về một màu cụ thể, hãy nhấp vào liên kết ‘Màu tùy chỉnh’. Thao tác này sẽ mở ra một công cụ chọn màu, nơi bạn có thể chọn màu theo cách thủ công. Bạn cũng có thể sử dụng điều này để nhập mã hex.

Nếu bạn đổi ý và muốn quay lại màu văn bản mặc định, chỉ cần nhấp vào nút ‘Xóa’ bên dưới các tùy chọn màu:

Mẹo chuyên nghiệp: Nếu bạn muốn thay đổi màu nền cho một khối, bạn cũng có thể làm điều đó tại đây.

Thay đổi màu văn bản của từ hoặc cụm từ

Điều gì sẽ xảy ra nếu bạn chỉ muốn thay đổi màu của một hoặc hai từ? Điều đó cũng dễ dàng bằng cách sử dụng trình chỉnh sửa khối.

Đầu tiên, bạn cần đánh dấu (các) từ mà bạn muốn thay đổi. Sau đó, nhấp vào mũi tên nhỏ xuống trên thanh công cụ của trình soạn thảo nội dung .

Tiếp theo, chỉ cần nhấp vào liên kết ‘Màu văn bản’ ở cuối danh sách thả xuống:

Bây giờ bạn sẽ thấy các tùy chọn màu tương tự như cho toàn bộ khối. Một lần nữa, bạn có thể chọn từ một trong các tùy chọn mặc định hoặc sử dụng liên kết ‘Màu tùy chỉnh’ để chọn bất kỳ màu nào bạn muốn.

Các tùy chọn màu không giới hạn ở các khối đoạn văn. Bạn cũng có thể thay đổi màu văn bản của các khối tiêu đề. Như với khối đoạn văn, bạn có thể đặt màu văn bản cho toàn bộ khối trong cài đặt khối. Ngoài ra, bạn có thể đánh dấu các từ riêng lẻ và thay đổi màu của chúng.

Lưu ý: Bạn không thể đặt màu nền cho các khối tiêu đề.

Bạn cũng có thể thay đổi màu văn bản trong một khối danh sách, nhưng chỉ bằng cách đánh dấu (các) từ và sử dụng thanh công cụ. Không có tùy chọn nào trong cài đặt khối để thay đổi màu văn bản cho toàn bộ khối danh sách.

Thay đổi màu phông chữ bằng trình chỉnh sửa cổ điển

Nếu bạn vẫn đang sử dụng trình chỉnh sửa WordPress cổ điển , thì bạn có thể thay đổi màu phông chữ bằng cách sử dụng thanh công cụ.

Trong trình chỉnh sửa cổ điển, nhấp vào Chuyển đổi Thanh công cụ ở ngoài cùng bên phải. Sau đó, bạn sẽ thấy hàng biểu tượng thứ hai:

Bây giờ, bạn có thể chọn văn bản của mình và thay đổi màu phông chữ bằng cách sử dụng màu phông chữ thả xuống.

Phương pháp 2. Thay đổi màu văn bản trong tùy biến chủ đề

Điều gì xảy ra nếu bạn muốn thay đổi màu văn bản trên toàn bộ trang web của mình? Nhiều chủ đề WordPress tốt nhất sẽ cho phép bạn làm điều này bằng cách sử dụng công cụ tùy chỉnh chủ đề .

Đối với ví dụ này, chúng tôi đang sử dụng chủ đề OceanWP . Đây là một trong những chủ đề miễn phí hàng đầu có sẵn cho WordPress.

Trong bảng điều khiển WordPress của bạn, đi tới Giao diện »Tùy chỉnh để mở Công cụ tùy chỉnh chủ đề.

Tiếp theo, bạn cần tìm một tùy chọn chẳng hạn như ‘Kiểu chữ’. Các tùy chọn có sẵn và chúng được gọi là gì, sẽ khác nhau tùy thuộc vào chủ đề của bạn.

Hãy tiếp tục và nhấp vào tab Kiểu chữ hoặc một tùy chọn tương đương. Tiếp theo, hãy tìm một cài đặt mà bạn có thể thay đổi văn bản của các bài đăng và trang của mình. Trong OceanWP, đây được gọi là văn bản ‘Nội dung’. Bạn cần nhấp vào đây để có thể tùy chỉnh màu phông chữ và hơn thế nữa.

Khi bạn nhấp vào bộ chọn Màu Phông chữ, bạn sẽ thấy một bộ chọn màu. Chọn bất kỳ màu nào bạn muốn sử dụng cho văn bản của mình. Thao tác này sẽ thay đổi màu văn bản trong tất cả các bài đăng và trang của bạn.

Bạn cũng có thể thay đổi màu tiêu đề của mình theo cách tương tự, bằng cách sử dụng các tùy chọn để thay đổi H1, H2, v.v.

Khi bạn hài lòng với các thay đổi của mình, hãy nhấp vào nút ‘Xuất bản’ ở đầu màn hình.

Mẹo: Chọn văn bản màu đen hoặc xám đậm trên nền trắng hoặc rất sáng thường là tốt nhất để dễ đọc.

Phương pháp 3. Thay đổi màu văn bản bằng mã CSS

Điều gì sẽ xảy ra nếu chủ đề của bạn không có tùy chọn thay đổi màu văn bản?

Bạn vẫn có thể thay đổi màu phông chữ trên toàn bộ trang web bằng cách sử dụng công cụ tùy chỉnh chủ đề. Chuyển đến Giao diện »Tùy biến trong bảng điều khiển WordPress.

Ở cuối danh sách các tùy chọn, bạn sẽ thấy một tab có nội dung ‘CSS bổ sung’.

Tiếp theo, nhấp vào tab CSS bổ sung và bạn sẽ thấy một số hướng dẫn cùng với hộp để bạn có thể nhập mã CSS.

Để bắt đầu, bạn có thể sao chép mã này vào hộp. Sau đó, bạn có thể thay đổi 6 số thành mã hex của màu bạn đã chọn.

p { color:#990000; }

Điều này sẽ thay đổi màu chữ của văn bản thông thường trong tất cả các bài đăng và trang của bạn thành màu đỏ sẫm (hoặc bất kỳ màu nào bạn chọn), như sau:

Nếu bạn muốn thay đổi màu của các tiêu đề trong bài đăng của mình, bạn có thể thêm mã này để thay thế:

h2 { color:#990000; }

Một lần nữa, thay đổi mã hex thành bất kỳ màu nào bạn muốn.

Nếu bạn không quen thuộc với CSS hoặc muốn một trình chỉnh sửa CSS thân thiện với người mới bắt đầu cho phép bạn dễ dàng tùy chỉnh toàn bộ kiểu trang web của mình, thì chúng tôi khuyên bạn nên xem xét CSS Hero . Đó là một trình chỉnh sửa trực quan mạnh mẽ cho phép bạn tùy chỉnh các kiểu của toàn bộ trang web của mình.

Chúng tôi hy vọng hướng dẫn này đã giúp bạn tìm hiểu cách thay đổi màu văn bản trong WordPress. Bạn cũng có thể thích các hướng dẫn của chúng tôi về cách thay đổi kích thước phông chữ trong WordPress và cách thêm phông chữ tùy chỉnh trong WordPress .

Phương pháp 4: Sử dụng trình soạn nội dung Elementor

Là một trong những trình tạo trang được sử dụng rộng rãi nhất trong cộng đồng WordPress, Tigoweb tin rằng hầu hết người dùng đều tin tưởng Elementor để xây dựng và thiết kế website của mình.

Sử dụng Elementor làm trình tạo kéo, thả, chỉnh sửa trang và xuất bản trang rất đơn giản và nhanh chóng. Tương tự như vậy, việc điều chỉnh đổi màu văn bản trong Elementor sẽ giúp bạn tiết kiệm thời gian chỉ trong vài giây.

Elementor Widgets cho phép bạn chỉnh sửa và thay đổi màu văn bản và cài đặt kiểu chữ của WordPress. Các tùy chọn thiết kế này nằm trong tab Widget Setting > Style tab.

Bây giờ, chỉ bằng cách nhấp vào biểu tượng chỉnh sửa, bạn có thể truy cập cài đặt kiểu chữ. Sau đó, bạn có thể tự do thay đổi màu văn bản, cỡ chữ, họ và kiểu chữ WordPress theo sở thích của mình.

  • Text Color: Chọn màu cho văn bản.
  • Font chữ: Chọn họ phông chữ của bạn.
  • Kích thước: Xác định kích thước phông chữ ưa thích của bạn.
  • Độ dày: Chọn độ dày của phông chữ.
  • Kiểu chữ: Chọn giữa Bình thường, Nghiêng và Xiên.
  • Trang trí: Chọn trang trí văn bản của bạn.
  • Chiều cao hàng: Di chuyển thanh trượt sang trái hoặc phải để đặt chiều cao hàng.
  • Giãn cách chữ: Sử dụng thanh trượt để xác định khoảng cách chữ.

Liên hệ hỗ trợ thiết kế website WordPress Chuyên nghiệp

Trả lời