Bài Viết

Gỡ CSS và JS Không Cần Thiết Trong WooCommerce Khi Không Phải Trang Cửa Hàng

Đăng vào Tháng 3 14, 2025 bởi admin

14/03/2025

6 Phút đọc

60 Lượt xem

Đánh giá

Khi bạn sử dụng WooCommerce trên WordPress, các tệp CSS và JS của plugin này thường được tải trên mọi trang của website, kể cả các trang không liên quan đến cửa hàng. Điều này không chỉ làm chậm tốc độ tải trang mà còn gây lãng phí tài nguyên máy chủ. Bài viết dưới đây sẽ hướng dẫn bạn cách gỡ bỏ các tệp CSS và JS của WooCommerce trên các trang không phải cửa hàng, giúp cải thiện hiệu suất và tối ưu hóa trang web của bạn.

Tại Sao Nên Gỡ Bỏ CSS và JS Của WooCommerce?

Mặc dù WooCommerce là một plugin mạnh mẽ, nhưng nó sẽ tải một số tệp CSS và JS trên tất cả các trang của website, kể cả các trang không liên quan đến cửa hàng. Điều này không chỉ làm giảm hiệu suất mà còn ảnh hưởng đến thời gian tải trang, điều này rất quan trọng đối với trải nghiệm người dùng và SEO.

Các lý do nên gỡ bỏ CSS và JS của WooCommerce:

Tăng tốc độ tải trang: Việc loại bỏ các tệp không cần thiết giúp giảm thời gian tải trang.
Tiết kiệm tài nguyên hệ thống: Bằng cách không tải các tài nguyên không cần thiết, bạn sẽ tiết kiệm băng thông và tài nguyên máy chủ.
Cải thiện trải nghiệm người dùng: Website tải nhanh hơn, mang đến trải nghiệm người dùng mượt mà và dễ chịu hơn.

Cách Gỡ Bỏ CSS và JS WooCommerce Trên Các Trang Không Liên Quan Đến Cửa Hàng

Để làm điều này, bạn chỉ cần thêm một đoạn mã vào file functions.php của theme WordPress. Đoạn mã dưới đây sẽ giúp bạn gỡ bỏ CSS và JS của WooCommerce khi người dùng truy cập vào các trang không phải cửa hàng.

1. Thêm Mã Vào File `functions.php`

/**
 * Kiểm tra nếu trang hiện tại là một trang WooCommerce.
 */
function is_woocommerce_page() {
    return class_exists( 'WooCommerce' ) && ( is_shop() || is_cart() || is_checkout() || is_account_page() );
}

/**
 * Xóa CSS và JS của WooCommerce khi không phải trang cửa hàng.
 */
add_action( 'template_redirect', 'remove_wc_assets_on_non_shop_pages' );
function remove_wc_assets_on_non_shop_pages() {
    if ( ! is_woocommerce_page() ) {
        // Gỡ bỏ tag generator của WooCommerce
        remove_filter( 'get_the_generator_html', 'wc_generator_tag', 10, 2 );
        remove_filter( 'get_the_generator_xhtml', 'wc_generator_tag', 10, 2 );

        // Hủy tải các script và style của WooCommerce
        remove_action( 'wp_enqueue_scripts', [ WC_Frontend_Scripts::class, 'load_scripts' ] );
        remove_action( 'wp_print_scripts', [ WC_Frontend_Scripts::class, 'localize_printed_scripts' ], 5 );
        remove_action( 'wp_print_footer_scripts', [ WC_Frontend_Scripts::class, 'localize_printed_scripts' ], 5 );

        // Hủy bỏ "Show gallery if JS is disabled"
        remove_action( 'wp_head', 'wc_gallery_noscript' );

        // Gỡ bỏ class của WooCommerce khỏi body
        remove_filter( 'body_class', 'wc_body_class' );
    }
}

/**
 * Điều chỉnh việc tải CSS của WooCommerce.
 */
add_filter( 'woocommerce_enqueue_styles', 'conditionally_enqueue_woocommerce_styles' );
function conditionally_enqueue_woocommerce_styles( $enqueue_styles ) {
    return is_woocommerce_page() ? $enqueue_styles : array();
}

/**
 * Điều kiện tải script WooCommerce.
 */
add_action( 'wp_enqueue_scripts', 'conditionally_enqueue_wc_scripts' );
function conditionally_enqueue_wc_scripts() {
    if ( ! is_woocommerce_page() ) {
        wp_dequeue_style( 'woocommerce-inline' );
    }
}

