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
hosting-tot-nhat-danh-cho-wordpress

Loại bỏ Jetpack CSS không cần thiết ra khỏi website WordPress

Trung Hiếu 51 Bình luận

Mục lục Hiện

Loại bỏ Jetpack CSS không cần thiết ra khỏi website WordPress giúp giảm page-size và tăng tốc độ load.

loai-bo-jetpack-css-khoi-website-wordpress

Như các bạn đã biết, Jetpack là một trong những plugin đa năng giúp tích hợp rất nhiều tính năng hữu ích vào website WordPress. WP Căn bản đã có hẳn 1 serie để hướng dẫn cách sử dụng plugin Jetpack với những module phổ biến nhất. Và cũng chính vì đa năng nên Jetpack khá cồng kềnh, nặng nề, đặc biệt là khi bạn không biết cách tắt những module không dùng đến. Mà kể cả khi bạn tắt bớt những module không sử dụng thì Jetpack vẫn làm dung lượng CSS của website tăng lên khá nhiều. Tại sao vậy?

Tham khảo thêm:

Tại sao bạn cần loại bỏ Jetpack CSS?

Không chỉ trang bị các file CSS riêng rẽ cho từng module, Jetpack còn gộp chúng vào chung một file và load trực tiếp trên front-end. Do đó, ngay cả khi bạn đã tắt module thì CSS của nó vẫn hiện diện trên website. Vì vậy, tất nhiên rồi, việc của chúng ta bây giờ là ngay lập tức loại bỏ file CSS “bự con” này của Jetpack giúp giảm page-size, số request và làm website load nhanh hơn.

Làm thế nào để loại bỏ Jetpack CSS?

Đối với Jetpack 6.9 trở về sau

Rất đơn giản! Tất cả những gì bạn cần làm là chèn đoạn code sau đây vào cuối file functions.php của theme (hoặc child theme) mà bạn đang sử dụng.

add_filter( 'jetpack_sharing_counts', '__return_false', 99 );
add_filter( 'jetpack_implode_frontend_css', '__return_false', 99 );

Đối với Jetpack 6.8.1 trở về trước

Nếu bạn đang sử dụng Jetpack phiên bản cũ (từ 6.8.1 trở về trước), hãy thay thế bằng code sau đây. Nhớ xóa bớt dòng code tương tứng với từng module mà bạn đang sử dụng để giữ lại chúng.

//* First, make sure Jetpack doesn't concatenate all its CSS
add_filter( 'jetpack_implode_frontend_css', '__return_false' );
//* Then, remove each CSS file, one at a time
function jeherve_remove_all_jp_css() {
  wp_deregister_style( 'AtD_style' ); // After the Deadline
  wp_deregister_style( 'jetpack_likes' ); // Likes
  wp_deregister_style( 'jetpack_related-posts' ); //Related Posts
  wp_deregister_style( 'jetpack-carousel' ); // Carousel
  wp_deregister_style( 'grunion.css' ); // Grunion contact form
  wp_deregister_style( 'the-neverending-homepage' ); // Infinite Scroll
  wp_deregister_style( 'infinity-twentyten' ); // Infinite Scroll - Twentyten Theme
  wp_deregister_style( 'infinity-twentyeleven' ); // Infinite Scroll - Twentyeleven Theme
  wp_deregister_style( 'infinity-twentytwelve' ); // Infinite Scroll - Twentytwelve Theme
  wp_deregister_style( 'noticons' ); // Notes
  wp_deregister_style( 'post-by-email' ); // Post by Email
  wp_deregister_style( 'publicize' ); // Publicize
  wp_deregister_style( 'sharedaddy' ); // Sharedaddy
  wp_deregister_style( 'sharing' ); // Sharedaddy Sharing
  wp_deregister_style( 'stats_reports_css' ); // Stats
  wp_deregister_style( 'jetpack-widgets' ); // Widgets
  wp_deregister_style( 'jetpack-slideshow' ); // Slideshows
  wp_deregister_style( 'presentations' ); // Presentation shortcode
  wp_deregister_style( 'jetpack-subscriptions' ); // Subscriptions
  wp_deregister_style( 'tiled-gallery' ); // Tiled Galleries
  wp_deregister_style( 'widget-conditions' ); // Widget Visibility
  wp_deregister_style( 'jetpack_display_posts_widget' ); // Display Posts Widget
  wp_deregister_style( 'gravatar-profile-widget' ); // Gravatar Widget
  wp_deregister_style( 'widget-grid-and-list' ); // Top Posts widget
  wp_deregister_style( 'jetpack-widgets' ); // Widgets
}
add_action('wp_print_styles', 'jeherve_remove_all_jp_css' );

Nếu bạn không biết làm thế nào để mở file functions.php hoặc đơn giản là sợ làm lỗi theme thì có thể tham khảo bài viết “Tạo file functions.php để chèn code tùy biến WordPress“.

Cuối cùng, xóa cache website (và cache CSS, JS nếu có) rồi kiểm tra kết quả bằng các công cụ như GTmetrix hay Pingdom (xem page-size). Thật đơn giản phải không nào? Chúc các bạn thành công!

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. :)

Đang tải đánh giá...

Bài viết liên quan

Ra mắt plugin Hybrid Object Cache độc quyền tại WP Căn bản
Ra mắt plugin Hybrid 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
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

Reader Interactions

Bình luận

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

    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!

  2. Web của mình là joomla giờ có cách nào chuyển qua WP ko bạn, web cổ từ ngày xưa bạn xem hộ mình với. Xin cảm ơn!
    http://www.suachuadiennuocvn.com/

    Bình luận

    • Chỉ có nước code lại trên WP rồi chuyển data sang thôi. Site e cũng trước là joomla và giờ là WP đó ạ.

      Bình luận

  3. Mình đã tắt Jetpack, cài Rocket và cài cả nén xử lý database nhưng ko hiểu sao web vẫn tăng lên về dung lượng và chậm dần…https://bmwcenter.com.vn/

    Bình luận

  7. Dear anh Trung Hiếu.
    em xóa wordpreess trong cpanel rồi cài lại. không biết em bị sai gì mà web của em lại bị hiển thị như bên dưới, em có tìm trên mạng cách khác phục mà mãi không được. anh hướng dẫn giúp em với ạ
    ———————————-
    Index of /index.php
    Name Last modified Size Description
    Parent Directory –
    wordpress/ 2017-12-01 06:11 –

    Bình luận

  10. Mình dùng jetpack với theme Paradise của Hiếu bị dính lỗi không hiển thị hình ảnh trong bài viết mà chưa khắc phục được.

    Bình luận
1 2 3

Footer

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

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

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

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