• Trang chủ
  • WordPress
    • Thủ thuật WordPress
    • WordPress Plugins
    • WordPress Themes
  • Hosting và Domain
  • Kiếm tiền
  • Đánh giá
  • Khuyến mãi
  • Thông báo
  • Giới thiệu
  • Liên hệ

WP Căn bản

Kiến thức căn bản cho người dùng WordPress

paradise-child-theme-wordpress-theme-tot-nhat
  • Dịch vụ WordPress Hosting
  • Dịch vụ tối ưu WordPress
  • Dịch vụ quét mã độc WordPress
  • Mua Paradise child theme
Trang chủ » WordPress » Thủ thuật WordPress » Chuyển tất cả JavaScript xuống footer trong WordPress
hosting-tot-nhat-danh-cho-wordpress

Chuyển tất cả JavaScript xuống footer trong WordPress

Cập nhật: 27/02/2017 Trung Hiếu 57 Bình luận

Mục lục Hiện
  • 1. Làm thế nào để chuyển tất cả JavaScript xuống footer?
    • 1.1. Sử dụng code snippets
    • 1.2. Sử dụng plugin

Chuyển tất cả JavaScript xuống footer trong WordPress.

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 vừa rồi, 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.

Tham khảo thêm:

  • Tải có điều kiện các file JS và CSS của plugin WooCommerce
  • Tải không đồng bộ JavaScript trong WordPress mà không dùng plugin
  • Ngăn JS và CSS tải trên những trang nhất định của WordPress

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.

Làm thế nào để chuyển tất cả JavaScript xuống footer?

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);</p>
<p>   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.

Nếu bạn thích bài viết này, hãy subscribe blog của tôi để thường xuyên cập nhật những bài viết hay nhất, mới nhất qua email nhé. Cảm ơn rất nhiều. :)

  • Chia sẻ lên Facebook
  • Chia sẻ lên Twitter
  • Chia sẻ lên LinkedIn

Bài viết liên quan

Ra mắt plugin APCu Object Cache độc quyền tại WP Căn bản
Ra mắt plugin APCu Object Cache độc quyền tại WP Căn bản
Tính năng Crawl Optimization của plugin Yoast SEO
Tính năng Crawl Optimization của plugin Yoast SEO
Vô hiệu hóa WooCommerce Brands để tăng tốc độ
Vô hiệu hóa WooCommerce Brands để tăng tốc độ

Chuyên mục: Thủ thuật WordPress Thẻ: Tăng tốc WordPress

wpcanban-com-facebook-group

Nói về Trung Hiếu

Một người con của xứ Nghệ, hiện đang sinh sống tại Hà Nội. Tôi là người sáng lập và đứng sau mọi hoạt động của WP Căn bản. Tìm hiểu thêm về tôi tại đây.

Bài viết trước « Sửa lỗi Cannot modify header information trong WordPress
Bài viết sau Hướng dẫn vô hiệu hóa Embed Script trong WordPress »

Reader Interactions

