纯代码实现WordPress前端html代码压缩优化教程

压缩网站前端代码的好处就不再细说，回顾前几天，boke112 就分享了《WordPress 轻量级优化压缩前端页面提速插件 Autoptimize》，这是插件法实现 WordPress 前端 html 代码压缩优化，对于很多博主站长而言，很多时候都不喜欢使用插件，觉得 WordPress 插件会拖慢站点速度，所以今天就跟大家分享纯代码实现 WordPress 前端 HTML 代码压缩优化的教程。

纯代码实现 WordPress 前端 HTML 代码压缩优化的方法比较简单，只需要将以下代码粘贴到 WordPress 主题目录下的 functions.php 文件的最后一个 ?> 之前即可。

//压缩 WordPress 前端 html 代码
function wp_compress_html(){
function wp_compress_html_main ($buffer){
$initial=strlen($buffer);
$buffer=explode("<!--wp-compress-html-->", $buffer);
$count=count ($buffer);
for ($i = 0; $i <= $count; $i++){
if (stristr($buffer[$i], '<!--wp-compress-html no compression-->')) {
$buffer[$i]=(str_replace("<!--wp-compress-html no compression-->", " ", $buffer[$i]));
} else {
$buffer[$i]=(str_replace("\t", " ", $buffer[$i]));
$buffer[$i]=(str_replace("\n\n", "\n", $buffer[$i]));
$buffer[$i]=(str_replace("\n", "", $buffer[$i]));
$buffer[$i]=(str_replace("\r", "", $buffer[$i]));
while (stristr($buffer[$i], ' ')) {
$buffer[$i]=(str_replace(" ", " ", $buffer[$i]));
}
}
$buffer_out.=$buffer[$i];
}
$final=strlen($buffer_out);
$savings=($initial-$final)/$initial*100;
$savings=round($savings, 2);
$buffer_out.="\n<!--压缩前的大小: $initial bytes; 压缩后的大小: $final bytes; 节约：$savings% -->";
return $buffer_out;
}
//WordPress 后台不压缩
if ( !is_admin() ) {
ob_start("wp_compress_html_main");
}
}
add_action('init', 'wp_compress_html');
//当检测到文章内容中有代码标签时文章内容不会被压缩
function unCompress($content) {
if(preg_match_all('/(crayon-|<\/pre>)/i', $content, $matches)) {
$content = '<!--wp-compress-html--><!--wp-compress-html no compression-->'.$content;
$content.= '<!--wp-compress-html no compression--><!--wp-compress-html-->';
}
return $content;
}
add_filter( "the_content", "unCompress");

以上代码来自于张戈博客

温馨提示：

1、当我们的 WordPress 站点有某些页面或功能出现问题的时候，我们可以按照以下格式来添加标签以避免某些代码被压缩而出错。

<!--wp-compress-html--><!--wp-compress-html no compression-->
此处代码不会被压缩，主要是避免压缩带来的错误，比如 JS 错误
<!--wp-compress-html no compression--><!--wp-compress-html-->

2、本文这个功能只是压缩 WordPress 站点前端的HTML 代码，如果想要压缩 CSS 代码的话，个人建议人工压缩，也就是通过复制主题的 style.css 文件中的 CSS 代码到本站的CSS 代码在线美化与压缩工具，通过美化或压缩，然后再复制粘贴回 style.css 文件即可。

3、以上代码如何在运行过程中出现 Division by zero 错误，请参考『WordPress 前端 HTML 代码压缩出现 Division by zero 错误怎么办？』修正。

本文地址：https://boke112.com/post/3549.html