Làm nổi bật chữ trong wordpress không PLUGIN (Highlight text)

Highlight text là gì? Higtlight là nổi bật, text là chữ, vậy Hightlight text là chữ nổi bật – nổi bật chữ. Ok. Khi trình bày một đoạn văn bản nào đó, chúng ta rất hay muốn làm nổi bật chỗ này chỗ kia, và đó là Highlight text.

Trong wordpress làm thế nào để làm nổi bật chữ đây?

Hightlight text bằng plugin

Lý do lớn nhất là wordpress là một nền tảng được ưa chuộng đó là vì mã nguồn cms này không yêu cầu quá nhiều về code, và nó hỗ trợ rất nhiều plugin để làm các chức năng khác nhau. Một plugin phổ biến, nhiều css đẹp, lạ, quan trọng là tốt đó là plugin Crayon Syntax Highlighter.
Các bạn tìm hiểu thêm nhé, vì bài viết này mình nói về Highlight mà không cần plugin là chủ yếu.

Hightlight text không dùng plugin

Plugin rất tiện lợi, click vài cái là đạt được mục đích rồi. Tuy nhiên, lạm dụng nhiều quá thì web bạn sẽ nặng nề lắm, và bảo mật của website cũng có nguy cơ dính lỗi hơn. Nên Hướng dẫn và chia sẻ sẽ hướng dẫn các bạn cách Hightlight text trong wordpress không cần plugin.

Sử dụng Preformatted text

WordPress hỗ trợ tính năng “Preformatted text” (Được định dạng trước) để làm đoạn văn bản đó khác biệt.

Chọn định dạng text
Chọn định dạng text

Chỉ cần chọn văn bản và chọn Preformatted text là xong.

Sự khác biệt sao khi đã chọn định dạng
Sự khác biệt sao khi đã chọn định dạng

Bạn có thể thấy đoạn văn bản đã hiển thị khác rồi.

Ngoài ra, bạn cũng có thể chèn pre text vào bằng cách cho đoạn văn bản muốn nổi bật vào giữa cặp thẻ

<pre> đoạn văn bản muốn nổi bật </pre>

Viết CSS cho Preformatted text

chúng ta tìm thẻ <pre> trong file style.css với từ khóa pre { và sửa css đó thành css bạn muốn. Hoặc có thể truy cập CSS Stylesheet Editor (mục chỉnh sửa CSS tại phần Giao diện) và sửa css.
Đây là CSS mà mình sử dụng:

pre {
  background-color: #f1f1f1;
  padding: 4px 10px 4px 10px;
  border: none;
  border-radius: 0;
  margin-top: 24px;
}

khi sửa css thẻ pre của bạn giống của mình thì sẽ hiển thị như đang hiển thị đó.

Chúc bạn thành công !

HUONGDANVACHIASE

1 bình luận về “Làm nổi bật chữ trong wordpress không PLUGIN (Highlight text)”

Viết một bình luận