/**
 * Xóa các action không cần thiết của WooCommerce.
 */
function remove_woocommerce_unwanted_actions() {
    remove_action( 'wp_head', 'wc_gallery_noscript' );
}

/**

* Kiểm tra nếu trang hiện tại là một trang WooCommerce.

function is_woocommerce_page() {

return class_exists( 'WooCommerce' ) && ( is_shop() || is_cart() || is_checkout() || is_account_page() );

}

/**

* Xóa CSS và JS của WooCommerce khi không phải trang cửa hàng.

add_action( 'template_redirect', 'remove_wc_assets_on_non_shop_pages' );

function remove_wc_assets_on_non_shop_pages() {

if ( ! is_woocommerce_page() ) {

// Gỡ bỏ tag generator của WooCommerce

remove_filter( 'get_the_generator_html', 'wc_generator_tag', 10, 2 );

remove_filter( 'get_the_generator_xhtml', 'wc_generator_tag', 10, 2 );

// Hủy tải các script và style của WooCommerce

remove_action( 'wp_enqueue_scripts', [ WC_Frontend_Scripts::class, 'load_scripts' ] );

remove_action( 'wp_print_scripts', [ WC_Frontend_Scripts::class, 'localize_printed_scripts' ], 5 );

remove_action( 'wp_print_footer_scripts', [ WC_Frontend_Scripts::class, 'localize_printed_scripts' ], 5 );

// Hủy bỏ "Show gallery if JS is disabled"

remove_action( 'wp_head', 'wc_gallery_noscript' );

// Gỡ bỏ class của WooCommerce khỏi body

remove_filter( 'body_class', 'wc_body_class' );

}

/**

* Điều chỉnh việc tải CSS của WooCommerce.

add_filter( 'woocommerce_enqueue_styles', 'conditionally_enqueue_woocommerce_styles' );

function conditionally_enqueue_woocommerce_styles( $enqueue_styles ) {

return is_woocommerce_page() ? $enqueue_styles : array();

}

/**

* Điều kiện tải script WooCommerce.

add_action( 'wp_enqueue_scripts', 'conditionally_enqueue_wc_scripts' );

function conditionally_enqueue_wc_scripts() {

if ( ! is_woocommerce_page() ) {

wp_dequeue_style( 'woocommerce-inline' );

}

/**

* Xóa các action không cần thiết của WooCommerce.

function remove_woocommerce_unwanted_actions() {

remove_action( 'wp_head', 'wc_gallery_noscript' );

}

2. Giải Thích Chi Tiết Các Hàm Trong Mã

is_woocommerce_page(): Hàm này kiểm tra xem người dùng có đang ở một trong các trang WooCommerce (cửa hàng, giỏ hàng, thanh toán, tài khoản người dùng) hay không. Nếu có, nó sẽ trả về true, ngược lại sẽ trả về false.

remove_wc_assets_on_non_shop_pages(): Đây là hàm chính giúp xóa các tài nguyên (CSS, JS) không cần thiết của WooCommerce trên các trang không phải là trang WooCommerce. Nó đảm bảo rằng WooCommerce chỉ tải tài nguyên khi cần thiết.

conditionally_enqueue_woocommerce_styles(): Hàm này đảm bảo rằng các tệp CSS của WooCommerce chỉ được tải trên các trang của WooCommerce, giảm thiểu việc tải các tài nguyên không cần thiết.

conditionally_enqueue_wc_scripts(): Hàm này giúp đảm bảo rằng các tệp JS của WooCommerce không được tải trên các trang không phải cửa hàng.

remove_woocommerce_unwanted_actions(): Gỡ bỏ một số actions không cần thiết như wc_gallery_noscript giúp giảm tải các tác vụ không cần thiết trong phần head của trang.

Xem thêm:

Thông báo chính thức: Muathemewpgiare chân thành mong muốn được đồng hành và hỗ trợ tốt nhất cho các khách hàng trong quá trình sử dụng giao diện WordPress. Vì vậy, khi mua những theme wordpress tại chúng tôi, chúng tôi cam kết hỗ trợ quý khách hàng hết sức có thể.

Chúng tôi hiểu rằng sự lựa chọn của quý khách là rất quan trọng. Việc mua source code tại chúng tôi không chỉ giúp đảm bảo chất lượng mà còn nhận được sự hỗ trợ tận tâm từ Muathemewpgiare. Chúng tôi rất mong quý khách cân nhắc kỹ, tránh những rủi ro không đáng có khi mua các source code không rõ nguồn gốc. Chúng tôi luôn sẵn sàng hỗ trợ và đồng hành cùng quý khách. Xin chân thành cảm ơn!

Hướng dẫn thêm tài khoản quản trị viên WordPress qua functions.php

1. Giới thiệu Bạn đang thiết kế website WordPress và cần thêm một tài khoản quản trị viên mới mà không thể truy cập được...
Hướng dẫn mua theme WordPress giá rẻ an toàn, không bị dính mã độc

Trong thời đại số hóa hiện nay, việc sở hữu một website chuyên nghiệp là điều cần thiết cho mọi doanh nghiệp và cá nhân....
Hướng Dẫn Tạo Website WordPress Giá Rẻ Từ A-Z Dành Cho Người Mới Bắt Đầu

Bạn có biết rằng hơn 30% tất cả các trang web sử dụng WordPress không? Nếu bạn đang tìm kiếm cách tạo dựng sự hiện diện trực...
5 Sai Lầm Khi Sử Dụng Plugin Nulled và Cách Tránh Mất Dữ Liệu

Plugin Nulled là phiên bản “hack” của các plugin trả phí, giúp người dùng có thể sử dụng miễn phí những tính năng cao cấp...
10 Mẫu Tiêu Đề SEO Cực Hút Click

Viết tiêu đề SEO như thế nào để người dùng phải nhấp vào bài viết của bạn ngay lập tức?Đây là câu hỏi quan trọng...
Chèn icon trong bài viết SEO là lợi hay hại

Trong quá trình tối ưu nội dung chuẩn SEO, nhiều người viết thường sử dụng icon (emoji, biểu tượng hình ảnh nhỏ) với mong muốn...
Top Những Sai Lầm Khi Viết Tiêu Đề SEO – Tránh Ngay!

Viết tiêu đề sai – Mất top, mất traffic! Tiêu đề là thứ đầu tiên người dùng và Google nhìn thấy. Một tiêu đề sai...
Top 10 Framework JavaScript Phổ Biến Nhất 2025 – Bạn Phù Hợp Với Cái Nào?

Chào bạn, người đang tìm kiếm công cụ phù hợp để phát triển web trong năm 2025! Nếu bạn đang phân vân giữa các framework...
Tự Học JavaScript Từ Con Số 0: Lộ Trình Học, Tài Nguyên, Mẹo Học Dễ Nhớ

Nếu bạn là sinh viên CNTT, hay đơn giản là một người mới bắt đầu học lập trình, thì JavaScript chính là lựa chọn lý...
Tất tần tật về ngôn ngữ lập trình javaScript

Chào mừng bạn đến với bài viết chuyên sâu về JavaScript – ngôn ngữ lập trình không thể thiếu trong mọi trang web hiện đại....
JavaScript SEO: Cách Giúp Website JS Nặng Trình Vẫn Lên Top Google

Khi nói đến việc phát triển website hiện đại, JavaScript đã trở thành công cụ chủ lực. Tuy nhiên, một trong những thách thức lớn...
JavaScript Là Gì? Và Vì Sao Website Thời Nay Không Thể Thiếu Nó?

Nếu ví một trang web là một cơ thể sống, thì HTML là khung xương, CSS là quần áo và ngoại hình, còn JavaScript chính...
Bật tính năng đánh giá sản phẩm WooCommerce chỉ với vài dòng code

Nếu bạn đang sử dụng WooCommerce để xây dựng website bán hàng và muốn bật tính năng đánh giá sản phẩm cho tất cả sản...
Cách Chống Spam Bình Luận Trong WordPress Hiệu Quả Và Chuyên Nghiệp [2025]

Tại sao cần chống spam bình luận trong WordPress? Nếu bạn đang quản lý một website WordPress, chắc hẳn bạn đã từng gặp tình trạng...
Ưu điểm và Nhược điểm của Plugin Nulled WordPress

Trong quá trình xây dựng website bằng WordPress, chắc hẳn bạn đã từng nghe đến cụm từ “plugin nulled WordPress” hay còn gọi là plugin...
Mua Theme WordPress Chính Hãng – Tìm Hiểu Các Loại Theme Hàng Đầu Cho Website Của Bạn

Khi bắt đầu xây dựng một website, việc chọn lựa theme phù hợp là bước đầu tiên cực kỳ quan trọng. Theme không chỉ giúp...