Chia sẻ mã nguồn trong bài viết WordPress không chỉ là một phần quan trọng của việc truyền đạt thông tin mà còn giúp làm cho nội dung của bạn trở nên chuyên nghiệp và dễ hiểu. Trong bài viết này, chúng ta sẽ đào sâu vào cách hiển thị mã nguồn một cách hiệu quả trong WordPress, với hướng dẫn chi tiết từng bước như sau:
1. Sử Dụng Block Code Trong WordPress Editor
WordPress Editor cung cấp một khối mã nguồn giúp bạn dễ dàng chèn code vào bài viết. Dưới đây là cách bạn có thể sử dụng nó:
Hình ảnh minh họa: Chọn khối “Code” trong WordPress Editor.
Bước 1: Mở WordPress Editor
Mở bài viết bạn muốn chỉnh sửa hoặc tạo bài viết mới.
Bước 2: Chọn Khối Mã Ngôn Ngữ
Chọn “Block” và tìm kiếm “Code” hoặc “Custom HTML” block. Nhập mã nguồn của bạn vào khối này.
Hình ảnh minh họa: Chọn khối “Code” trong WordPress Editor.
Bước 3: Chọn Ngôn Ngữ
Chọn ngôn ngữ của mã nguồn để WordPress có thể hiểu cú pháp và màu sắc của nó.
Hình ảnh minh họa: Chọn ngôn ngữ của mã nguồn trong WordPress Editor.
Bước 4: Lưu và Xem Trước
Lưu bài viết và xem trước để đảm bảo mã nguồn hiển thị đúng và đẹp mắt.
2. Sử Dụng Plugin Code Syntax Highlighting
Một số plugin cung cấp tính năng tô màu cú pháp cho mã nguồn của bạn. Dưới đây là cách sử dụng một plugin như Code Syntax Highlighting:
Hình ảnh minh họa: Cài đặt plugin Code Syntax Highlighting từ trang Plugins trong WordPress.
Bước 1: Cài Đặt Plugin
Điều hướng đến “Plugins” > “Add New” và tìm kiếm “Code Syntax Highlighting”. Cài đặt và kích hoạt plugin.
Bước 2: Sử Dụng Trong Bài Viết
Sử dụng khối mới có tên “Code” hoặc “Syntax Highlighter” để chèn mã nguồn vào bài viết.
Hình ảnh minh họa: Chèn mã nguồn sử dụng plugin Code Syntax Highlighting.
Bước 3: Tùy Chỉnh Màu Sắc và Kiểu
Một số plugin cho phép bạn tùy chỉnh màu sắc và kiểu của mã nguồn. Kiểm tra cài đặt plugin để xem các tùy chọn này.
3. Sử Dụng Shortcode của WordPress
WordPress cung cấp shortcode để hiển thị code một cách nhanh chóng. Dưới đây là cách sử dụng shortcode:
Hình ảnh minh họa: Chèn shortcode
[code] trong bài viết WordPress.
Bước 1: Chèn Shortcode
Chèn shortcode [code] và đặt mã nguồn bên trong nó trong bài viết của bạn.
Bước 2: Tùy Chỉnh Thêm (nếu cần)
Nếu muốn tùy chỉnh màu sắc hoặc kiểu hiển thị, sử dụng thêm các thuộc tính như lang hoặc style theo sau: [code lang="php" style="colorful"].
Kết luận: Hiển thị code trong bài viết WordPress trở nên dễ dàng hơn khi bạn sử dụng các công cụ và tính năng có sẵn. Tùy thuộc vào sở thích và yêu cầu cụ thể, bạn có thể chọn cách thích hợp để làm cho mã nguồn của mình trở nên chuyên nghiệp và dễ đọc. Hãy thử nghiệm và tìm ra phong cách hiển thị code phù hợp với bạn!
