nanhaoluo/argon-theme
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: 修复 lazyload 懒加载功能无法使用的问题

Browse Source 
- functions.php: 重写 argon_lazyload 函数，使用 data-src 存储原始图片地址
- functions.php: 添加占位图和 lazyload 类，恢复加载动画样式支持
- functions.php: 恢复 argon_enable_lazyload 设置项检查
- argontheme.js: 使用 IntersectionObserver 实现真正的懒加载
- argontheme.js: 支持 fadeIn/slideDown 加载效果和自定义阈值
- header.php: 恢复 lazyload 相关配置项传递给 argonConfig
This commit is contained in:
nanhaoluo
2026-01-16 19:50:14 +08:00
parent 938a33d1e0
commit f25eb17d3e
3 changed files with 148 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

67
functions.php
View File

@@ -2989,11 +2989,64 @@ function get_banner_background_url(){
return $url;
}
}
//原生懒加载：对 <img> 标签添加 loading="lazy" 属性
//懒加载：对 <img> 标签添加懒加载支持
function argon_lazyload($content){
if(!is_feed() && !is_robots() && !is_home()){
// 为没有 loading 属性的图片添加 loading="lazy"
$content = preg_replace('/<img((?!loading=)[^>]*)>/i', '<img$1 loading="lazy">', $content);
if (!is_feed() && !is_robots() && !is_home()) {
$loading_style = get_option('argon_lazyload_loading_style', '1');
// 占位图 base64（用于触发 CSS 加载动画）
$placeholder = 'data:image/svg+xml;base64,PCEtLUFyZ29uTG9hZGluZy0tPg==';
$style_class = ($loading_style !== 'none') ? ' lazyload-style-' . $loading_style : '';
$content = preg_replace_callback(
'/<img\s+([^>]*)>/i',
function($matches) use ($placeholder, $style_class) {
$attrs = $matches[1];
// 如果已有 lazyload 类或 data-src 属性则不处理
if (preg_match('/\bclass\s*=\s*["\'][^"\']*\blazyload\b/i', $attrs) ||
preg_match('/\bdata-src\s*=/i', $attrs)) {
return $matches[0];
}
// 提取 src 属性
if (!preg_match('/\bsrc\s*=\s*["\']([^"\']*)["\']/', $attrs, $src_match)) {
return $matches[0];
}
$original_src = $src_match[1];
// 跳过已经是 base64 的图片
if (strpos($original_src, 'data:image') === 0) {
return $matches[0];
}
// 替换 src 为占位图，添加 data-src 存储原始地址
$new_attrs = preg_replace(
'/\bsrc\s*=\s*["\'][^"\']*["\']/',
'src="' . $placeholder . '" data-src="' . esc_attr($original_src) . '"',
$attrs
);
// 添加 lazyload 类
if (preg_match('/\bclass\s*=\s*["\']([^"\']*)["\']/', $new_attrs, $class_match)) {
$new_class = $class_match[1] . ' lazyload' . $style_class;
$new_attrs = preg_replace(
'/\bclass\s*=\s*["\'][^"\']*["\']/',
'class="' . esc_attr($new_class) . '"',
$new_attrs
);
} else {
$new_attrs .= ' class="lazyload' . $style_class . '"';
}
// 添加 loading="lazy" 作为后备
if (!preg_match('/\bloading\s*=/i', $new_attrs)) {
$new_attrs .= ' loading="lazy"';
}
return '<img ' . $new_attrs . '>';
},
$content
);
}
return $content;
}
@@ -3004,8 +3057,10 @@ function argon_fancybox($content){
return $content;
}
function the_content_filter($content){
// 始终使用原生懒加载
$content = argon_lazyload($content);
// 根据设置决定是否启用懒加载
if (get_option('argon_enable_lazyload') !== 'false') {
$content = argon_lazyload($content);
}
if (get_option('argon_enable_fancybox') != 'false' && get_option('argon_enable_zoomify') == 'false'){
$content = argon_fancybox($content);
}