Sửa lỗi mã hóa ký tự (double encoding) trong plugin SyntaxHighlighter Evolved
Lỗi mã hóa ký tự (double encoding) trong plugin SyntaxHighlighter Evolved thường xảy ra khi có sự xung đột giữa mã hóa của plugin và mã hóa của trang web hoặc cơ sở dữ liệu dẫn tới nội dung được mã hóa nhiều lần trước khi hiển thị, Điều này dẫn đến việc các ký tự đặc biệt như dấu ngoặc nhọn (<, >), dấu và (&) bị hiển thị sai, ví dụ như < thay vì <.
Cách sửa lỗi mã hóa ký tự (double encoding) trong plugin SyntaxHighlighter Evolved
Để sửa lỗi hiển thị ký tự đặc biệt trong plugin SyntaxHighlighter (một plugin để hiển thị mã nguồn đẹp hơn) bạn chỉ cần chèn đoạn code sau vào file functions.php của theme hoặc child theme đang sử dụng:
Dưới đây là giải thích chi tiết từng câu lệnh:
1. Hàm webchuyennghiep247_fix_syntaxhighlighter
Chức năng:
- Hàm này nhận đầu vào là chuỗi HTML (thường là mã nguồn đã được xử lý bởi SyntaxHighlighter).
- Sử dụng
preg_replaceđể thay thế các chuỗi ký tự bị mã hóa không mong muốn.
Mục đích:
- Sửa lỗi khi SyntaxHighlighter mã hóa quá mức (double encoding) các ký tự đặc biệt như & trong mã nguồn, dẫn đến lỗi hiển thị.
2. add_filter
Các lệnh add_filter thêm hàm sửa lỗi (webchuyennghiep247_fix_syntaxhighlighter) vào các bộ lọc khác nhau:
a) content_save_pre
add_filter( 'content_save_pre', 'webchuyennghiep247_fix_syntaxhighlighter' );
- Chức năng: Áp dụng hàm webchuyennghiep247_fix_syntaxhighlighter trước khi nội dung được lưu vào cơ sở dữ liệu.
- Lý do sử dụng: Đảm bảo rằng mã nguồn trong nội dung không bị mã hóa sai trước khi lưu.
b) syntaxhighlighter_htmlresult
add_filter( 'syntaxhighlighter_htmlresult', 'webchuyennghiep247_fix_syntaxhighlighter' );
- Chức năng: Chạy hàm sửa lỗi trên HTML đầu ra của plugin SyntaxHighlighter.
- Lý do sử dụng: Đảm bảo rằng khi hiển thị mã nguồn trên trang web, các ký tự đặc biệt không bị lỗi mã hóa.
c) syntaxhighlighter_precode
add_filter( 'syntaxhighlighter_precode', 'webchuyennghiep247_fix_syntaxhighlighter' );
- Chức năng: Chạy hàm sửa lỗi trên đoạn mã nguồn trước khi nó được chuyển thành HTML bởi SyntaxHighlighter.
- Lý do sử dụng: Ngăn ngừa lỗi mã hóa trong quá trình xử lý mã nguồn.
Tổng kết:
Những đoạn mã trên được sử dụng để:
1. Sửa lỗi mã hóa ký tự (double encoding) trong plugin SyntaxHighlighter.
2. Áp dụng sửa lỗi ở nhiều giai đoạn:
- Trước khi lưu nội dung.
- Trước khi hiển thị mã nguồn ra trình duyệt.
3. Đảm bảo mã nguồn hiển thị đúng trên trang web, đặc biệt với các ký tự đặc biệt như &.
Các nguyên nhân khác dẫn tới lỗi mã hóa ký tự (double encoding)
1. Kiểm tra và đồng nhất mã hóa:
- Mã hóa trang web: Đảm bảo trang web của bạn sử dụng mã hóa
UTF-8. Bạn có thể kiểm tra điều này trong thẻ <head> của trang HTML, tìm dòng<meta charset="UTF-8">. Nếu không có hoặc sử dụng mã hóa khác, hãy thêm hoặc sửa thành UTF-8. - Mã hóa cơ sở dữ liệu: Kiểm tra mã hóa của cơ sở dữ liệu WordPress. Đảm bảo nó cũng được đặt thành
UTF-8(thường làutf8mb4_unicode_cihoặcutf8_unicode_ci). Bạn có thể kiểm tra và thay đổi mã hóa này trongphpMyAdminhoặc các công cụ quản lý cơ sở dữ liệu khác. - Mã hóa tệp: Nếu bạn chỉnh sửa trực tiếp các tệp của plugin hoặc theme, hãy đảm bảo các tệp này cũng được lưu ở định dạng
UTF-8.
2. Sử dụng shortcode hoặc block chính xác:
- Shortcode: Nếu bạn sử dụng shortcode của SyntaxHighlighter Evolved, hãy đảm bảo bạn sử dụng đúng cú pháp. Ví dụ:
- Block Gutenberg: Nếu bạn sử dụng trình soạn thảo Gutenberg, hãy sử dụng block “SyntaxHighlighter Code” và chọn đúng ngôn ngữ lập trình.
3. Tắt các plugin xung đột:
Một số plugin khác có thể gây xung đột với SyntaxHighlighter Evolved. Hãy thử tắt tạm thời các plugin khác để kiểm tra xem có plugin nào gây ra lỗi hay không.
4. Cập nhật plugin và WordPress:
Đảm bảo bạn đang sử dụng phiên bản mới nhất của plugin SyntaxHighlighter Evolved và WordPress. Các phiên bản mới thường chứa các bản sửa lỗi và cải thiện tính tương thích.
5. Sử dụng HTML entities một cách cẩn thận:
Mặc dù việc sử dụng HTML entities như <, >, & là cần thiết trong một số trường hợp để tránh xung đột với HTML, việc lạm dụng chúng có thể dẫn đến double encoding. Hãy chắc chắn rằng bạn chỉ sử dụng chúng khi thực sự cần thiết.
6. Kiểm tra cài đặt plugin:
Một số phiên bản của SyntaxHighlighter Evolved có thể có các tùy chọn cấu hình liên quan đến mã hóa. Hãy kiểm tra cài đặt của plugin để xem có tùy chọn nào cần được điều chỉnh hay không.
Để lại một bình luận