Thay thế tập lệnh jQuery mặc định của WordPress bằng Thư viện Google
Bạn có muốn thay thế tập lệnh jQuery WordPress mặc định bằng jQuery từ Thư viện được lưu trữ trên Google không?
WordPress bao gồm jQuery với phần mềm cốt lõi theo mặc định. Tuy nhiên, việc thay thế nó bằng phiên bản jQuery mới nhất từ thư viện Google có thể cải thiện hiệu suất.
Trong bài viết này, chúng tôi sẽ chỉ cho bạn cách dễ dàng thay thế tập lệnh jQuery WordPress mặc định bằng thư viện Google để cải thiện hiệu suất và tốc độ.
Tại sao và khi nào bạn nên thay thế jQuery mặc định của WordPress
jQuery là một thư viện JavaScript phổ biến được các nhà phát triển sử dụng để tạo ra các ứng dụng web đẹp mắt. Nó được sử dụng khá thường xuyên trong WordPress để thêm các tính năng như thanh trượt, cửa sổ bật lên, v.v.
WordPress bao gồm một thư viện jQuery được đóng gói cùng với phần mềm WordPress cốt lõi. Nhiều plugin WordPress hàng đầu và các chủ đề WordPress phổ biến nhất đều dựa vào thư viện này để có các chức năng và tính năng thiết yếu.
Tuy nhiên, việc tải jQuery trên máy chủ lưu trữ được chia sẻ có thể tiêu tốn nhiều tài nguyên và làm chậm trang web của bạn, đặc biệt nếu bạn đang sử dụng bất kỳ chủ đề hoặc plugin WordPress được mã hóa kém nào không tuân theo các phương pháp hay nhất của WordPress.
Một vấn đề khác khi sử dụng phiên bản jQuery đi kèm với WordPress là nó sẽ không được cập nhật trừ khi WordPress cập nhật nó. Có thể có các phiên bản jQuery mới hơn với các bản sửa lỗi về hiệu suất hoặc bảo mật, nhưng bạn sẽ không có quyền truy cập vào chúng cho đến khi chúng được đưa vào bản cập nhật WordPress.
Có một số cách giải quyết để khắc phục điều này. Ví dụ: bạn có thể tải jQuery qua máy chủ Google hoặc CDN chính thức của jQuery.
Thư viện được lưu trữ trên Google là một lựa chọn tốt vì máy chủ của họ ổn định, được cập nhật và được tối ưu hóa cao về tốc độ, cho phép jQuery tải nhanh hơn nhiều trên trang web WordPress của bạn.
Như đã nói, chúng ta hãy xem cách dễ dàng thay thế WordPress jQuery mặc định bằng thư viện Google.
Thay thế jQuery WordPress mặc định bằng Thư viện Google
WordPress đi kèm với một phương pháp tích hợp để dễ dàng thêm tập lệnh và bảng định kiểu. Điều này cũng cho phép bạn xóa an toàn mọi tập lệnh hoặc bảng định kiểu được tải bằng phương thức tích hợp sẵn.
Trước tiên, chúng tôi sẽ sử dụng phương pháp này để vô hiệu hóa jQuery mặc định của WordPress. Sau đó, chúng tôi sẽ yêu cầu WordPress tải jQuery thông qua thư viện Google.
Bạn sẽ cần thêm mã sau vào tệp tin.php của chủ đề, plugin dành riêng cho trang web hoặc plugin đoạn mã.
function wpb_modify_jquery() {
//check if front-end is being viewed
if (!is_admin()) {
// Remove default WordPress jQuery
wp_deregister_script('jquery');
// Register new jQuery script via Google Library
wp_register_script('jquery', 'https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js', false, '3.6.0');
// Enqueue the script
wp_enqueue_script('jquery');
}
}
// Execute the action when WordPress is initialized
add_action('init', 'wpb_modify_jquery');
Chúng tôi khuyên bạn nên sử dụng plugin WPCode để thêm mã này vào WordPress. Nó miễn phí, dễ sử dụng và sẽ không làm hỏng trang web của bạn nếu có sự cố xảy ra.
Để bắt đầu, bạn cần cài đặt và kích hoạt WPCode. Nếu bạn cần trợ giúp, hãy xem hướng dẫn của chúng tôi về cách cài đặt plugin WordPress.
Sau khi plugin được kích hoạt, hãy điều hướng đến Đoạn mã Thêm đoạn mã từ trang tổng quan WordPress của bạn. Sau đó, tìm tùy chọn ‘Thêm mã tùy chỉnh của bạn (Đoạn mã mới)’ và nhấp vào nút ‘Sử dụng đoạn mã’ bên dưới tùy chọn đó.
Tiếp theo, bạn có thể thêm tiêu đề cho đoạn mã của mình. Đây có thể là bất cứ điều gì giúp bạn nhớ mã dùng để làm gì.
Sau đó, chỉ cần dán mã ở trên vào hộp ‘Xem trước mã’ và chọn ‘Đoạn mã PHP’ làm loại mã từ menu thả xuống.
Cuối cùng, chuyển nút chuyển từ ‘Không hoạt động’ sang ‘Hoạt động’ và nhấp vào nút ‘Lưu đoạn trích’.
Đó là tất cả! Bây giờ WordPress sẽ thay thế jQuery mặc định và tải nó qua thư viện Google.
Lưu ý: Phương pháp này sẽ tiếp tục tải phiên bản jQuery được đề cập trong URL. Trong tương lai, bạn có thể cần thay đổi URL thư viện Google để sử dụng phiên bản jQuery mới hơn.
Google sẽ không tự động cập nhật số phiên bản cho bạn vì điều này có thể gây ra sự cố tương thích nếu chủ đề hoặc plugin của bạn dựa trên một phiên bản khác.
Bạn có thể tìm thấy URL mới nhất bằng cách truy cập trang web thư viện được lưu trữ trên Google. Từ đó, bạn cũng có thể tìm thấy các URL cho các phiên bản jQuery cũ hơn mà bạn có thể sử dụng để khắc phục sự cố nếu cần.
Thay thế các thư viện jQuery mặc định khác
Ngoài thư viện jQuery cốt lõi, WordPress còn bao gồm một loạt các tập lệnh jQuery khác. Một số tập lệnh này, như jQuery Mobile và jQuery UI, được lưu trữ trên thư viện Google.
Đối với các thư viện khác, bạn có thể sử dụng máy chủ CDN của jQuery để tải chúng nhanh hơn nhiều. Trong ví dụ sau, chúng tôi đã thay thế tập lệnh jquery-ui-core của WordPress bằng phiên bản jquery-ui chính thức.
function wpb_modify_jquery_ui() {
if (!is_admin()) {
wp_deregister_script('jquery-ui-core');
wp_register_script('jquery-ui-core', 'https://code.jquery.com/ui/1.12.1/jquery-ui.min.js', false, '1.12.1');
wp_enqueue_script('jquery-ui-core');
}
}
add_action('init', 'wpb_modify_jquery_ui');
Cũng giống như các thư viện của Google, sau một thời gian, bạn sẽ cần thay thế URL để sử dụng phiên bản tập lệnh mới nhất.
Vô hiệu hóa hoàn toàn jQuery trong WordPress
Do khả năng sử dụng rộng rãi của nó, chúng tôi khuyên bạn không nên tắt hoàn toàn jQuery trên trang web WordPress của mình. Ngay cả khi chủ đề WordPress của bạn không sử dụng jQuery, nhiều plugin WordPress phổ biến vẫn cần nó.
Tuy nhiên, nếu bạn chắc chắn rằng trang web của mình không cần jQuery thì bạn có thể vô hiệu hóa nó một cách an toàn.
Chỉ cần thêm mã sau vào tệp chức năng của chủ đề, plugin dành riêng cho trang web hoặc plugin đoạn mã như WPCode.
if ( !is_admin() ) wp_deregister_script('jquery');
Đó là tất cả. Mã này chỉ đơn giản là vô hiệu hóa tập lệnh jQuery tải ở mặt trước của trang web WordPress của bạn.
Khắc phục sự cố liên quan đến jQuery trong WordPress
Các phiên bản mới của jQuery đôi khi có thể không dùng nữa hoặc loại bỏ các phương thức và hàm cũ. Nếu một plugin WordPress trên trang web của bạn đang sử dụng một phương pháp cũ hơn thì điều này có thể làm hỏng mọi thứ.
Bạn có thể nhận thấy các cảnh báo trong khu vực Bảng điều khiển của công cụ Kiểm tra hoặc bạn có thể nhận thấy một số tính năng vừa ngừng hoạt động.
WordPress từng sử dụng tập lệnh có tên jQuery-migrate để cung cấp khả năng tương thích sao lưu với các phiên bản jQuery cũ hơn. Tuy nhiên, kể từ WordPress 5.5, tập lệnh này đã bị loại bỏ khỏi WordPress.
Nếu bạn muốn thêm lại tập lệnh di chuyển jQuery hoặc khắc phục sự cố giữa các phiên bản jQuery khác nhau, bạn có thể thử phương pháp sau.
Chỉ cần cài đặt và kích hoạt plugin Kiểm soát phiên bản cho jQuery. Để biết thêm chi tiết, hãy xem hướng dẫn từng bước của chúng tôi về cách cài đặt plugin WordPress.
Sau khi kích hoạt, bạn cần truy cập trang Cài đặt » Kiểm soát phiên bản jQuery. Từ đây, bạn có thể chọn phiên bản jQuery bạn muốn sử dụng.
Plugin sẽ tự động tải phiên bản đó từ CDN jQuery chính thức.
Plugin cũng sẽ tải tập lệnh di chuyển jQuery. Nếu muốn, bạn có thể tắt nó trong quá trình khắc phục sự cố.
Đừng quên nhấp vào nút ‘Save Changes’ để lưu các thay đổi của bạn.
Chúng tôi hy vọng bài viết này đã giúp bạn tìm hiểu cách thay thế WordPress jQuery mặc định bằng thư viện Google. Bạn cũng có thể muốn xem các hướng dẫn jQuery hữu ích này dành cho người dùng WordPress hoặc xem hướng dẫn tối ưu hóa hiệu suất WordPress hoàn chỉnh của chúng tôi.
Nếu bạn thích bài viết này, vui lòng đăng ký Kênh YouTube của chúng tôi để xem video hướng dẫn về WordPress. Bạn cũng có thể tìm thấy chúng tôi trên Twitter và Facebook.