Jetpack 是一个 WordPress 插件,它为 WordPress 带来了大量功能。您可以根据需要启用这些功能。在撰写本文时,Jetpack 并非根据需要为每个功能包含单独的 CSS 文件,而是将所有 CSS 加载到一个大型合并的样式表中。
我当时正在使用一些 Jetpack 功能,但实际上并不需要任何 CSS。
更新!截至 2019 年 1 月(JetPack 6.9),您需要以下内容(用于 functions.php 或功能插件)
add_filter( 'jetpack_sharing_counts', '__return_false', 99 );
add_filter( 'jetpack_implode_frontend_css', '__return_false', 99 );
出于历史原因,我会保留这段代码,因为这曾经是必需的
// 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' );
感谢 Jon Bellah、TJ Kelly、George Stephanis 和所有帮助过我的其他人。
我怀疑这会随着时间的推移而改变。在我看来,最好的做法是为已启用的功能提供一个合并的样式表,并提供一个可以取消注册的单一命名项。
我希望随着时间的推移,这一点也会改变,Chris。他们只是最近才开始合并 CSS,这让我觉得这是他们逐步走向一个系统的第一步,在这个系统中,合并的文件只包含活动模块的样式。
你好,
仅仅添加过滤器就足够了吗?为什么我应该做其他所有的事情,我在源代码中看不到它们?
此致,
Willem
嗨,Chris,
我也想知道是否只添加过滤器就足够了。
谢谢,Stefan
您需要取消排队其余的样式,因为 Jetpack 插件会排队这些样式,而不是您的主题源代码。
嗨,Galen,你能解释一下吗?当我添加过滤器时,我的源代码中不再有 Jetpack 的 CSS,为什么这还不够?另外,他们只谈到了这个过滤器:https://www.twirlingumbrellas.com/wordpress/remove-deregister-jetpack-contact-form-styles/.
此致,
Willem
这段代码
… 只用于告诉 Jetpack 您不想加载合并的 Jetpack 样式表。相反,它按模块加载 CSS,让您能够随意取消排队各个模块的样式。
听起来您是在说,如果您将
false
传递给jetpack_implode_frontend_css
过滤器,它将不会输出任何 Jetpack 样式,无论是合并的还是其他任何样式。据我了解,这不是它应该的工作方式,也不是我的体验。您是否在任何地方都有这段代码的实际示例?嗨,Galen,
为了理解,有一个过滤器用于“frontend_css”,但在其他 CSS 文件的冗长列表中,我还看到了“stats”之类的文件。但这应该是后端吧?
总之,是的,我的网站上现在只使用了这个过滤器。但我实际上并没有使用太多 Jetpack 功能,但我确实使用了“stats”功能,但那是后端功能。无论如何,如果我访问“stats”页面并查看源代码,我并没有看到任何“stats_reports_css”。
由于过滤器是前端的,而我已经启用了额外的侧边栏小部件模块,所以我现在在网站的前端包含了来自 Jetpack 的 Facebook 小部件。查看源代码,同样没有“jetpack-widgets” CSS 文件。
您想让我做其他测试吗?请告诉我,以便弄清楚这一点。
此致,
Willem
只是想说一下,感谢您链接到我,我很高兴能帮上忙!继续努力奋斗。
您节省了我的时间!谢谢!
嗨,
很棒的列表,但是您重复了这一行
wp_deregister_style( ‘jetpack-widgets’ ); // 小部件
按字母顺序
wp_deregister_style( ‘AtD_style’ ); // After the Deadline
wp_deregister_style( ‘gravatar-profile-widget’ ); // Gravatar 小部件
wp_deregister_style( ‘grunion.css’ ); // Grunion 联系表格
wp_deregister_style( ‘infinity-twentyeleven’ ); // 无限滚动 - Twentyeleven 主题
wp_deregister_style( ‘infinity-twentyten’ ); // 无限滚动 - Twentyten 主题
wp_deregister_style( ‘infinity-twentytwelve’ ); // 无限滚动 - Twentytwelve 主题
wp_deregister_style( ‘jetpack-carousel’ ); // 轮播
wp_deregister_style( ‘jetpack_display_posts_widget’ ); // 显示帖子小部件
wp_deregister_style( ‘jetpack_likes’ ); // 喜欢
wp_deregister_style( ‘jetpack_related-posts’ ); // 相关帖子
wp_deregister_style( ‘jetpack-subscriptions’ ); // 订阅
wp_deregister_style( ‘jetpack-slideshow’ ); // 幻灯片
wp_deregister_style( ‘jetpack-widgets’ ); // 小部件
wp_deregister_style( ‘noticons’ ); // 笔记
wp_deregister_style( ‘post-by-email’ ); // 邮件投稿
wp_deregister_style( ‘presentations’ ); // 演示文稿短代码
wp_deregister_style( ‘publicize’ ); // 推广
wp_deregister_style( ‘sharedaddy’ ); // Sharedaddy
wp_deregister_style( ‘sharing’ ); // Sharedaddy 分享
wp_deregister_style( ‘stats_reports_css’ ); // 统计
wp_deregister_style( ’tiled-gallery’ ); // 平铺式画廊
wp_deregister_style( ‘the-neverending-homepage’ ); // 无限滚动
wp_deregister_style( ‘widget-conditions’ ); // 小部件可见性
wp_deregister_style( ‘widget-grid-and-list’ ); // 最佳帖子小部件
哦哦,Galen。真棒。从 2014 年到现在,节省了我网站很多速度。我应该改成:“太棒了”,对我来说。
厌倦了尝试捕获那个“jetpack_css-css”的排队,去谷歌搜索,找到了这里,谢谢您。(我在 Jetpack 代码中看到了那个“implode_frontend_css”的注释,但天哪,这个列表)
如果您只是将前端 CSS 合并返回 false,就像这样
add_filter( 'jetpack_implode_frontend_css', '__return_false' );
,那么每个 Jetpack 功能的 CSS 都是单独加载的,而不是合并到一个 CSS 文件中。这样,Jetpack 就会只加载与已启用 Jetpack 功能相对应的 CSS 文件!
因此,如果您没有启用太多 Jetpack 功能,只需执行此操作,避免其他添加过滤器方面的麻烦。
PS:实际上,我认为这更像是一个错误,因为即使在合并版本中,Jetpack 也应该只包含其已启用功能的 CSS,而不是每个功能的 CSS。
您能提供删除“wp-content/plugins/jetpack/_inc/social-logos/social-logos.min.css”的代码吗?
我没有确切的代码,但我认为您可以使用
wp_deuque_style
来阻止加载该表:https://codex.wordpress.org/Function_Reference/wp_dequeue_style此代码块的新增内容
wp_deregister_style( ‘jetpack-widget-social-icons-styles’ ); // 社交图标
感谢您的帮助:D
使用它后,我的谷歌页面速度从 66 上升到 75。谢谢!
嗨,感谢您的解决方案。请问应该将它添加到哪里?
要么添加到您的主题的
functions.php
文件中,要么添加到一个自定义插件中。