Cách tùy biến các đoạn code hướng dẫn nổi bật hơn trong Wordpress 1

Cách tùy biến các đoạn code hướng dẫn nổi bật hơn trong WordPress

[Thủ thuật WordPress] Hướng dẫn cách tùy biến các đoạn code hướng dẫn nổi bật hơn trong WordPress – Bạn có đang sử dụng wordpress để làm blog hướng dẫn các thủ thuật website hay không? Nếu bạn có sử dụng code để hướng dẫn các thao tác thì một điều chắc chắn rằng nếu bạn sử dụng một cách bình thường thì những đoạn code này khi đưa vào bài viết thì nó chỉ là 1 màu đen huyền bí, và có thể khi bạn chèn code vào bài viết một cách thông thường thì những đoạn code này nó sẽ bị mất đi một số đoạn mã.

Trong bài viết trước đây về thủ thuật WordPress mình có hướng dẫn các bạn cách rút gọn tiêu đề bài viết không dùng Plugin trong WordPress giúp bạn có thể giới hạn tiêu đề bài viết trong WordPress một cách dễ dàng tiếp tục trong bài viết này mình sẽ hướng dẫn các bạn cách tùy biến các đoạn code hướng dẫn nổi bật hơn trong WordPress.

Tùy biến các đoạn code hướng dẫn nổi bật hơn trong WordPress

Như mình đã đề cập ở trên nếu bạn có những đoạn mã muốn giới thiệu đến độc giả nếu bạn chèn vào bài viết một cách thông thường thì những nội dung của những đoạn mã đó khi hiển thị đến với độc giả thường không chính xác và nó làm giảm thẩm mỹ trang web của bạn. Vậy làm thế nó để các đoạn mã này hiển thị nội dung chính xác và nổi bật hãy cùng blog thủ thuật tìm hiểu cách tùy biến các đoạn code hướng dẫn nổi bật hơn trong WordPress.

Để làm nổi bật các đoạn mã trong WordPress bạn có thể sử dụng Plugin Crayon Syntax Highlighter, Plugin này hỗ trợ hiển thị hầu hết các ngôn ngữ thông dụng hiện nay. Đầu tiên giống như mọi Plugin khác đầu tiên bạn cần cài đặt Plugin và kích hoạt nó để sử dụng (tham khảo bài viết hướng dẫn cài đặt Plugin WordPress với các phương pháp rất đơn giản).

tùy biến các đoạn code hướng dẫn nổi bật hơn trong WordPress
Tùy biến các đoạn code hướng dẫn nổi bật hơn trong WordPress

Sau khi cài đặt xong bạn Kích hoạt Plugin (Active Plugin) lên > sau đó vào Cài đặt (Settings) > Crayon để tùy chỉnh gồm theme (giao diện), Font (định dạng chữ)…. (bạn nên để mặc định, nếu có thay đổi bạn nên thay đổi chiều dài chiều rộng cho phù hợp với theme của mình hoặc bạn không chọn để nó tự điều chỉnh).

lam-noi-bat-code-trong-wordpress-1-1

Sử dụng Plugin

Sau khi cấu hình các thông số Plugin cần thiết tiếp tục bạn vào phần viết bài Bài viết > viết bài mới (Post  > Add new) bạn sẽ thấy trên khung soạn thảo xuất hiện một biểu tượng như thế này (<>).

lam-noi-bat-code-trong-wordpress-2-1

Bạn chọn đoạn code muốn hiển thị rồi sau đó nhấn vào nút (<>) lúc này một cửa sổ hiện ra bạn chỉ cần dán code vào khung Code là được.

Ví dụ tôi có đoạn code như sau

class Human{
privateintage=0;
publicvoidbirthday(){
age++;
print(‘Happy Birthday!’);
}}

Tôi sẽ copy đoạn code này tôi bỏ vào trong cửa sổ Add Crayon Code sau đó nhấn Add (ở giao diện này bạn có thể tùy chỉnh hiển thị cũng được).

lam-noi-bat-code-trong-wordpress-3-1

Và kết quả tôi sẽ được như bên dưới.

class Human{ privateintage=0; publicvoidbirthday(){ age++; print('Happy Birthday!'); }}

Vậy là xong rồi, quá đơn giản để bạn có thể tùy biến các đoạn code hướng dẫn nổi bật hơn trong WordPress phải không?

Cuối cùng không có gì hơn nếu bạn cảm thấy bài viết có ích hãy subscribe blog  của mình thường xuyên để cập nhật những bài viết mới nhất qua Email – Chân thành cảm ơn!

Bài viết có ích cho bạn?

Average rating / 5. Vote count:

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