typecho怎么做CSS缓存合并功能
10个月前
为Typecho添加 CSS 缓存合并功能可以减少页面请求的数量,从而提高页面的加载速度。 可以通过下列步骤实现此功能:
1.在主题文件夹下创建一个名为“assets”的文件夹,然后在“assets”文件夹下创建一个“css”文件夹。
2.在“css”文件夹中创建一个名为“style.min.css”的文件,用于保存所有样式文件的合并版本。
修改主题中的header.php文件,添加样式表注入代码。 代码如下:
<?php
// 获取当前主题路径
$themeUrl = $this->options->themeUrl;
?>
<link rel="stylesheet" type="text/css" href="<?php echo $themeUrl; ?>/assets/css/style.min.css" />
创建一个名为“minify.php”的文件,并将其保存在主题的根目录中。 然后将下列代码粘贴到该文件中:
<?php
/**
* 定义Typecho特定的缓存目录
**/
define('__TYPECHO_DEBUG__', true);
/**
* 设置文件根目录
*/
define('ROOT', dirname(__FILE__) . '/');
$baseDir = "assets/css";
$files = array(
"normalize.css",
"main.css",
"animation.css"
);
$content = "";
foreach ($files as $file) {
$content .= file_get_contents(ROOT . $baseDir . "/" . $file);
}
$css = preg_replace("/\s{2,}/", " ", $content);
header("Content-Type: text/css;charset=UTF-8");
echo $css;
?>
修改“minify.php”文件中的$baseDir和$files变量,以便它们指向正确的目录和要合并的样式表文件。 例如,如果你的样式文件位于“assets/css”文件夹下,并且你要合并“normalize.css”、“main.css”和“animation.css”,则修改该文件如下:
$baseDir = "assets/css";
$files = array(
"normalize.css",
"main.css",
"animation.css"
);
在浏览器中访问“minify.php”文件以确保它正常工作。 然后可以尝试在浏览器中打开某个页面以检查是否存在单个合并的样式表文件。
最后,可以将“minify.php”文件添加到主题的functions.php文件中,如下所示:
add_action("wp_enqueue_scripts", function () {
wp_enqueue_style(
"style-minified", // 自定义句柄名称
get_stylesheet_directory_uri() . "/minify.php" // URL 到样式表
);
});
现在,在访问 Typecho 博客时,你将只看到一个合并的样式表文件。
文章来源:https://www.veimoz.com/2038
电脑星人
10个月前 . LV.0
最后一段是 WordPress 的代码吧,Typecho 用不了的?
而且这几段代码前言不搭后语的,前面说要把样式合并到一个 style.min.css 文件持久化成静态文件,然后直接引入 style.min.css;后面又换了方案改成 minify.php 直出 CSS,然后引入这个 PHP 文件来动态加载合成后的 CSS。
感觉像是用 GPT 写的…
寻梦xunm
10个月前 . LV.0
@电脑星人
我也是转载的文章,具体代码什么的没有具体研究,等有空修复一下。