Plugin Enlighter – Customizable Syntax Highlighter
Enlighter là một plugin tuyệt vời khác để hiển thị mã đẹp xuất hiện trong trang web WordPress của bạn. Đây là công cụ đánh dấu cú pháp dễ sử dụng và tùy biến cho WordPress mà bạn có thể dễ dàng liên kết mã của bạn với shortcode. Một Theme-Customizer với chế độ xem trước trực tiếp được bao gồm để sửa đổi các chủ đề được xây dựng trong. Tính năng mở rộng cũng hỗ trợ tạo tự động các tab-tab để hiển thị các nhóm mã với nhau như html + css + js.
Tính năng nổi bật
- Inline Syntax Highlighting
- Đánh dấu các khối mã có rào chắn
- Mã ngắn trong nội dung, nhận xét và tiện ích con
- Dễ sử dụng chế độ soạn thảo văn bản thông qua việc sử dụng Shortcodes và QuickTags
- Tùy chọn cấu hình nâng cao (sử dụng CDN, ..) có sẵn trong trang tùy chọn.
- Hỗ trợ các nhóm mã (hiển thị nhiều khối mã trong một ngăn tab)
- Công cụ chủ đề và ngôn ngữ có thể mở rộng – thêm công cụ của riêng bạn.
- Bộ xử lý mã vạch độc lập để tránh các vấn đề bộ lọc wpautop trong chế độ soạn thảo văn bản
- Webfont Loader để thêm các Font chữ Monospace còn thiếu vào trang web của bạn
Hướng dẫn cài đặt
- Bước 1: Vào Plugin -> Cài mới nhập vào ô tìm kiếm là Customizable Syntax Highlighter – rồi click Cài đặt & Kích hoạt

- Bước 2: Vào Tạo bài viết, chọn vào biểu tượng giống trong hình

- Bước 3: Tiếp theo là chỉ việc để phần Code trong khung -> Nhấn OK

Kết quả:
# Enlighter
// define the activated_plugin callback function action_activated_plugin( $plugin, $network_wide ) { // make action magic happen here... }; // add the action add_action( 'activated_plugin', 'action_activated_plugin', 10, 2 );
# Godzilla
// define the activated_plugin callback function action_activated_plugin( $plugin, $network_wide ) { // make action magic happen here... }; // add the action add_action( 'activated_plugin', 'action_activated_plugin', 10, 2 );
# Beyond
// define the activated_plugin callback function action_activated_plugin( $plugin, $network_wide ) { // make action magic happen here... }; // add the action add_action( 'activated_plugin', 'action_activated_plugin', 10, 2 );
# Classic
// define the activated_plugin callback function action_activated_plugin( $plugin, $network_wide ) { // make action magic happen here... }; // add the action add_action( 'activated_plugin', 'action_activated_plugin', 10, 2 );
# MowTwo
// define the activated_plugin callback function action_activated_plugin( $plugin, $network_wide ) { // make action magic happen here... }; // add the action add_action( 'activated_plugin', 'action_activated_plugin', 10, 2 );
# Eclipse
// define the activated_plugin callback function action_activated_plugin( $plugin, $network_wide ) { // make action magic happen here... }; // add the action add_action( 'activated_plugin', 'action_activated_plugin', 10, 2 );
# Droide
// define the activated_plugin callback function action_activated_plugin( $plugin, $network_wide ) { // make action magic happen here... }; // add the action add_action( 'activated_plugin', 'action_activated_plugin', 10, 2 );
# Minimal
// define the activated_plugin callback function action_activated_plugin( $plugin, $network_wide ) { // make action magic happen here... }; // add the action add_action( 'activated_plugin', 'action_activated_plugin', 10, 2 );
# Atomic
// define the activated_plugin callback function action_activated_plugin( $plugin, $network_wide ) { // make action magic happen here... }; // add the action add_action( 'activated_plugin', 'action_activated_plugin', 10, 2 );
# Rowhammer
// define the activated_plugin callback function action_activated_plugin( $plugin, $network_wide ) { // make action magic happen here... }; // add the action add_action( 'activated_plugin', 'action_activated_plugin', 10, 2 );
# Bootstrap4
// define the activated_plugin callback function action_activated_plugin( $plugin, $network_wide ) { // make action magic happen here... }; // add the action add_action( 'activated_plugin', 'action_activated_plugin', 10, 2 );
# Dracula
// define the activated_plugin callback function action_activated_plugin( $plugin, $network_wide ) { // make action magic happen here... }; // add the action add_action( 'activated_plugin', 'action_activated_plugin', 10, 2 );
# Monokai
// define the activated_plugin callback function action_activated_plugin( $plugin, $network_wide ) { // make action magic happen here... }; // add the action add_action( 'activated_plugin', 'action_activated_plugin', 10, 2 );
# Generic Highlighting
// define the activated_plugin callback function action_activated_plugin( $plugin, $network_wide ) { // make action magic happen here... }; // add the action add_action( 'activated_plugin', 'action_activated_plugin', 10, 2 );
Ngoài ra các bạn có thể tuỳ chỉnh giao diện khung chứa code.
Các bạn vào Enlighter -> Appearance. Ngay mục Theme click chuột vào để cho hiện list cho chọn theme mà bạn ưng ý nhất.
Chúc mọi người thành công !!!