feat(links): align the friends page layout and submit UI

- assemble the friends template with page header, search cover, content position, widget zones and comments
- render the three page title styles and the tabbed search cover
- restore card, category nav and submit modal markup for the friends page
- add page content style support to the page editor
- port the linked card, category nav and submit modal styles to the mobile and desktop breakpoints

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
This commit is contained in:
kate522andClaude Opus 5 committed 2026-11-05 21:09:40 +08:00
1 parent 4c562428b4
commit f53cdd4dc8
7 files changed
+328 -402

No files matched your search

+149 -340
View File
@@ -1,136 +1,96 @@
/**
* Jio 网址导航 — legacy links page shell/styles.
* 友情链接页 — 页面主体、分类导航与提交表单。
*
* @package Jio
*/
/* ---- cards ---- */
.links-cat-header {
.links-page-container {
margin-bottom: 20px;
}
.links-box {
display: flex;
flex-wrap: wrap;
margin: -5px;
}
.links-box.links-style-image {
flex-wrap: wrap;
margin: calc(0px - var(--this-margin, 10px));
margin-bottom: calc(20px - var(--this-margin, 10px));
}
.links-cat-box {
margin-bottom: 20px;
}
.jio-links-submit-status {
margin: 10px 0;
font-size: 0.92em;
}
.jio-links-submit-status.text-success {
color: var(--c-green, #22a06b);
}
.jio-links-submit-status.text-danger {
color: var(--c-red, #ff5473);
}
.jio-links-submit-status.text-muted {
color: var(--muted-2-color);
}
.links-card .avatar-dest {
display: block;
font-style: normal;
}
.link-page-search-cover .page-mask {
background-color: rgba(0, 0, 0, 0.2);
}
/* Category nav sits inside the fixed-wrap column on desktop. */
.links-page-container .links-cat-box .title-theme {
position: relative;
padding-left: 1.2em;
font-size: 15px;
font-weight: 600;
margin-bottom: 6px;
}
.links-page-container .links-cat-header {
padding: 0 15px 10px;
}
.links-box:not(.jio-panel):not(.links-style-simple):not(.links-style-image) {
margin: -5px;
display: flex;
flex-wrap: wrap;
}
.links-box .links-card {
padding: 10px 4px 10px 8px;
min-width: 0;
margin: 5px;
width: calc(50% - 10px);
box-sizing: border-box;
}
.links-style-bigcard {
display: flex;
flex-wrap: wrap;
}
.links-box .links-card.big-card {
padding: 20px 10px 15px;
text-align: center;
}
.links-box:not(.jio-panel) .links-card {
background: var(--main-bg-color, var(--surface-1, #fff));
}
.author-minicard.links-card {
border-radius: 8px;
overflow: hidden;
box-shadow: 0 1px 4px var(--main-shadow, rgba(0, 0, 0, 0.06));
transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.author-minicard.links-card:hover {
transform: translateY(-2px);
box-shadow: 0 4px 14px var(--main-shadow, rgba(0, 0, 0, 0.1));
}
.links-card a {
display: block;
color: inherit;
text-decoration: none;
}
.links-card .list-inline {
display: flex;
align-items: center;
gap: 10px;
.fixed-wrap .link-nav-box .nav {
list-style: none;
margin: 0;
padding: 0;
}
.links-card .list-inline > li {
margin: 0;
}
.link-img {
--this-size: 42px;
width: var(--this-size);
height: var(--this-size);
flex-shrink: 0;
}
.link-img img {
width: 100%;
height: 100%;
object-fit: cover;
border-radius: 4px;
.fixed-wrap .link-nav-box .nav > li {
display: block;
}
.links-card.big-card .link-img {
--this-size: 58px;
margin: 0 auto;
}
.links-card.big-card .link-img img {
border-radius: 100px;
}
.links-style-image {
--link-img-size: 60px;
--this-margin: 10px;
display: flex;
flex-wrap: wrap;
}
.links-style-image .link-img.link-only-img {
margin: var(--this-margin);
--this-size: var(--link-img-size);
}
.links-style-image .link-img.link-only-img img {
border-radius: 8px;
}
/* ---- fixed category nav ---- */
.fixed-wrap .fixed-wrap-nav.jio-panel,
.link-nav-box .jio-panel {
padding: 8px 15px;
}
.fixed-wrap-nav .tab-nav-theme {
border-bottom: none;
padding: 0;
list-style: none;
margin: 0;
}
.link-nav-box .nav > li > a {
.fixed-wrap .link-nav-box .nav > li > a {
display: block;
padding: 6px;
color: var(--muted-2-color, #888);
margin: 1px 0;
font-size: 16px;
color: var(--muted-2-color);
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
text-decoration: none;
}
.link-nav-box .nav > li > a:hover,
.link-nav-box .nav > .active > a {
color: var(--focus-color, var(--color-primary, #f04494));
.fixed-wrap .link-nav-box .nav > li > a:hover {
color: var(--main-color);
}
.fixed-wrap .link-nav-box .nav > li:before {
display: none;
}
.link-nav-submit,
@@ -142,224 +102,7 @@
display: none;
}
.links-page-container .title-theme {
font-weight: 600;
font-size: 1.15em;
margin-bottom: 6px;
}
.jio-links-submit-status {
margin: 10px 0;
font-size: 0.92em;
}
.jio-links-logo-preview {
width: 88px;
height: 88px;
object-fit: cover;
}
/* ---- search cover ---- */
.link-page-search-cover.page-cover {
position: relative;
overflow: hidden;
padding-bottom: calc(25% + 100px);
margin-bottom: 20px;
}
.link-page-search-cover .fit-cover {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
object-fit: cover;
}
.link-page-search-cover .header-slider-search {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
width: min(560px, 92%);
z-index: 2;
}
.link-page-search-cover .tab-nav-theme {
display: flex;
gap: 4px;
list-style: none;
padding: 0;
margin: 0 0 8px;
justify-content: center;
}
.link-page-search-cover .tab-nav-theme li a {
opacity: 0.7;
padding: 0 10px;
color: #fff;
text-decoration: none;
cursor: pointer;
}
.link-page-search-cover .tab-nav-theme li a:hover,
.link-page-search-cover .tab-nav-theme li.active a {
color: #fff;
opacity: 1;
font-weight: 600;
}
.link-page-search-cover .tab-pane {
display: none;
}
.link-page-search-cover .tab-pane.active,
.link-page-search-cover .tab-pane.in.active {
display: block;
}
.link-page-search-cover .line-form {
position: relative;
background: rgba(255, 255, 255, 0.92);
border-radius: 8px;
padding: 8px 12px;
}
.link-page-search-cover .line-form-input {
width: 100%;
border: 0;
background: transparent;
outline: none;
font-size: 15px;
padding: 8px 36px 8px 4px;
}
.link-page-search-cover .abs-right {
position: absolute;
right: 10px;
top: 50%;
transform: translateY(-50%);
}
.link-page-search-cover .abs-right button {
border: 0;
background: transparent;
cursor: pointer;
color: var(--muted-2-color, #666);
}
.link-page-search-cover .header-slider-search-more {
color: #fff;
text-shadow: 0 1px 4px rgba(0, 0, 0, 0.35);
margin-bottom: 8px;
}
/* ---- submit modal ---- */
#submit-links-modal.modal {
position: fixed;
inset: 0;
z-index: 1050;
display: none;
align-items: center;
justify-content: center;
background: rgba(0, 0, 0, 0.45);
padding: 16px;
}
#submit-links-modal.modal.is-open,
#submit-links-modal.modal.show {
display: flex;
}
#submit-links-modal .modal-dialog {
width: min(520px, 100%);
max-height: 90vh;
overflow: auto;
}
#submit-links-modal .modal-content {
background: var(--main-bg-color, #fff);
border-radius: 10px;
box-shadow: 0 10px 40px rgba(0, 0, 0, 0.18);
}
#submit-links-modal .modal-body {
padding: 20px;
}
#submit-links-modal .close {
float: right;
border: 0;
background: transparent;
cursor: pointer;
font-size: 18px;
}
#submit-links-modal .preview-square {
width: 72px;
height: 72px;
border: 1px dashed var(--main-border-color, #ddd);
border-radius: 8px;
overflow: hidden;
display: inline-block;
}
#submit-links-modal .preview-square img {
width: 100%;
height: 100%;
object-fit: cover;
}
#submit-links-modal .hide {
display: none !important;
}
#submit-links-modal .form-control {
width: 100%;
padding: 8px 10px;
border: 1px solid var(--main-border-color, #ddd);
border-radius: 6px;
box-sizing: border-box;
}
#submit-links-modal .row.gutters-5 {
display: flex;
flex-wrap: wrap;
margin: 0 -5px;
}
#submit-links-modal .col-sm-6,
#submit-links-modal .col-sm-12 {
padding: 0 5px;
box-sizing: border-box;
width: 100%;
}
@media (min-width: 576px) {
#submit-links-modal .col-sm-6 {
width: 50%;
}
}
/* ---- responsive grid ---- */
@media (min-width: 992px) {
.links-box .links-card {
width: calc(25% - 10px);
}
.site-layout-1 .links-box .links-card,
.fluid-widget-wrap .links-box .links-card {
width: calc(20% - 10px);
}
.fluid-widget-wrap .links-box.links-style-bigcard .links-card,
.site-layout-1 .links-box.links-style-bigcard .links-card {
width: calc(16.6665% - 10px);
}
.sidebar .links-box .links-card {
width: calc(50% - 10px);
}
@media (min-width: 768px) {
.fixed-wrap {
position: relative;
--fixed-width: 120px;
@@ -374,9 +117,23 @@
margin-left: calc(var(--fixed-width) + 15px);
}
.fixed-wrap > .fixed-wrap-nav ~ .affix-clone {
display: none;
}
.fixed-wrap-nav.affix {
position: sticky;
top: 80px;
position: fixed;
left: auto;
right: auto;
transition: top 0.1s;
}
}
@media (min-width: 992px) {
.links-box .links-card {
width: calc(25% - 10px);
margin: 5px;
box-sizing: border-box;
}
.fixed-wrap .tab-nav-theme.mini-scrollbar {
@@ -395,21 +152,25 @@
margin: 1px 0;
display: block;
font-size: 16px;
color: var(--muted-2-color, #888);
color: var(--muted-2-color);
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.fixed-wrap .tab-nav-theme.mini-scrollbar > li > a:hover {
color: var(--main-color, var(--color-primary));
color: var(--main-color);
}
.fixed-wrap .tab-nav-theme.mini-scrollbar > li.active > a {
color: var(--focus-color, var(--color-primary));
color: var(--focus-color);
font-weight: 500;
background: color-mix(in srgb, var(--focus-color, var(--color-primary)) 12%, transparent);
border-radius: 6px;
background: var(--focus-color-opacity05);
border-radius: var(--mini-radius);
}
.fixed-wrap .tab-nav-theme.mini-scrollbar > li::before {
display: none;
}
.link-nav-submit {
@@ -428,16 +189,21 @@
.link-nav-box > .jio-panel {
background: transparent;
border-radius: 0;
box-shadow: none;
padding: 0;
margin: 0;
}
.link-nav-box:not(.affix) {
margin-bottom: 10px;
}
.link-nav-box .nav {
margin: 0;
display: flex;
gap: 8px;
overflow-x: auto;
margin: 0 0 10px;
padding: 0;
list-style: none;
}
@@ -448,23 +214,66 @@
}
.link-nav-box .nav > li > a {
padding: 2px 6px;
font-size: 1.05em;
padding: 2px;
font-size: 1.2em;
white-space: nowrap;
}
.link-nav-box .nav > li > a:hover,
.link-nav-box .nav > .active > a {
background: 0;
}
}
@media (max-width: 640px) {
.links-box .links-card {
width: calc(50% - 10px);
margin: 5px;
}
.link-page-search-cover .tab-nav-theme li a {
padding: 0 3px;
font-size: 14px;
}
}
@media (max-width: 480px) {
.link-nav-box.affix-bottom,
.link-nav-box.affix {
margin-left: -5px;
margin-right: -5px;
}
.links-page-container .fixed-wrap {
overflow: hidden;
}
}
#submit-links-modal .preview-square {
width: 120px;
height: 120px;
display: block;
border-radius: 4px;
overflow: hidden;
}
#submit-links-modal .preview-square img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
border: 1px dashed var(--main-border-color);
border-radius: 4px;
}
#submit-links-modal .edit-footer {
margin-top: 5px;
}
#submit-links-modal .modal-title .toggle-radius {
width: 24px;
height: 24px;
display: inline-flex;
align-items: center;
justify-content: center;
}
+21 -5
View File
@@ -30,6 +30,18 @@
});
}
function closeModal() {
var modal = document.getElementById('submit-links-modal');
if (!modal) return;
if (window.jQuery) {
window.jQuery(modal).modal('hide');
return;
}
modal.classList.remove('show', 'in', 'is-open');
modal.setAttribute('aria-hidden', 'true');
document.body.classList.remove('modal-open');
}
form.addEventListener('submit', function (event) {
event.preventDefault();
if (button && button.disabled) return;
@@ -70,11 +82,7 @@
if (button) button.disabled = false;
if (button) button.innerHTML = original;
if (captcha) captcha.reset('friend_link', form);
window.setTimeout(function () {
var modal = document.getElementById('submit-links-modal');
if (modal) modal.classList.remove('show', 'is-open');
setStatus('', '');
}, 1800);
window.setTimeout(closeModal, 1800);
}).catch(function (error) {
setStatus(error.message || i18n.error || '提交失败,请重试', 'danger');
if (button) {
@@ -84,4 +92,12 @@
if (captcha) captcha.reset('friend_link', form);
});
});
document.addEventListener('click', function (event) {
var dismiss = event.target.closest('#submit-links-modal [data-dismiss="modal"]');
if (dismiss) {
event.preventDefault();
closeModal();
}
});
})();
+79 -18
View File
@@ -110,7 +110,6 @@ if (!function_exists('jio_links_box')) :
return '';
}
$type = in_array($type, ['card', 'bigcard', 'image', 'simple'], true) ? $type : 'card';
$placeholder = get_template_directory_uri() . '/assets/img/placeholder.svg';
$html = '';
$i = 0;
@@ -151,8 +150,8 @@ if (!function_exists('jio_links_box')) :
$blank = !empty($link['blank']) ? ' target="_blank"' : '';
$dec = !empty($link['desc']) ? (string) $link['desc'] : '';
$rel = $nofollow ? ' rel="nofollow noopener noreferrer"' : ' rel="noopener noreferrer"';
$img_src = $src !== '' ? $src : $placeholder;
$img = '<img' . jio_get_lazy_attr('lazy_other', $img_src, 'avatar') . ' alt="">';
$img_src = $src !== '' ? $src : (function_exists('jio_get_lazy_thumb') ? jio_get_lazy_thumb() : '');
$img = '<img' . jio_get_lazy_attr('lazy_other', $img_src, 'avatar', jio_get_lazy_thumb()) . ' alt="">';
$data_dec = $dec !== ''
? ' title="' . esc_attr($title) . '" data-content="' . esc_attr($dec) . '"'
: ' data-content="' . esc_attr($title) . '"';
@@ -256,7 +255,7 @@ if (!function_exists('jio_page_links_html')) :
$offset_top = $is_mobile ? '-8' : '';
$offset_bottom = $is_mobile ? '20' : '-30';
$links_con = '<div class="fixed-wrap">'
. '<div class="fixed-wrap-nav affix-header-sm affix link-nav-box tab-auto-center-sm" data-offset-top="' . esc_attr((string) $offset_top) . '" data-offset-bottom="' . esc_attr((string) $offset_bottom) . '">'
. '<div class="fixed-wrap-nav affix-header-sm affix link-nav-box tab-auto-center-sm" offset-top="' . esc_attr((string) $offset_top) . '" offset-bottom="' . esc_attr((string) $offset_bottom) . '">'
. '<div class="jio-panel"><ul class="nav list-inline scroll-x mini-scrollbar tab-nav-theme">' . $link_cat_nav . '</ul></div>'
. $submit_nav
. '</div><div class="fixed-wrap-content">' . $link_cat_con . $submit_con . '</div></div>';
@@ -290,9 +289,64 @@ if (!function_exists('jio_page_links_html')) :
}
endif;
if (!function_exists('jio_links_page_header')) :
/**
* Render the links page title using the page header style setting.
*/
function jio_links_page_header(int $post_id = 0): string {
$post_id = $post_id > 0 ? $post_id : (int) get_queried_object_id();
if ($post_id <= 0) {
return '';
}
$meta_style = (string) get_post_meta($post_id, 'page_header_style', true);
if ($meta_style === 'not') {
return '';
}
$style = $meta_style !== ''
? $meta_style
: (class_exists('\Jio\Settings\Settings')
? (string) (\Jio\Settings\Settings::get_other_page_settings()['header_style'] ?? '')
: '');
if (!in_array($style, ['1', '2', '3'], true)) {
return '';
}
$title = (string) get_the_title($post_id);
if ($title === '') {
return '';
}
if ($style === '1') {
return '<div class="box-body notop"><h3 class="title-h-center text-center mt10">' . esc_html($title) . '</h3></div>';
}
if ($style === '2') {
return '<div class="jio-panel"><div><h3 class="title-h-center text-center">' . esc_html($title) . '</h3></div></div>';
}
$img = (string) get_the_post_thumbnail_url($post_id, 'full');
if ($img === '') {
$img = (string) get_post_meta($post_id, 'page_header_cover_img', true);
}
if ($img === '' && class_exists('\Jio\Settings\Settings')) {
$img = (string) (\Jio\Settings\Settings::get_other_page_settings()['header_cover_img'] ?? '');
}
if ($img === '') {
$img = get_template_directory_uri() . '/assets/img/user_t.jpg';
}
$placeholder = function_exists('jio_get_lazy_thumb') ? jio_get_lazy_thumb() : '';
return '<div class="page-cover theme-box radius8 main-shadow">'
. '<img' . jio_get_lazy_attr('lazy_cover', $img, 'fit-cover no-scale', $placeholder) . ' alt="">'
. '<div class="absolute page-mask"></div>'
. '<div class="list-inline box-body abs-center text-center"><div class="title-h-center"><h3>' . esc_html($title) . '</h3></div></div>'
. '</div>';
}
endif;
if (!function_exists('jio_link_get_search_cover')) :
/**
* Search cover with multi-engine tabs (legacy).
* Search cover with multi-engine tabs.
*/
function jio_link_get_search_cover(int $post_id = 0): string {
$post_id = $post_id > 0 ? $post_id : (int) get_queried_object_id();
@@ -344,7 +398,7 @@ if (!function_exists('jio_link_get_search_cover')) :
$cfg = $search_types_args[$k];
$active = $i === 0 ? ' active' : '';
$pane_id = 'link-page-' . $post_id . '-' . $k;
$type_nav .= '<li class="' . esc_attr(trim($active)) . '"><a href="javascript:;" data-jio-tab-target="#' . esc_attr($pane_id) . '">'
$type_nav .= '<li class="' . esc_attr(trim($active)) . '"><a data-toggle="tab" data-target="#' . esc_attr($pane_id) . '" href="javascript:;">'
. esc_html($cfg['name']) . '</a></li>';
$type_con .= '<div class="tab-pane' . ($i === 0 ? ' in active' : '') . '" id="' . esc_attr($pane_id) . '">'
. '<form method="get" target="_blank" class="padding-10 search-form" action="' . esc_url($cfg['url']) . '">'
@@ -376,12 +430,12 @@ if (!function_exists('jio_link_get_search_cover')) :
$img = (string) ($other['header_cover_img'] ?? '');
}
if ($img === '') {
$img = get_template_directory_uri() . '/assets/img/placeholder.svg';
$img = get_template_directory_uri() . '/assets/img/user_t.jpg';
}
$src = get_template_directory_uri() . '/assets/img/placeholder.svg';
$src = function_exists('jio_get_lazy_thumb') ? jio_get_lazy_thumb() : '';
$search = '<div class="header-slider-search abs-center"><div class="header-slider-search-more text-center before">'
. '<div class="em14 font-bold mb10">' . esc_html($title) . '</div></div>'
. '<div class="em14 font-bold mb10">' . esc_html((string) $title) . '</div></div>'
. '<div class="search-input"><div class="flex jc"><ul class="list-inline scroll-x mini-scrollbar tab-nav-theme">' . $type_nav . '</ul></div>'
. '<div class="tab-content">' . $type_con . '</div></div></div>';
@@ -399,17 +453,18 @@ if (!function_exists('jio_submit_links_modal')) :
*/
function jio_submit_links_modal(array $args = [], int $post_id = 0): string {
$defaults = [
'title' => __('申请入驻', 'jio'),
'dec' => '',
'sign' => true,
'cats' => [],
'title' => __('申请入驻', 'jio'),
'dec' => '',
'show_title' => true,
'sign' => true,
'cats' => [],
];
$args = array_merge($defaults, $args);
$post_id = $post_id > 0 ? $post_id : (int) get_queried_object_id();
$title = (string) $args['title'];
$header = $title !== ''
$header = $title !== '' && !empty($args['show_title'])
? '<div class="mb20"><button type="button" class="close" data-dismiss="modal" aria-label="' . esc_attr__('关闭', 'jio') . '">'
. '<i class="fa fas fa-times" aria-hidden="true"></i></button>'
. '<svg class="ic-close" aria-hidden="true"><use xlink:href="#icon-close"></use></svg></button>'
. '<b class="modal-title flex ac"><span class="toggle-radius mr10 b-theme"><i class="fa fas fa-edit" aria-hidden="true"></i></span>'
. esc_html($title) . '</b></div>'
: '';
@@ -423,13 +478,19 @@ if (!function_exists('jio_submit_links_modal')) :
if ($need_login) {
$sign_url = function_exists('jio_get_login_url')
? jio_get_login_url()
: (function_exists('jio_get_sign_page_url') ? jio_get_sign_page_url('login') : wp_login_url());
: (function_exists('jio_get_sign_page_url') ? jio_get_sign_page_url('signin') : wp_login_url());
$registration_open = !class_exists('\Jio\Settings\Settings') || \Jio\Settings\Settings::registration_enabled();
$body .= '<div class="muted-box text-center">';
$body .= '<div class="mb20 muted-3-color">' . esc_html__('请先登录', 'jio') . '</div>';
$body .= '<p><a href="' . esc_url($sign_url) . '" class="signin-loader but c-blue padding-lg">'
. '<i class="fa fas fa-fw fa-sign-in-alt mr10" aria-hidden="true"></i>' . esc_html__('登录', 'jio') . '</a></p>';
. '<i class="fa fas fa-fw fa-sign-in-alt mr10" aria-hidden="true"></i>' . esc_html__('登录', 'jio') . '</a>';
if ($registration_open && function_exists('jio_get_register_url')) {
$body .= '<a href="' . esc_url(jio_get_register_url()) . '" class="signup-loader ml10 but c-yellow padding-lg">'
. '<i class="fa fas fa-fw fa-user-plus mr10" aria-hidden="true"></i>' . esc_html__('注册', 'jio') . '</a>';
}
$body .= '</p>';
if (class_exists('\Jio\Auth\OAuth') && method_exists(\Jio\Auth\OAuth::get_instance(), 'render_social_buttons')) {
$body .= (string) \Jio\Auth\OAuth::get_instance()->render_social_buttons(__('使用以下方式快速登录', 'jio'));
$body .= (string) \Jio\Auth\OAuth::get_instance()->render_social_buttons();
}
$body .= '</div>';
} else {
+16
View File
@@ -242,6 +242,10 @@ class PageAdminSet {
$style = sanitize_key((string) wp_unslash($_POST['page_header_style']));
update_post_meta($post_id, 'page_header_style', in_array($style, ['', 'not', '1', '2', '3'], true) ? $style : '');
}
if (isset($_POST['page_content_style'])) {
$content_style = sanitize_key((string) wp_unslash($_POST['page_content_style']));
update_post_meta($post_id, 'page_content_style', in_array($content_style, ['', 'not', 'nobox', 'full'], true) ? $content_style : '');
}
$register = isset($_POST['widgets_register']) && $_POST['widgets_register'] === '1';
update_post_meta($post_id, 'widgets_register', $register ? '1' : '');
@@ -382,6 +386,18 @@ class PageAdminSet {
'3' => __('封面图样式', 'jio'),
],
];
$inputs[] = [
'name' => __('内容样式', 'jio'),
'id' => 'page_content_style',
'std' => (string) get_post_meta($post_id, 'page_content_style', true),
'type' => 'radio',
'options' => [
'' => __('默认', 'jio'),
'not' => __('不显示', 'jio'),
'nobox' => __('无背景', 'jio'),
'full' => __('全屏无背景', 'jio'),
],
];
$inputs[] = [
'name' => __('模块布局', 'jio'),
'id' => 'widgets_register',
+58 -34
View File
@@ -8,63 +8,87 @@
defined('ABSPATH') || exit;
get_header();
$post_id = (int) get_queried_object_id();
$settings = function_exists('jio_get_page_links_settings') ? jio_get_page_links_settings($post_id) : [];
$links_html = function_exists('jio_page_links_html') ? jio_page_links_html($post_id) : '';
$search_html = function_exists('jio_link_get_search_cover') ? jio_link_get_search_cover($post_id) : '';
$has_sidebar = function_exists('jio_is_show_sidebar') ? jio_is_show_sidebar() : false;
$content_style = sanitize_key((string) get_post_meta($post_id, 'page_content_style', true));
if (!in_array($content_style, ['', 'not', 'nobox', 'full'], true)) {
$content_style = '';
}
$content_style_class = $content_style !== '' ? ' page-content-' . $content_style : ' page-content-default';
get_header();
if (is_active_sidebar('page_top_fluid_' . $post_id)) {
echo '<div class="fluid-widget-wrap">';
dynamic_sidebar('page_top_fluid_' . $post_id);
echo '</div>';
}
if (function_exists('jio_archive_open_shell')) {
jio_archive_open_shell([
'main_class' => 'site-main container page-content-default',
'has_sidebar' => false,
'main_class' => 'site-main container' . $content_style_class,
'has_sidebar' => $has_sidebar,
'page_kind' => 'friends',
]);
}
?>
<div class="content-main content-main--page content-main--friends">
<?php if (is_active_sidebar('page_top_content_' . $post_id)) : ?>
<?php dynamic_sidebar('page_top_content_' . $post_id); ?>
<?php endif; ?>
<?php
get_template_part('templates/parts/page-header', null, [
'title' => esc_html__('友情链接', 'jio'),
'desc' => __('与这些优秀的站点交换友链', 'jio'),
]);
echo $search_html; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped -- helper returns escaped markup.
while (have_posts()) :
the_post();
echo function_exists('jio_links_page_header') ? jio_links_page_header($post_id) : ''; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped -- helper returns escaped markup.
echo function_exists('jio_link_get_search_cover') ? jio_link_get_search_cover($post_id) : ''; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped -- helper returns escaped markup.
if (!empty($settings['content_s']) && ($settings['content_position'] ?? 'top') === 'top') {
echo '<div class="zib-widget mb20"><article class="article content-main__body">';
the_content();
echo '</article></div>';
}
if (($settings['content_position'] ?? 'top') !== 'top') {
echo function_exists('jio_page_links_html') ? jio_page_links_html($post_id) : ''; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped -- helper returns escaped markup.
}
echo $links_html; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped -- helper returns escaped markup.
if (!empty($settings['content_s']) && $content_style !== 'not') {
echo '<div class="jio-panel"><article class="article wp-posts-content">';
the_content();
wp_link_pages([
'before' => '<p class="text-center post-nav-links radius8 padding-6">',
'after' => '</p>',
]);
echo '</article></div>';
}
if (!empty($settings['content_s']) && ($settings['content_position'] ?? 'top') !== 'top') {
echo '<div class="zib-widget mb20"><article class="article content-main__body">';
the_content();
echo '</article></div>';
}
if (!empty($settings['submit_s']) && !empty($settings['submit_title'])) {
printf(
'<p class="text-center" style="margin-top:24px;"><a class="padding-h10 hollow but c-theme btn-block" href="#submit-links-modal" data-toggle="modal">%s</a></p>',
esc_html((string) $settings['submit_title'])
);
}
if (($settings['content_position'] ?? 'top') === 'top') {
echo function_exists('jio_page_links_html') ? jio_page_links_html($post_id) : ''; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped -- helper returns escaped markup.
}
endwhile;
?>
<?php if (is_active_sidebar('page_bottom_content_' . $post_id)) : ?>
<?php dynamic_sidebar('page_bottom_content_' . $post_id); ?>
<?php endif; ?>
<?php comments_template(); ?>
</div>
<?php
if (!empty($settings['submit_s'])) {
echo jio_submit_links_modal([ // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped -- helper returns escaped markup.
'title' => (string) ($settings['submit_title'] ?? ''),
'dec' => (string) ($settings['submit_dec'] ?? ''),
'sign' => !empty($settings['submit_sign_s']),
'cats' => (array) ($settings['submit_cats'] ?? []),
'title' => (string) ($settings['submit_title'] ?? ''),
'dec' => (string) ($settings['submit_dec'] ?? ''),
'show_title' => true,
'sign' => !empty($settings['submit_sign_s']),
'cats' => (array) ($settings['submit_cats'] ?? []),
], $post_id);
}
if (function_exists('jio_archive_close_shell')) {
jio_archive_close_shell(['has_sidebar' => false]);
jio_archive_close_shell(['has_sidebar' => $has_sidebar]);
}
if (is_active_sidebar('page_bottom_fluid_' . $post_id)) {
echo '<div class="fluid-widget-wrap">';
dynamic_sidebar('page_bottom_fluid_' . $post_id);
echo '</div>';
}
get_footer();
@@ -294,7 +294,7 @@ test('the top-nav user popover reproduces the reference quick-login block', () =
// Callers append the block verbatim — no hand-rolled separator or wrapper.
assert.match(header, /render_social_buttons\(__\('快速登录', 'jio'\)\)/);
assert.doesNotMatch(header, /social-separator|social_loginbar/);
assert.match(links, /render_social_buttons\(__\('使用以下方式快速登录', 'jio'\)\)/);
assert.match(links, /render_social_buttons\(\)/);
assert.doesNotMatch(links, /social_loginbar/);
// The retired .social-login-divider / .oauth-row / .oauth-btn markup and its
@@ -53,11 +53,11 @@ test('the user center and public user home keep their legacy rounded-square avat
assert.doesNotMatch(userHome, /\.jio-author-hero__avatar img\s*\{[^}]*--radius-avatar/s);
});
test('link page cards keep their circular logo frames', () => {
const links = read('assets/css/routes/links.css');
test('link page cards keep their legacy logo frames', () => {
const main = read('assets/css/main.css');
assert.match(links, /\.links-card\.big-card \.link-img img\s*\{[^}]*border-radius:\s*100px/s);
assert.match(links, /\.link-img\s*\{[^}]*width:\s*var\(--this-size\)/s);
assert.match(main, /\.links-card\.big-card \.link-img img\s*\{[^}]*border-radius:\s*100px/s);
assert.match(main, /\.link-img img\s*\{[^}]*border-radius:\s*4px/s);
});
test('the user card name row can shrink once the VIP icon joins the badge row', () => {