防止 CSS 缓存 | CSS-Tricks

WordPress

<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); echo '?' . filemtime( get_stylesheet_directory() . '/style.css'); ?>" type="text/css" media="screen" />

bbPress

<link rel="stylesheet" href="<?php bb_stylesheet_uri(); echo '?' . filemtime( bb_get_active_theme_directory() . '/style.css'); ?>" type="text/css" media="screen" />

添加样式表，其中包含最后更新的时间。如果数字发生变化，浏览器会更新 CSS，而不是使用缓存版本。可以轻松修改为非 WP 特定的。

Agustín Amenabar L. (@baamenabar)

# 2011 年 10 月 27 日

在 WordPress 中，

filemtime(get_bloginfo( 'stylesheet_url' ));

将失败，显然是因为 get_bloginfo('sylesheet_url') 返回绝对路径，这会让 filemtime() 函数感到困惑。

Bernice

# 2011 年 12 月 6 日

我正在尝试将网站迁移到另一台服务器，下载了新公司提供的全部文件，但主题的 CSS 格式全部丢失了（惊人）。找不到网站最初的开发人员，无法找到更改标题大小、链接颜色等的修改位置。你能帮忙吗？求你了。

@lunaroja

# 2011 年 12 月 24 日

还有你的 JS...


<script type="text/javascript" src="<?php echo get_bloginfo('template_directory') . '/js/script.js?' . filemtime( get_stylesheet_directory() . '/js/script.js');?>"></script>

Christian Sciberras

# 2012 年 1 月 16 日

Agustin...相反...它失败是因为它返回了一个相对于文档根目录的路径...

Martin Klasson

# 2012 年 3 月 14 日

我收到一个关于上面示例的“Stat”PHP 错误。
我找到的解决方法是

我使用 dirname(_FILE_) 获取目录路径。不是 URL，而是计算机上的路径。

上面的代码用于我的自定义 CSS 类（我不使用默认 CSS），但当然可以轻松修改以与 stylesheet_url 一起使用。

Murdoc

# 2012 年 4 月 4 日

谢谢，先生！这正是我一直在寻找的！

Iseqqavoq

# 2012 年 12 月 13 日

WordPress 插件库中有一个插件可以自动处理此问题。它会修复样式表和脚本的版本号。WordPress 插件版本。效果非常好。

scott

评论永久链接# 2013 年 5 月 8 日

唯一的问题是它会使你的网站完全空白。卸载了。谢谢你的惊吓。

Mark

# 2013 年 6 月 14 日

这是 Mark 网站上的完全复制粘贴内容，没有任何参考。你只更改了主题并添加了 bbpress 部分...其他所有内容都一样
http://markjaquith.wordpress.com/2009/05/04/force-css-changes-to-go-live-immediately/

mirkolofio

# 2013 年 12 月 25 日

我发布了一个插件，它只是按部就班地工作，它是 WordPress 的 Style.css 加载最新版本插件。

干杯！

Dilyana

评论永久链接# 2017 年 1 月 24 日

在 2017 年，你的插件救了我的命！谢谢！

John

# 2014 年 2 月 13 日

大家好！

对于那些使用 WooThemes Canvas、子主题并希望自动向 custom.css 文件添加版本号的人，以下代码供参考（将其放在你的 functions.php 中）。

在 Pastie.org 上查看

感谢 WooThemes 支持团队的 Tiago Noronha。

干杯！

Kenny

# 2014 年 5 月 6 日

我知道这很老了，但对于 WordPress 来说，在你的 functions.php 文件中，为什么不简单地将 NULL 传递给 wp_enqueue_style 的版本参数？...它会执行相同的操作，而无需将链接硬编码到标题中，如果没有依赖项，也使用 null...

wp_enqueue_style('your-theme', get_template_directory_uri() . '/style.css', NULL, NULL, 'screen');

Kenny

评论永久链接# 2014 年 5 月 6 日

当然，如果你想在开发阶段进行阻止...当你推送到生产环境时，删除 null，版本号将再次出现...
Daniel

评论永久链接# 2014 年 10 月 22 日
对我来说，它没有起作用。而且我不明白为什么应该起作用。如果你将 NULL 传递给版本参数，那么版本永远不会改变，因此你不会强制浏览器重新加载它。

如果我错了，请纠正我。我真的很想更好地理解它是如何工作的。

无论如何，我在 WordPress 中使用了这段代码
```
add_action( 'wp_enqueue_scripts', 'enqueue_child_theme_styles', PHP_INT_MAX);
function enqueue_child_theme_styles() {
    wp_enqueue_style( 'parent-style', get_template_directory_uri().'/style.css' );
    wp_enqueue_style( 'child-style', get_stylesheet_uri(), NULL, filemtime( get_stylesheet_directory() . '/style.css' ) );
}
```
我更喜欢这种方式，而不是 css-tricks 上的原始代码片段，因为它是将子主题样式表包含在 WordPress 中的最佳方法，并结合 filemtime() 来强制浏览器加载 CSS 文件的新版本。我没有对父样式表使用 filemtime()，因为我从不触碰它，因此 filemtime() 只是浪费资源。

干杯！

Brian Holzberger

# 2018 年 5 月 14 日

这里有一个插件 https://wordpress.org/plugins/wp-css-version-history/，它会在样式表中自动追加版本号。它会创建一个新的样式表，该样式表会最后加载。无需清除缓存即可查看更改。使用 WordPress 内置的 CSS 编辑器和用户文件锁定进行团队协作。

WordPress

bbPress

评论

发表评论 取消回复

发表评论取消回复