kate522/wordpress-theme-aksrt
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(widgets): FriendLinks aksrt_links_box + iframe lazy data-src

Browse Source 
Route friend links through shared links_box styles; iframe embeds use
lazyload data-src and pagination.js now hydrates iframe/video lazies.
This commit is contained in:
kate522
2026-07-21 08:59:27 +08:00
parent dff9d7dc1c
commit 8e3b86a21b
3 changed files with 173 additions and 91 deletions
Download Patch File Download Diff File Expand all files Collapse all files
assets/js/core/pagination.js
+46 -42
View File
@@ -275,23 +275,49 @@
});
}
function activateLazyEl(el) {
var src = el.dataset.src;
if (!src) return;
var tag = (el.tagName || "").toLowerCase();
if (tag === "iframe" || tag === "video") {
el.src = src;
el.classList.remove("aksrt-lazy", "lazyload");
el.classList.add("aksrt-loaded", "lazyloaded");
return;
}
// img path with optional skeleton + decode
var tempImg = new Image();
tempImg.onload = function () {
el.src = src;
el.classList.remove("aksrt-lazy", "lazyload");
el.classList.add("aksrt-loaded", "lazyloaded");
var skeleton = el.previousElementSibling;
if (skeleton && skeleton.classList.contains("aksrt-skeleton")) {
skeleton.remove();
}
};
tempImg.onerror = function () {
el.classList.remove("aksrt-lazy", "lazyload");
el.classList.add("aksrt-error");
var skeleton = el.previousElementSibling;
if (skeleton && skeleton.classList.contains("aksrt-skeleton")) {
skeleton.remove();
}
};
tempImg.src = src;
}
function initLazyLoad(root) {
var scope = root || document;
var lazyImages = scope.querySelectorAll("img.aksrt-lazy");
if (!lazyImages.length) return;
// Images + iframes/videos that use data-src (zibll lazyload / aksrt-lazy).
var lazyEls = scope.querySelectorAll(
"img.aksrt-lazy, iframe.aksrt-lazy, iframe.lazyload, video.aksrt-lazy, video.lazyload"
);
if (!lazyEls.length) return;
if (!("IntersectionObserver" in window)) {
lazyImages.forEach(function (img) {
var src = img.dataset.src;
if (src) {
img.src = src;
img.classList.remove("aksrt-lazy");
img.classList.add("aksrt-loaded");
}
var skeleton = img.previousElementSibling;
if (skeleton && skeleton.classList.contains("aksrt-skeleton")) {
skeleton.remove();
}
lazyEls.forEach(function (el) {
activateLazyEl(el);
});
return;
}
@@ -299,43 +325,21 @@
var observer = new IntersectionObserver(function (entries) {
entries.forEach(function (entry) {
if (!entry.isIntersecting) return;
var img = entry.target;
var src = img.dataset.src;
if (!src) {
observer.unobserve(img);
var el = entry.target;
if (!el.dataset.src) {
observer.unobserve(el);
return;
}
var tempImg = new Image();
tempImg.onload = function () {
img.src = src;
img.classList.remove("aksrt-lazy");
img.classList.add("aksrt-loaded");
var skeleton = img.previousElementSibling;
if (skeleton && skeleton.classList.contains("aksrt-skeleton")) {
skeleton.remove();
}
};
tempImg.onerror = function () {
img.classList.remove("aksrt-lazy");
img.classList.add("aksrt-error");
var skeleton = img.previousElementSibling;
if (skeleton && skeleton.classList.contains("aksrt-skeleton")) {
skeleton.remove();
}
};
tempImg.src = src;
observer.unobserve(img);
activateLazyEl(el);
observer.unobserve(el);
});
}, {
rootMargin: "200px 0px",
threshold: 0.01
});
lazyImages.forEach(function (img) {
observer.observe(img);
lazyEls.forEach(function (el) {
observer.observe(el);
});
}
src/AKSRT/Widgets/FriendLinksWidget.php
+83 -46
View File
@@ -1,6 +1,6 @@
<?php
/**
* Friend links / bookmarks widget (settings list + WP bookmarks).
* Friend links / bookmarks widget — routes through aksrt_links_box (zibll parity).
*
* @package AKSRT
*/
@@ -13,62 +13,72 @@ class FriendLinksWidget extends \WP_Widget {
public function __construct() {
parent::__construct('aksrt_friend_links', esc_html__('AKSRT 友情链接', 'aksrt'), [
'description' => esc_html__('显示友情链接（设置项或 WordPress 书签）。', 'aksrt'),
'description' => esc_html__('友情链接：card / bigcard / image / simple（共享 aksrt_links_box）。', 'aksrt'),
'classname' => 'widget_aksrt_friend_links',
]);
}
/**
* @param array<string,mixed> $args
* @param array<string,mixed> $instance
*/
public function widget($args, $instance): void {
echo $args['before_widget']; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
$title = apply_filters('widget_title', (string) ($instance['title'] ?? __('友情链接', 'aksrt')), $instance, $this->id_base);
$show_icon = !empty($instance['show_icon']) || !isset($instance['show_icon']);
$columns = max(1, min(4, (int) ($instance['columns'] ?? 2)));
$source = sanitize_key((string) ($instance['source'] ?? 'settings'));
$go_link = !empty($instance['go_link']);
$limit = max(1, min(100, (int) ($instance['limit'] ?? 24)));
$type = sanitize_key((string) ($instance['type'] ?? 'card'));
if (!in_array($type, ['card', 'bigcard', 'image', 'simple'], true)) {
$type = 'card';
}
$blank = !isset($instance['blank']) || !empty($instance['blank']);
$nofollow = !isset($instance['nofollow']) || !empty($instance['nofollow']);
$show_box = !empty($instance['show_box']) || !isset($instance['show_box']);
if ($title) {
echo $args['before_title'] . esc_html($title) . $args['after_title']; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
}
$links = $this->resolve_links($source, $instance, $limit);
if (!$links) {
$bookmarks = $this->resolve_bookmarks($source, $instance, $limit);
if (!$bookmarks) {
echo function_exists('aksrt_get_widget_null')
? aksrt_get_widget_null(__('暂无友情链接', 'aksrt')) // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
: '<p class="widget-empty">' . esc_html__('暂无友情链接', 'aksrt') . '</p>';
echo $args['after_widget']; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
return;
}
?>
<div class="widget-friend-links" style="--fl-columns:<?php echo (int) $columns; ?>;">
<?php foreach ($links as $link) :
$name = sanitize_text_field((string) ($link['name'] ?? ''));
$url = (string) ($link['url'] ?? '');
$desc = sanitize_text_field((string) ($link['description'] ?? $link['desc'] ?? ''));
$icon = (string) ($link['icon'] ?? $link['image'] ?? '');
if ($name === '' || $url === '') {
$wrap = 'aksrt-friend-links aksrt-bookmark-links links-box style-' . $type . ($show_box ? ' has-box zib-widget' : '');
echo '<div class="' . esc_attr($wrap) . '">';
if (function_exists('aksrt_links_box')) {
echo aksrt_links_box($bookmarks, $type, $nofollow, $go_link, $blank); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
} else {
foreach ($bookmarks as $b) {
$row = (array) $b;
$url = (string) ($row['link_url'] ?? $row['url'] ?? '');
$name = (string) ($row['link_name'] ?? $row['name'] ?? '');
if ($url === '' || $name === '') {
continue;
}
if ($go_link && function_exists('aksrt_go_link')) {
$url = aksrt_go_link($url, true);
}
?>
<a href="<?php echo esc_url($url); ?>" class="widget-friend-links__item" target="_blank" rel="noopener noreferrer" title="<?php echo esc_attr($desc); ?>">
<?php if ($show_icon && $icon !== '') : ?>
<img src="<?php echo esc_url($icon); ?>" alt="" class="widget-friend-links__icon" width="16" height="16" loading="lazy">
<?php endif; ?>
<span class="widget-friend-links__name"><?php echo esc_html($name); ?></span>
</a>
<?php endforeach; ?>
</div>
<?php
echo '<a class="aksrt-friend-links__item" href="' . esc_url($url) . '"' . ($blank ? ' target="_blank" rel="noopener noreferrer"' : '') . '>' . esc_html($name) . '</a>';
}
}
echo '</div>';
echo $args['after_widget']; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
}
/**
* Normalize to get_bookmarks-like objects/arrays for aksrt_links_box.
*
* @param array<string,mixed> $instance
* @return array<int, array<string,string>>
* @return array<int, object|array>
*/
private function resolve_links(string $source, array $instance, int $limit): array {
private function resolve_bookmarks(string $source, array $instance, int $limit): array {
if ($source === 'bookmarks') {
$bm_args = [
'orderby' => sanitize_key((string) ($instance['orderby'] ?? 'name')) ?: 'name',
@@ -76,29 +86,35 @@ class FriendLinksWidget extends \WP_Widget {
'limit' => $limit,
];
$cats = trim((string) ($instance['cats'] ?? ''));
if ($cats !== '') {
if ($cats !== '' && $cats !== 'all') {
$bm_args['category'] = $cats;
}
$out = [];
foreach (get_bookmarks($bm_args) as $b) {
$out[] = [
'name' => (string) $b->link_name,
'url' => (string) $b->link_url,
'description' => (string) $b->link_description,
'icon' => (string) $b->link_image,
];
}
return $out;
return get_bookmarks($bm_args) ?: [];
}
$links = class_exists('\AKSRT\Settings\Settings') ? \AKSRT\Settings\Settings::get_friend_links() : [];
if (!is_array($links) || !$links) {
// Fallback to WP bookmarks when settings empty.
return $this->resolve_links('bookmarks', $instance, $limit);
return $this->resolve_bookmarks('bookmarks', $instance, $limit);
}
return array_slice(array_values($links), 0, $limit);
$out = [];
foreach (array_slice(array_values($links), 0, $limit) as $link) {
if (!is_array($link)) {
continue;
}
$out[] = (object) [
'link_name' => (string) ($link['name'] ?? ''),
'link_url' => (string) ($link['url'] ?? ''),
'link_description' => (string) ($link['description'] ?? $link['desc'] ?? ''),
'link_image' => (string) ($link['icon'] ?? $link['image'] ?? ''),
'link_target' => '_blank',
];
}
return $out;
}
/**
* @param array<string,mixed> $instance
*/
public function form($instance): void {
?>
<p>
@@ -115,8 +131,13 @@ class FriendLinksWidget extends \WP_Widget {
</label>
</p>
<p>
<label><?php esc_html_e('列数:', 'aksrt'); ?>
<input class="tiny-text" type="number" min="1" max="4" name="<?php echo esc_attr($this->get_field_name('columns')); ?>" value="<?php echo esc_attr((string) ((int) ($instance['columns'] ?? 2))); ?>">
<label><?php esc_html_e('样式', 'aksrt'); ?>
<select name="<?php echo esc_attr($this->get_field_name('type')); ?>">
<option value="card" <?php selected(($instance['type'] ?? 'card'), 'card'); ?>><?php esc_html_e('图文卡片', 'aksrt'); ?></option>
<option value="bigcard" <?php selected(($instance['type'] ?? ''), 'bigcard'); ?>><?php esc_html_e('大卡片', 'aksrt'); ?></option>
<option value="image" <?php selected(($instance['type'] ?? ''), 'image'); ?>><?php esc_html_e('图片', 'aksrt'); ?></option>
<option value="simple" <?php selected(($instance['type'] ?? ''), 'simple'); ?>><?php esc_html_e('纯文字', 'aksrt'); ?></option>
</select>
</label>
<label><?php esc_html_e('数量', 'aksrt'); ?>
<input class="tiny-text" type="number" min="1" max="100" name="<?php echo esc_attr($this->get_field_name('limit')); ?>" value="<?php echo esc_attr((string) ((int) ($instance['limit'] ?? 24))); ?>">
@@ -128,23 +149,39 @@ class FriendLinksWidget extends \WP_Widget {
</label>
</p>
<p>
<label><input type="checkbox" name="<?php echo esc_attr($this->get_field_name('show_icon')); ?>" value="1" <?php checked(!empty($instance['show_icon']) || !isset($instance['show_icon'])); ?>> <?php esc_html_e('显示站点图标', 'aksrt'); ?></label><br>
<label><input type="checkbox" name="<?php echo esc_attr($this->get_field_name('go_link')); ?>" value="1" <?php checked(!empty($instance['go_link'])); ?>> <?php esc_html_e('外链跳转页', 'aksrt'); ?></label>
<label><input type="checkbox" name="<?php echo esc_attr($this->get_field_name('blank')); ?>" value="1" <?php checked(!isset($instance['blank']) || !empty($instance['blank'])); ?>> <?php esc_html_e('新窗口', 'aksrt'); ?></label><br>
<label><input type="checkbox" name="<?php echo esc_attr($this->get_field_name('nofollow')); ?>" value="1" <?php checked(!isset($instance['nofollow']) || !empty($instance['nofollow'])); ?>> <?php esc_html_e('nofollow', 'aksrt'); ?></label><br>
<label><input type="checkbox" name="<?php echo esc_attr($this->get_field_name('go_link')); ?>" value="1" <?php checked(!empty($instance['go_link'])); ?>> <?php esc_html_e('外链跳转页', 'aksrt'); ?></label><br>
<label><input type="checkbox" name="<?php echo esc_attr($this->get_field_name('show_box')); ?>" value="1" <?php checked(!isset($instance['show_box']) || !empty($instance['show_box'])); ?>> <?php esc_html_e('外框盒子', 'aksrt'); ?></label>
</p>
<?php
}
/**
* @param array<string,mixed> $new_instance
* @param array<string,mixed> $old_instance
* @return array<string,mixed>
*/
public function update($new_instance, $old_instance): array {
$type = sanitize_key((string) ($new_instance['type'] ?? 'card'));
if (!in_array($type, ['card', 'bigcard', 'image', 'simple'], true)) {
$type = 'card';
}
return [
'title' => sanitize_text_field((string) ($new_instance['title'] ?? '')),
'source' => ($new_instance['source'] ?? '') === 'bookmarks' ? 'bookmarks' : 'settings',
'columns' => max(1, min(4, (int) ($new_instance['columns'] ?? 2))),
'type' => $type,
'limit' => max(1, min(100, (int) ($new_instance['limit'] ?? 24))),
'cats' => sanitize_text_field((string) ($new_instance['cats'] ?? '')),
'show_icon' => !empty($new_instance['show_icon']) ? 1 : 0,
'blank' => !empty($new_instance['blank']) ? 1 : 0,
'nofollow' => !empty($new_instance['nofollow']) ? 1 : 0,
'go_link' => !empty($new_instance['go_link']) ? 1 : 0,
'show_box' => !empty($new_instance['show_box']) ? 1 : 0,
'orderby' => sanitize_key((string) ($new_instance['orderby'] ?? 'name')),
'order' => strtoupper((string) ($new_instance['order'] ?? 'ASC')) === 'DESC' ? 'DESC' : 'ASC',
// Keep legacy keys so old instances don't explode.
'columns' => max(1, min(4, (int) ($new_instance['columns'] ?? 2))),
'show_icon' => !empty($new_instance['show_icon']) ? 1 : 0,
];
}
}
src/AKSRT/Widgets/WidgetIframe.php
+44 -3
View File
@@ -22,9 +22,19 @@ class WidgetIframe extends \WP_Widget {
);
}
/**
* @param array<string,mixed> $args
* @param array<string,mixed> $instance
*/
public function widget($args, $instance): void {
$raw = trim((string) ($instance['url'] ?? ''));
if ($raw === '') {
if (current_user_can('manage_options')) {
echo $args['before_widget']; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
echo '<div class="c-red muted-box mb20"><b>' . esc_html__('超级嵌入：', 'aksrt') . '</b>' .
esc_html__('请配置 URL 或 iframe 代码', 'aksrt') . '</div>';
echo $args['after_widget']; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
}
return;
}
$aspect = max(20, min(300, (int) ($instance['aspect'] ?? 55)));
@@ -55,9 +65,29 @@ class WidgetIframe extends \WP_Widget {
'title' => true,
'sandbox' => true,
'data-src' => true,
'framespacing' => true,
'border' => true,
],
]
);
// Prefer lazy: if iframe has src but no data-src, convert.
if (preg_match('/<iframe\b[^>]*>/i', $iframe_html, $m)
&& stripos($m[0], 'data-src=') === false
&& preg_match('/\ssrc=["\']([^"\']+)["\']/i', $m[0], $sm)
) {
$src = $sm[1];
$tag = preg_replace('/\ssrc=["\'][^"\']*["\']/i', ' src="" data-src="' . esc_url($src) . '"', $m[0], 1);
if (is_string($tag) && stripos($tag, 'lazyload') === false) {
if (preg_match('/\sclass=["\']([^"\']*)["\']/', $tag)) {
$tag = preg_replace('/\sclass=["\']([^"\']*)["\']/', ' class="$1 lazyload aksrt-lazy"', $tag, 1);
} else {
$tag = preg_replace('/^<iframe\b/i', '<iframe class="lazyload aksrt-lazy"', $tag, 1);
}
}
if (is_string($tag)) {
$iframe_html = str_replace($m[0], $tag, $iframe_html);
}
}
} else {
$url = esc_url($raw);
if ($url === '') {
@@ -65,17 +95,23 @@ class WidgetIframe extends \WP_Widget {
return;
}
$fs = $allow_fs ? ' allowfullscreen="allowfullscreen"' : '';
$iframe_html = '<iframe class="aksrt-iframe-el" src="' . $url . '" loading="lazy" frameborder="0"' . $fs . '></iframe>';
// zibll: class="lazyload" + data-src (not immediate src).
$iframe_html = '<iframe class="lazyload aksrt-lazy aksrt-iframe-el" src="" data-src="' . $url . '" loading="lazy" frameborder="0" framespacing="0" border="0"' . $fs . '></iframe>';
}
echo '<div class="aksrt-iframe-embed">';
// zibll shell: mb20 > wp-block-embed is-type-video relative-h radius8 > padding-bottom.
echo '<div class="mb20 aksrt-iframe-embed">';
echo '<div class="wp-block-embed is-type-video relative-h radius8">';
echo '<div class="aksrt-iframe-ratio" style="padding-bottom:' . esc_attr((string) $aspect) . '%">';
echo $iframe_html; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
echo '</div></div>';
echo '</div></div></div>';
echo $args['after_widget']; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
}
/**
* @param array<string,mixed> $instance
*/
public function form($instance): void {
$title = (string) ($instance['title'] ?? '');
$url = (string) ($instance['url'] ?? '');
@@ -102,6 +138,11 @@ class WidgetIframe extends \WP_Widget {
<?php
}
/**
* @param array<string,mixed> $new_instance
* @param array<string,mixed> $old_instance
* @return array<string,mixed>
*/
public function update($new_instance, $old_instance): array {
return [
'title' => sanitize_text_field((string) ($new_instance['title'] ?? '')),