fbpx
Đăng ngày 02.07.2020

Nếu bạn chưa biết thì trong phiên bản 4.2.6 của theme Paradise được phát hành ngày 24/02/2017, chúng tôi đã loại bỏ code async (tải không đồng bộ) JavaScript (JS) và thay vào đó là code chuyển toàn bộ JavaScript xuống footer.

Sở dĩ chúng tôi làm như vậy là vì việc async JS có thể gây ra lỗi tải thiếu JS trong một số trường hợp, làm cho tính năng cũng nhưng giao diện của blog/ website hiển thị không đầy đủ, đặc biệt là khi sử dụng plugin tạo cache.

Khác với kỹ thuật tải không đồng bộ (file JS có thể nằm ở header nhưng bị trì hoãn tải, buộc phải chờ tất cả các thành phần khác tải xong thì mới được tải, dẫn đến dễ bị lỗi trên các trình duyệt không hỗ trợ tốt async), chuyển JS xuống footer sẽ giúp blog/ website của bạn hoạt động ổn định hơn, trong khi vẫn đảm bảo được quy tắc tải JS sau cùng.

Có 2 cách khác nhau để làm việc này: 1 là chèn code snippets trực tiếp vào file functions.php của theme/ child theme bạn đang sử dụng, 2 là sử dụng plugin.

Sử dụng code snippets

Chèn đoạn code sau đây vào cuối file functions.php của theme/ child theme mà bạn đang sử dụng.

//* Move JavaScript to the Footer

function remove_head_scripts() { 
   remove_action('wp_head', 'wp_print_scripts'); 
   remove_action('wp_head', 'wp_print_head_scripts', 9); 
   remove_action('wp_head', 'wp_enqueue_scripts', 1);

   add_action('wp_footer', 'wp_print_scripts', 5);
   add_action('wp_footer', 'wp_enqueue_scripts', 5);
   add_action('wp_footer', 'wp_print_head_scripts', 5); 
} 
add_action( 'wp_enqueue_scripts', 'remove_head_scripts' );

Lưu lại, view source blog/ website và xem kết quả.

Sử dụng plugin

Đối với các bạn “đam mê” plugin, các bạn có thể sử dụng plugin Scripts To Footer để làm việc này. Chỉ với vài thiết lập đơn giản là các bạn đã có thể làm chủ được plugin nên tôi sẽ không giới thiệu cụ thể ở đây. Cuối cùng, chúc các bạn thành công!

Bạn đã từng chuyển JavaScript xuống footer trong WordPress? Bạn biết giải pháp khác đơn giản và hiệu quả hơn? Hãy chia sẻ nó với chúng tôi bằng cách sử dụng khung bình luận bên dưới.

© 2020 Az Agency