WooCommerce 在每个页面上加载三个核心 CSS 样式表,并在 WordPress 站点上安装时发布。可以通过从不需要它的页面和内容中删除样式和脚本来节省一些页面加载时间。它还从用于其功能的库中加载了许多其他 javascript 和 CSS 样式。WordPress 禁用 WooCommerce 购物车片段 AJAX(wc-ajax = getl ( 4 5 w u #_refreshed_fragments)WooCommerce 网站,特别是大型网站,几乎总是会遇到下面的 AJAX 请求的加载时间问题。以下是如何以不同方式加载这些文件,以便它们仅出现在需要的o S i \ V 4 1页面上,从而加快非 WooCV V ` = E , Oommerce 内容的页面加载时间。
- https://domain.com/?wc-ajax=get_refreshed_fragments
即使在我们的小型 WooCommerce 测试网站上,它也比其他任何请求花费z v * c的时间更长,并且不需要,因为它在主页上。在大型网站上,我们已经看到这个账户长达 10 秒的延迟!没错,10 秒。
Woo} \ t : H } & \Commm a J v 3 _ u z ?erce 中的购物车碎片特征和/或 AJAX 请$ , V [ ^ $ & [ |求用于在不刷新页面的情况下更新购物车总量。然而,这绝对是花费和很多次,这取决于你的主题,甚至没有被使用或需要。
可以通过修改/ 5 ` ]主题的 funct3 ( 3 ( R h 9ions.php 文件来解决,有三种选项,自己选择:
- 仅禁用网站首页上的购物车分段
- 仅停用首页和帖子中的购物车分段
- 在除商店页面之外的所有页面上禁用所有 WooCommerce 样式和脚本。
1、在首页禁L O W C G | 0 [ j用购物车碎片
- /** Disable Ajax Call from WooCommerce */
- adv + e # # C \ B Ed_action( 'wp_enqueue_scrY x O qipts', 'deq\ = N F (ueue_woocomme5 * 2 F f F S g |rce_cart_fragments', 11);
- fu/ ] 4 * } k ^ enction dequeuW g g 6 d R Ye_woocommerce_cart_fragments() {z w R; if (is_front_page7 ! O j , 7 K()M 1 4 U ];) wp_dequeue_script~ G h X # M ,('wc4 Z ; ] --cart-fragments'); }
在X _ ] A functions.php 文件添加以上代码。
回到网站后台,打开 WooCommerce>设置 ”菜单,然后转到“ 产品 ”选项卡下的“ 显示 ”部分。启\ Z - D 0 p用“ 添加成功后重定向到购物车页面 ”选项。
2、在首页和文章上禁用购物车碎片
- /** Disable Ajax Call from WooCommerce on front pag{ } 3 a s A j k ye and posts*/
- add_action( 'wp_enqueue_scripts', 'dequeue_wooc, g , d / d 9ommerce_cart_fragmentsR V o p J O', 119 , w d Q \);
- function dequE e a b weue_woocommerce_cart_fragments() {
- if (is_front_page() || is_single() ) wp_dequeue_scrip[ P 5 r M 8 Q H Yt('wc-cart-fragments');
- }
在 fuv n u ; u W w 0 xnctions.php 文件添加以上代码。
3、整个站点范围内禁用所有 WooCom9 g ~ _ * n 6 B cmerce 样式和脚本
- /** Disable All WooCommerce SR 4 9 7 K Rtyles and Scripts Except Shop Pages*/
- add_action( 'wp_en3 L ) w } N 6 Kqueue_scripts', 'dequeue_woocommerce_styles_scripts', 99 );
- function dequeue_woocommerce_styles_scripts(* ; = C _ 9) p a g d j d ,123;
- if ( function_exists( 'is_woocommerce' ) ) {
- if 7 x r &0; ! is_woocod n x W H .mmerce() && ! is_cart() && ! is_checkout() ) {
- # Styles
- wp_dequeue, + [ e @ , 6_style( 'woocommerce-gE K n b 8 l T qeneral' );
- wp_dequeue_style( 'woocommerce-layout' );
- wp_dequeue_style( 'woocommerce-smallscreen' );
- wp_dequeue_style( 'woocomf z |merce_frontend_styles' );
- wp_dequeue_style( 'woocommerce_fancybox_styles' );
- wp_dequeue_style( 'woocom? ( ? 1 % s qmerce_chosen_styI I ( c ; _les' );
- wp_dequeue_styleL $ B i N0; 'woocommerce_prettyPhoto_css' );
- # Scripts
- wp_de{ \ e 1 {queue_u & 3 6 T * o vscript( 'wc_price_slider' );
- wp_dequeue_script( 'wc-single-product' );
- wp_dequc W 2 A D : feue_scrb : / z u W p ?ipt( 'wc-a| k S , , W Bdd-to-cart' );
- ws ? ] T k K r pp_dequeue_script( 'wc-cart-fragments' ) 7 y [ i (1;;
- wp_dequeK b t 1 ( Cue_script( 'wc-checkout'2 % B k c H , );
- wp_dequeut R 6 Q 1 d te_script( 'wc-add-to-cart-variatio% \ yn' );
- wp_P U 9dequeue_script( 'wc-single-product_ ) M q 1 ^ { X e' );
- wp_dequeue_script( 'wc-cart' ` ( | ~ * * 641;q Z T 5 x F & P Y;
- wp_dequeue_script( 'wa s [c-chosenK | \ A 3 q 8' );
- wp_dequeue_script&) F g R [#40; 'woocommerce' + q d j \41;;
- wp_dequeue_script( 'prettyPhoto' );
- wp_dequeue_script( 'prettyPht k 7oto-init' );
- wp_dequeueU h = U q d_script( 'jquery-blockui' );
- wp_dequeue_script( 'jquery-placeholder' );
- wp_dequeue_script( 'fancybox' );
- wp_dequeue_script( 'jqueryui' );
- }
- }
- }
在 functions.php 文件添加以上代码。
如果您正在构建自定义商城主题,这是推荐的过程。删除默认的 WooCommerce 样式表并加载使用自己的样式表,将在 Wo1 7 Q | 5 s 9 !oCommerce 核心更新期间保护样式。如果您想禁用特定的样式表,你可以使用以下代码:
- /**
- * 在主题激活y y 4 \ ] x时设置WooCommerce图像尺寸
- */
- // 逐个删除每个样式
- add_filter( 'woocommerce_enqueue_styles', 'jk_dequeue_styles' );
- function jk_dequeue_styles( $enqueue_styles ) {
- unset( $enqueue_styles['woocommerce-general'] ); // Remove the gloss
- unseN q |t( $enqueue_styles['woocommerce-layout'] ); // Remove the layout
- unset( $enqueue_styles['woocommerce-smallscreen'] ); // Remove the smallscreen optimisatiom ~ } % O 2 U , Tn
- return $enqueui 1 6 d H 2 t , 4e_styles;
- }
然后像l E g _ : ! Q 0 }这样排列你自己的样式表:
- /*r a $ W*
- * 加载自己的样式表
- */
- function wp_enqueue_wooco P A 2ommerce_style&} \ u 3 y P (){
- wp_register_st u y Y Rtyle( 'm\ + p _ytheme-woocommerce', get_tem6 5 p Q e wplate_directory_uri(% Y $ & s ] \ *41; . '/css/woocommerO 5 M \ / E y Cce.css' );
- if (m P e k class_exists( 'woocommerc] p ) ge' : z v41; ) {p H t w g _ E % 5;
- wp_enqueue_style( 'mytheme-woocommerce' );
- }
- }
- add_action2 u p L0; '0 Z M ^ r 7 `wp_= a u C e \ e penqueue_scripts', 'wp_enqueue_woog ( 9 ? n t o i bcommerce_style' );
禁用所有 CSS 样; D } Z 4 t式和 JS 脚本 Woo 提供了一个过滤器L R r / Y , 4,可以删除所有 3 个或单独的一个。
- /**
- * 禁用 WooCommerce 所有的 CSSh 7 7 样式和 JS 脚N - i | Z [本
- */
- add_action( 'template_redirect', 'remove_woocommerce_styles_scripts', 999 );
- function remove_woocommerce_styles_scripts(&* 6 S s X#41; {
- if ( function_exists( 'is_woocommerce'k X 1 ] ! U p l I ) ) {
- if ( ! is_wooc# 5 ( D # A ? - _ommerce() && ! is_cart() &I u ; F 1 ; B& ! is_checkout() ) {
- rei 8 * u emove_action('wp_enqueue_scripts', O - h J . & ) 0 E91;WC_FronN - g k stend_Scripts::class, 'X % 0 ( gload_e X N S 6 u C 0scripts']);
- remove_action('wp_print_scripts', [WC_Frontend_Scripts::class, 'localize_printed_scripts'], 5);
- remove_action('wp_print_footer_scripts', [WC_Frontend_Scr\ E ; @ b _ gipts::class, '7 ! C ] y = ; )localize_printed_scripts'], 5);
- s W O * 75;
- }
- &y i D J#125;
使用这段代码就不需要使用其它代码,在不是 WooCo~ ] S D Q W & @ 8mmerce 的相关页面,购物车和结算的其它页面都将禁用所有 CSS 样式和 JS 脚本,这样对于其它页面的加载速度会有很大的提高。
不要贪心,选择适合自己的一种代码添加就可以了% ; S,不要在 functions.php 文件中同时添加这几个代码。