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

fix(posts): repair the load-more skeleton and align it with the reference

Browse Source 
Clicking 加载更多 showed no skeleton at all, and the placeholder shape did
not match the reference theme's post cards.

- Class-name mismatch: pagination.js queried .post-ajax-loader while every
  PHP producer emits .post_ajax_loader, so showSkeleton() never found a
  target and the loader stayed hidden. Accept both spellings.
- Inline display:none on the loader (pagination, comments, widget tab
  panes) outranked .is-loading, so even the correct selector could not
  reveal it. Drop the inline style; the reference uses a bare
  <div class="post_ajax_loader"> and toggles visibility from JS.
- loadNextPage() set indicator.style.display = "flex", which forced the
  .posts-item.card skeleton blocks (inline-block layout) into a single
  row instead of stacking vertically — the visible symptom. Remove those
  inline writes and drive .is-loading from CSS for every surface.
- Scope the hide/show rules on the class itself rather than requiring an
  .ajaxpager ancestor: homepage tab panes, archive streams and comment
  lists sit at three different depths.
- Rebuild aksrt_render_placeholder() on zib_get_post_placeholder's
  structure — list = t1/k1/k2 + two s1, card = t1 item-heading/k2 + two
  s1, thumb wrapped in post-graphic + radius8 item-thumbnail, all carrying
  ajax-item so the loader is not mistaken for a real card.
- Add mini/mini_thumb modes so ContentRenderer::placeholder() stops
  hand-rolling the same markup; normalize its 'lists' arg to 'list'.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
kate522
2026-10-03 15:42:18 +08:00
co-authored by Claude Fable 5
parent 7fc1ac98de
commit 89a9cf24e9
9 changed files with 50 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/WidgetSystem/Renderers/ContentRenderer.php
+7 -7
View File
@@ -60,13 +60,12 @@ final class ContentRenderer {
$count = max(1, (int) ($instance['count'] ?? 6));
if ($style === 'mini') {
$mini_opt = (array) ($instance['mini_opt'] ?? []);
if (in_array('show_thumb', $mini_opt, true)) {
$item = '<div class="posts-mini "><div class="mr10"><div class="item-thumbnail placeholder"></div></div><div class="posts-mini-con flex xx flex1 jsb"><div class="placeholder t1"></div><div class="placeholder s1"></div></div></div>';
return str_repeat($item, $count);
}
return str_repeat('<div class="posts-mini"><div class="placeholder k1"></div></div>', $count);
return aksrt_render_placeholder(
in_array('show_thumb', $mini_opt, true) ? 'mini_thumb' : 'mini',
$count
);
}
return aksrt_render_placeholder($style === 'card' ? 'card' : 'lists', $count);
return aksrt_render_placeholder($style === 'card' ? 'card' : 'list', $count);
}
private static function tab_posts(array $instance, array $context): string {
@@ -92,7 +91,8 @@ final class ContentRenderer {
// Inactive panes load lazily through the REST client on switch.
$body = '<div class="widget-ajaxpager" data-widget-items data-widget="tab_posts" data-instance="' . esc_attr($widget_id) . '" data-page="1" data-segment="' . (int) $index . '" aria-live="polite" aria-busy="false"></div>';
}
$body .= '<div class="post_ajax_loader" style="display:none;">' . self::placeholder($instance) . '</div>';
// 显隐交给 .is-loading，内联 display:none 会让 REST 客户端无法展开骨架。
$body .= '<div class="post_ajax_loader">' . self::placeholder($instance) . '</div>';
$panels .= '<div class="tab-pane fade' . ($selected ? ' active in' : '') . '" id="' . esc_attr($panel_id . '-' . $visible_index) . '" role="tabpanel" aria-labelledby="' . esc_attr($tab_id) . '">' . $body . '</div>';
$visible_index++;
}