7, ], $atts); /* 判断当前分类（分类归档页时高亮对应 Tab） */ $current_cat = ”; if(is_category()){ $current = get_queried_object(); if($current && isset($current->slug)) $current_cat = $current->slug; } /* 获取搜索词（搜索页时回填到输入框） */ $search_term = isset($_GET[‘s’]) ? sanitize_text_field($_GET[‘s’]) : ”; /* 查询参数 */ $paged = max(1, get_query_var(‘paged’)); $args = [ ‘post_type’ => ‘post’, ‘post_status’ => ‘publish’, ‘posts_per_page’ => intval($atts[‘posts_per_page’]), ‘paged’ => $paged, ‘orderby’ => ‘date’, ‘order’ => ‘DESC’, ]; if($current_cat) $args[‘category_name’] = $current_cat; if(is_search() && $search_term) $args[‘s’] = $search_term; $query = new WP_Query($args); /* 分类配置（slug => 显示名） */ $tabs = [ ” => ‘全部’, ‘press’ => ‘新闻稿’, ‘event’ => ‘活动’, ‘conference’ => ‘会议’, ‘media’ => ‘媒体报道’, ‘photo’ => ‘照片’, ‘video’ => ‘视频’, ]; ob_start(); ?>
<style>
.nr-wrap{font-family:'SF Pro SC','SF Pro Display','SF Pro Text',-apple-system,BlinkMacSystemFont,'Helvetica Neue','PingFang SC','Microsoft YaHei',sans-serif;color:#1D1D1F;line-height:1.47;max-width:1024px;margin:0 auto;padding:56px 22px 96px}
.nr-wrap a{color:inherit;text-decoration:none}
.nr-head{margin-bottom:48px}
.nr-head h1{font-size:34px;font-weight:600;letter-spacing:.5px;margin:0 0 6px;color:#1D1D1F}
.nr-head .sub{font-size:17px;color:#86868B;font-weight:400;margin:0}
.nr-tabs{display:flex;gap:8px;flex-wrap:wrap;padding:16px 0 32px;border-bottom:1px solid #f0f0f2;margin-bottom:40px}
.nr-tab{font-size:14px;color:#1D1D1F;padding:8px 16px;border-radius:980px;background:#f5f5f7;transition:all .2s;cursor:pointer;font-weight:400}
.nr-tab:hover{background:#e8e8ed}
.nr-tab.active{background:#1D1D1F;color:#fff}
.nr-search{margin-bottom:40px;position:relative;max-width:340px;display:block}
.nr-search input{width:100%;font-size:17px;font-family:inherit;color:#1D1D1F;padding:12px 16px 12px 44px;border:1px solid #d2d2d7;border-radius:12px;background:#fff;outline:none;transition:border-color .2s}
.nr-search input:focus{border-color:#0066CC}
.nr-search .icon{position:absolute;left:14px;top:50%;transform:translateY(-50%);width:18px;height:18px;opacity:.5;pointer-events:none}
.nr-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
.nr-featured{grid-column:1/-1;margin-bottom:24px}
.nr-featured .nr-card-body{padding:32px 0 0}
.nr-featured .nr-card-title{font-size:28px;line-height:1.2;font-weight:600}
.nr-featured .nr-card-excerpt{font-size:17px;margin-top:10px}
.nr-card{display:flex;flex-direction:column;cursor:pointer}
.nr-card-img-wrap{position:relative;overflow:hidden;border-radius:24px;background:#f5f5f7}
.nr-card-img{aspect-ratio:16/9;width:100%;object-fit:cover;display:block;transition:transform .4s ease}
.nr-card:hover .nr-card-img{transform:scale(1.03)}
.nr-card-body{padding:20px 4px 0}
.nr-card-meta{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.nr-card-cat{font-size:12px;font-weight:700;color:#6A6A6F;letter-spacing:.3px;text-transform:uppercase}
.nr-card-dot{width:3px;height:3px;border-radius:50%;background:#86868B}
.nr-card-date{font-size:12px;color:#86868B;font-weight:400}
.nr-card-title{font-size:17px;font-weight:400;color:#1D1D1F;line-height:1.35;transition:color .2s;margin:0}
.nr-card:hover .nr-card-title{color:#0066CC}
.nr-card-excerpt{font-size:14px;color:#86868B;margin:6px 0 0;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.nr-empty{text-align:center;color:#86868B;padding:80px 0;font-size:17px}
.nr-pagination{display:flex;justify-content:center;gap:8px;margin-top:64px;padding-top:40px;border-top:1px solid #f0f0f2;flex-wrap:wrap}
.nr-pagination a, .nr-pagination span{font-size:14px;color:#0066CC;padding:10px 16px;border-radius:8px;transition:all .2s;font-family:inherit}
.nr-pagination a:hover{background:#f5f5f7}
.nr-pagination .current{background:#1D1D1F;color:#fff}
@media(max-width:735px){
.nr-wrap{padding:40px 16px 64px}
.nr-head h1{font-size:28px}
.nr-grid{grid-template-columns:1fr;gap:32px}
.nr-featured .nr-card-title{font-size:24px}
.nr-featured .nr-card-body{padding:24px 0 0}
}
</style>
<section class="nr-wrap">
<!-- 标题区 -->
<div class="nr-head">
<h1>新闻中心</h1>
<p class="sub">了解寰洋传媒的最新动态、会议活动与媒体报道。</p>
</div>
<!-- 分类 Tab -->
<div class="nr-tabs">
<?php
$is_search_page = is_search();
$is_category_page = is_category();
foreach($tabs as $slug => $name){
if($slug === ''){
$url = home_url('/newsroom');
$active = (!$is_category_page && !$is_search_page) ? ' active' : '';
} else {
$cat_obj = get_category_by_slug($slug);
$url = $cat_obj ? get_category_link($cat_obj->term_id) : '#';
$active = ($current_cat === $slug) ? ' active' : '';
}
echo '<a class="nr-tab'.$active.'" href="'.esc_url($url).'">'.esc_html($name).'</a>';
}
?>
</div>
<!-- 搜索框 -->
<form class="nr-search" action="<?php echo esc_url(home_url('/')); ?>" method="get">
<svg class="icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="11" cy="11" r="7"/><path d="m21 21-4.3-4.3"/></svg>
<input type="text" name="s" value="<?php echo esc_attr($search_term); ?>" placeholder="搜索新闻稿、活动、会议…">
</form>
<!-- 文章网格 -->
<?php
if($query->have_posts()){
echo '<div class="nr-grid">';
$i = 0;
$is_first_page = ($paged == 1 && !$is_category_page && !$is_search_page);
while($query->have_posts()): $query->the_post();
$is_featured = ($i === 0 && $is_first_page);
$cats = get_the_category();
$cat_name = !empty($cats) ? $cats[0]->name : '';
$tag = $is_featured ? 'h2' : 'h3';
?>
<article class="<?php echo $is_featured ? 'nr-featured' : ''; ?>">
<a class="nr-card" href="<?php the_permalink(); ?>">
<div class="nr-card-img-wrap">
<?php
if(has_post_thumbnail()){
the_post_thumbnail('large', ['class' => 'nr-card-img']);
} else {
echo '<img class="nr-card-img" src="data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 16 9%27%3E%3Crect fill=%27%23f5f5f7%27 width=%2716%27 height=%279%27/%3E%3C/svg%3E" alt="">';
}
?>
</div>
<div class="nr-card-body">
<div class="nr-card-meta">
<span class="nr-card-cat"><?php echo esc_html($cat_name); ?></span>
<span class="nr-card-dot"></span>
<span class="nr-card-date"><?php echo get_the_date('Y 年 n 月 j 日'); ?></span>
</div>
<<?php echo $tag; ?> class="nr-card-title"><?php the_title(); ?></<?php echo $tag; ?>>
<p class="nr-card-excerpt"><?php echo wp_trim_words(get_the_excerpt(), 30, '…'); ?></p>
</div>
</a>
</article>
<?php
$i++;
endwhile;
echo '</div>';
/* 分页 */
$pagination = paginate_links([
'total' => $query->max_num_pages,
'current' => $paged,
'prev_text' => '‹ 上一页',
'next_text' => '下一页 ›',
'type' => 'array',
]);
if($pagination){
echo '<nav class="nr-pagination">';
foreach($pagination as $link){
echo $link;
}
echo '</nav>';
}
} else {
echo '<p class="nr-empty">暂无文章</p>';
}
wp_reset_postdata();
?>
</section>
<?php
return ob_get_clean();}
本文中的媒体内容
媒介垂询