Bình luận

    Để lại một bình luận Hủy

    Tất cả các bình luận đều sẽ được kiểm duyệt nghiêm ngặt. Mọi bình luận trái quy định sử dụng sẽ bị gỡ bỏ link hoặc xóa bỏ hoàn toàn. Vui lòng đọc kỹ quy định trước khi bình luận. Xin cảm ơn!

  1. Lucas Anh 7 bình luậnviết

    31/05/2020 lúc 14:08

    Cảm ơn bạn đã chia sẻ, mình đã thử với con https://zship.vn/ của mình, thấy tốc độ load tăng lên đáng kể

    Bình luận
  2. trần hưng 1 bình luậnviết

    16/03/2018 lúc 22:55

    mình thấy trang này shoop.vn có mấy giao diện khá đẹp tải về miển phí đấy

    Bình luận
  3. Nam 1 bình luậnviết

    26/12/2017 lúc 20:34

    Mình thêm code ở trên bị lỗi. Copy y hết luôn. Không biết code này có dùng được cho mọi theme không nhỉ?

    Bình luận
    • Trung Hiếu Quản lýviết

      28/12/2017 lúc 09:12

      Cụ thể thì nó báo lỗi gì bạn? Có error_log không?

      Bình luận
  4. hongvi 4 bình luậnviết

    08/11/2017 lúc 11:32

    Trang của bạn có 6 tài nguyên CSS chặn.
    có nên chuyển luôn cả css xuống footer ko bạn

    Bình luận
    • Trung Hiếu Quản lýviết

      08/11/2017 lúc 14:17

      Bạn chuyển CSS xuống footer thì cũng không giải quyết được vấn đề này đâu. Phải áp dụng kỹ thuật async mới được. Một trong các plugin hỗ trợ vấn đề này là LiteSpeed Cache, WP Rocket, Autoptimize…

      Bình luận
  5. Lê Thanh Nhã 1 bình luậnviết

    27/09/2017 lúc 08:52

    Đầu tiên, Nhã cảm ơn wpcanban.com đã giúp rất nhiều thông tin trong thời gian Nhã tập tành làm wordpress. Nhã muốn hỏi 2 câu
    1. Cách chèn cách phần nén js & css cộng với remove querry string vào function.php của anh rất ok, Nhã thực hành & kiểm tra trên google insight + pingtools + gmetrix đều tốt, nhưng hình như o thay đổi đối với gia diện cho mobile. Giúp Nhã khắc phục nhe.
    2. Cách chèn cách phần nén js & css cộng với remove querry string vào function.php của anh, sau khi kiểm tra lại dashboard & giao diện web thì nó hiện 2 dòng code đó trên đầu trang. Nhã o giải quyết được ? Nhã vẫn để nguyên tình trạng trên, mong anh vào thanhnha.org coi thử
    Mong anh tư vấn.

    Bình luận
  6. Soju 243 bình luậnviết

    03/04/2017 lúc 00:23

    nghĩa là e phải tắt async rồi mới chèn cái này a nhỉ :P
    http://sv1.upsieutoc.com/2017/04/03/1.png

    Bình luận
    • Trung Hiếu Quản lýviết

      03/04/2017 lúc 07:56

      Thử vừa move to footer vừa async xem có lỗi không? Mình nghĩ là vẫn ok. :P

      Bình luận
  7. Vy Spirit 88 bình luậnviết

    24/03/2017 lúc 20:13

    Mình đã thêm lại code và function.php nhưng ko biết là do mình dùng tính năng nén mà khi view-source vẫn thấy js đã nén ở trên :D
    Nhân tiện nhờ Hiếu đổi giúp mình tên từ “Vy Spirit” sang “Vỹ Spirit” được không nhỉ :D

    Bình luận
    • Trung Hiếu Quản lýviết

      24/03/2017 lúc 21:33

      Không đổi được bạn nhé. Nhiều comments quá rồi, đổi không xuể. :P

      Bình luận
      • Vy Spirit 88 bình luậnviết

        24/03/2017 lúc 21:41

        Mình tưởng đổi 1 lượt được chứ :D do lúc chiều mình cũng nhờ đổi bên canh me rất nhanh. Chắc Hiếu dùng cmt mặc định nên phải đổi từng cái nhỉ :D

        Bình luận
        • Trung Hiếu Quản lýviết

          25/03/2017 lúc 07:53

          Chắc anh Luân cài plugin Find and Replace trong database. :P

          Bình luận
  8. Văn Luận 54 bình luậnviết

    07/03/2017 lúc 21:49

    Đã update lên version mới nhất, nghĩa là đã có phần này rồi đúng k Hiếu?

    Bình luận
    • Trung Hiếu Quản lýviết

      07/03/2017 lúc 22:23

      Đúng rồi bạn. :)

      Bình luận
« 1 2

Sidebar chính

NHẬN BÀI VIẾT QUA EMAIL

Hãy đăng ký ngay để là người đầu tiên nhận được thông báo qua email mỗi khi chúng tôi có bài viết mới. Tặng miễn phí ebook "Bảo mật WordPress toàn tập" do WP Căn bản biên soạn!

Theo dõi qua mạng xã hội

Dịch vụ WordPress Hosting

dich-vu-wordpress-hosting-chat-luong-cao

Bạn đang tìm gì?

WordPress căn bản

Bảo mật WordPress

Tăng tốc WordPress

Sửa lỗi WordPress

Thủ thuật Genesis

Thủ thuật SEO

Thủ thuật CloudFlare

Thủ thuật LiteSpeed

Thủ thuật WooCommerce

Sử dụng theme Paradise

Dịch vụ tối ưu WordPress miễn phí

dich-vu-toi-uu-wordpress-mien-phi

Dịch vụ quét mã độc miễn phí

dich-vu-quet-ma-doc-wordpress-mien-phi

Footer

Bài viết mới nhất

  • Monarx Security được tích hợp vào dịch vụ WordPress Hosting 15/06/2025
  • Hiển thị code trong bài viết của WordPress 07/06/2025
  • Plugin SMTP siêu nhẹ dành cho WordPress 26/05/2025
  • Plugin contact form siêu nhẹ cho WordPress 23/05/2025

Bình luận mới nhất

  • Trung Hiếu trong Monarx Security được tích hợp vào dịch vụ WordPress Hosting
  • TITAN VINA trong Monarx Security được tích hợp vào dịch vụ WordPress Hosting
  • Trung Hiếu trong Monarx Security được tích hợp vào dịch vụ WordPress Hosting
  • TITAN VINA trong Monarx Security được tích hợp vào dịch vụ WordPress Hosting

Thông tin hữu ích

  • Giới thiệu bản thân
  • Quy định sử dụng
  • Chính sách bảo mật
  • Bản quyền nội dung

Thống kê WP Căn bản

9 Chuyên mục - 1.005 Bài viết - 35.545 Bình luận

Bản quyền © 2014 - 2025 · WP Căn bản (tiền thân là eBooksvn.com) · Sử dụng Paradise child theme và dịch vụ WordPress Hosting