feat(frontend): replace lazy loading with zibll lazysizes

This commit is contained in:
kate522 committed 2026-08-18 01:33:38 +08:00
1 parent 02571eecd6
commit 435ee1daa7
78 files changed
+1515 -909

No files matched your search

@@ -70,12 +70,9 @@ $swiper_config = [
<div class="<?php echo esc_attr($slide_classes); ?>"<?php if (!empty($slide['link'])) : ?> data-link="<?php echo esc_url($slide['link']); ?>" data-target="<?php echo esc_attr($link_target); ?>"<?php endif; ?>>
<div class="banner-module__slide-bg">
<?php if (!empty($slide['image'])) : ?>
<img
src="<?php echo esc_url($slide['image']); ?>"
<img<?php echo aksrt_get_lazy_attr('lazy_sider', (string) $slide['image'], 'fit-cover', aksrt_get_lazy_thumb('lg')); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
alt="<?php echo esc_attr($slide['title'] ?: get_bloginfo('name')); ?>"
loading="<?php echo 0 === $index ? 'eager' : 'lazy'; ?>"
decoding="async"
class="fit-cover"
>
<?php else : ?>
<div class="banner-module__slide-fallback"></div>
@@ -23,10 +23,7 @@ $show_dates = !isset($cfg['show_dates']) || !empty($cfg['show_dates']);
if (empty($cat_ids)) return;
// 懒加载配置
$lazy_cfg = class_exists('\AKSRT\Settings\Settings') ? \AKSRT\Settings\Settings::get_lazyload_config() : ['enabled' => false, 'placeholder_url' => ''];
$lazy_on = !empty($lazy_cfg['enabled']);
$placeholder = $lazy_cfg['placeholder_url'] ?: (get_template_directory_uri() . '/assets/img/placeholder.svg');
$placeholder = aksrt_get_lazy_thumb('lg');
// 组装卡片数据
$cards = [];
@@ -84,12 +81,7 @@ if (empty($cards)) return;
<?php if ($show_views && $card['views'] > 0) : ?>
<span class="cat-card__views"><?php echo esc_html(function_exists('aksrt_format_number') ? aksrt_format_number($card['views']) : number_format_i18n($card['views'])); ?></span>
<?php endif; ?>
<?php if ($lazy_on) : ?>
<span class="aksrt-skeleton"></span>
<img class="cat-card__cover aksrt-lazy" data-src="<?php echo esc_url($card['cover']); ?>" src="<?php echo esc_url($placeholder); ?>" alt="<?php echo esc_attr($card['term']->name); ?>">
<?php else : ?>
<img class="cat-card__cover" src="<?php echo esc_url($card['cover']); ?>" alt="<?php echo esc_attr($card['term']->name); ?>">
<?php endif; ?>
<img<?php echo aksrt_get_lazy_attr('lazy_cover', (string) $card['cover'], 'cat-card__cover', $placeholder); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?> alt="<?php echo esc_attr($card['term']->name); ?>">
</div>
<div class="cat-card__info">
<div>
@@ -32,7 +32,7 @@ if (empty($friend_links)) return;
<li>
<a href="<?php echo esc_url($url); ?>" target="_blank" rel="noopener noreferrer external" class="home-module__friend-card">
<?php if ($logo) : ?>
<img src="<?php echo esc_url($logo); ?>" alt="" class="home-module__friend-avatar"<?php echo function_exists('aksrt_lazy_loading') ? aksrt_lazy_loading('other') : ' loading="lazy"'; ?>>
<img<?php echo aksrt_get_lazy_attr('lazy_other', (string) $logo, 'home-module__friend-avatar'); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?> alt="">
<?php endif; ?>
<div class="home-module__friend-meta">
<strong><?php echo esc_html($name); ?></strong>
+13 -11
View File
@@ -377,16 +377,18 @@ if (!empty($hero_banners)) :
}
// Background media (zibll order: video > image).
$s_background = '';
if ($use_video) {
$poster = $image_url !== '' ? ' poster="' . esc_url($image_url) . '"' : '';
$s_background = '<video autoplay loop muted playsinline class="fit-cover radius8" src="' . esc_url($video_url) . '"' . $poster . '></video><div class="absolute"></div>';
} elseif ($image_url !== '') {
$s_background = '<img class="fit-cover radius8' . ($index > 0 ? ' lazyload swiper-lazy' : '') . '"'
. ($index > 0
? ' data-src="' . esc_url($image_url) . '" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7"'
: ' src="' . esc_url($image_url) . '"')
. ' alt="' . esc_attr($img_alt) . '">';
$s_background = '';
if ($use_video) {
if (aksrt_is_lazy('lazy_sider')) {
$poster = $image_url !== '' ? ' data-poster="' . esc_url($image_url) . '"' : '';
$video_src = ' class="fit-cover radius8 lazyload" src="" data-src="' . esc_url($video_url) . '"';
} else {
$poster = $image_url !== '' ? ' poster="' . esc_url($image_url) . '"' : '';
$video_src = ' class="fit-cover radius8" src="' . esc_url($video_url) . '"';
}
$s_background = '<video autoplay loop muted playsinline' . $video_src . $poster . '></video><div class="absolute"></div>';
} elseif ($image_url !== '') {
$s_background = '<img' . aksrt_get_lazy_attr('lazy_sider', $image_url, 'fit-cover radius8', aksrt_get_lazy_thumb('lg')) . ' alt="' . esc_attr($img_alt) . '">';
} else {
continue;
}
@@ -403,7 +405,7 @@ if (!empty($hero_banners)) :
if ($layer_image === '') {
continue;
}
$layer_img = '<img class="radius8 lazyload swiper-lazy" data-src="' . esc_url($layer_image) . '" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" alt="' . esc_attr($img_alt) . '">';
$layer_img = '<img' . aksrt_get_lazy_attr('lazy_sider', $layer_image, 'radius8', aksrt_get_lazy_thumb('lg')) . ' alt="' . esc_attr($img_alt) . '">';
$layer_parallax = isset($layer['parallax']) ? (int) $layer['parallax'] : 0;
$layer_attr = $layer_parallax ? ' data-swiper-parallax="' . $layer_parallax . '%"' : '';
$layer_class = !empty($layer['free_size']) ? ' slide-layer' : '';
@@ -38,7 +38,7 @@ if (empty($items)) return;
?>
<<?php echo esc_attr($card_tag); ?> class="aksrt-highlight-card"<?php echo $card_attrs; ?>>
<?php if ($item_image !== '') : ?>
<img class="aksrt-highlight-card__image" src="<?php echo esc_url($item_image); ?>" alt=""<?php echo function_exists('aksrt_lazy_loading') ? aksrt_lazy_loading('other') : ' loading="lazy"'; ?>>
<img<?php echo aksrt_get_lazy_attr('lazy_other', (string) $item_image, 'aksrt-highlight-card__image'); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?> alt="">
<?php elseif ($item_icon !== '') : ?>
<div class="aksrt-highlight-card__icon"><i class="<?php echo esc_attr($item_icon); ?>"></i></div>
<?php endif; ?>
+1 -1
View File
@@ -57,7 +57,7 @@ if (empty($categories)) {
<a href="<?php echo esc_url($cat_link); ?>" class="home-module__more-link">
<?php if ($cover) : ?>
<div class="home-module__more-cover">
<img src="<?php echo esc_url($cover); ?>" alt=""<?php echo function_exists('aksrt_lazy_loading') ? aksrt_lazy_loading('other') : ' loading="lazy"'; ?>>
<img<?php echo aksrt_get_lazy_attr('lazy_other', (string) $cover); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?> alt="">
</div>
<?php else : ?>
<div class="home-module__more-cover home-module__more-cover--placeholder">
@@ -40,7 +40,7 @@ if (empty($items)) return;
?>
<<?php echo esc_attr($tag); ?> class="aksrt-marquee__item"<?php echo $attrs; ?>>
<?php if ($image !== '') : ?>
<img src="<?php echo esc_url($image); ?>" alt="<?php echo esc_attr($name); ?>"<?php echo function_exists('aksrt_lazy_loading') ? aksrt_lazy_loading('other') : ' loading="lazy"'; ?>>
<img<?php echo aksrt_get_lazy_attr('lazy_other', (string) $image); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?> alt="<?php echo esc_attr($name); ?>">
<?php else : ?>
<span><?php echo esc_html($name); ?></span>
<?php endif; ?>
@@ -36,7 +36,7 @@ if (empty($products)) return;
<a href="<?php echo esc_url($p_url ?: '#'); ?>" class="aksrt-product-card">
<?php if ($p_image !== '') : ?>
<div class="aksrt-product-card__image">
<img src="<?php echo esc_url($p_image); ?>" alt="<?php echo esc_attr($p_title); ?>"<?php echo function_exists('aksrt_lazy_loading') ? aksrt_lazy_loading('other') : ' loading="lazy"'; ?>>
<img<?php echo aksrt_get_lazy_attr('lazy_other', (string) $p_image); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?> alt="<?php echo esc_attr($p_title); ?>">
</div>
<?php endif; ?>
<div class="aksrt-product-card__body">
+1 -1
View File
@@ -65,7 +65,7 @@ if (empty($users)) {
?>
<div class="home-module__user-card">
<a href="<?php echo esc_url($profile); ?>" class="home-module__user-link">
<img src="<?php echo esc_url($avatar); ?>" alt="" class="home-module__user-avatar"<?php echo function_exists('aksrt_lazy_loading') ? aksrt_lazy_loading('other') : ' loading="lazy"'; ?>>
<img<?php echo aksrt_get_lazy_attr('lazy_avatar', (string) $avatar, 'home-module__user-avatar', aksrt_get_lazy_thumb('sm')); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?> alt="">
<strong class="home-module__user-name"><?php echo esc_html($display); ?></strong>
</a>
<?php if ($bio) : ?>