1️⃣ 要改的文件
- 文件路径:
wp-content/themes/puock/pages/template-archives.php - 我们要把它复制一份,命名为
template-digest.php,然后修改里面的几行。
2️⃣ 复制文件
- 用文件管理器/FTP/主机面板文件管理,进入
wp-content/themes/puock/pages/。 - 复制
template-archives.php,粘贴为template-digest.php。
3️⃣ 修改 template-digest.php(逐行对照)
打开 template-digest.php,按下面修改(只改这几处,其他别动):
| 行号 | 原内容 | 改为 |
|---|---|---|
| 3 | Template Name: 文章归档 |
Template Name: 文摘集(诗篇) |
| 5 | $posts = get_posts('numberposts=-1&orderby=post_date&order=DESC'); |
$posts = get_posts(['numberposts'=>-1,'orderby'=>'post_date','order'=>'DESC','category__in'=>[get_cat_ID('文摘')]]); |
| 26 | <div id="page-archives"> |
<div id="page-digest" class="poetry-digest"> |
| 33–50 整体替换 |
完整替换块(33–50 行)
<div class="poems-list">
<?php foreach ($posts as $post): setup_postdata($post) ?>
<article class="poem-card">
<h3 class="poem-title"><a href="<?php the_permalink() ?>"><?php the_title() ?></a></h3>
<div class="poem-meta"><?php echo get_the_date(); ?> · <?php the_category(', ') ?></div>
<div class="poem-excerpt"><?php echo wp_trim_words(get_the_excerpt(), 30); ?></div>
</article>
<?php endforeach; wp_reset_postdata() ?>
</div>
以上修改依据:原模板结构使用
id="page-archives"和timeline列表 template-archives.php:26-27 ;我们改为独立 ID 与卡片列表,避免样式冲突。
4️⃣ 保存文件
- 保存
template-digest.php并上传到原位置(覆盖)。
5️⃣ 在后台粘贴 CSS(无需编译)
- 进入 WordPress 后台 → 外观 → 自定义 → 附加 CSS。
- 粘贴以下 CSS 并发布:
.poetry-digest {
padding: 2rem 1rem;
background: var(--pk-bg-body);
text-align: center;
}
.poems-list {
max-width: 680px;
margin: 0 auto;
}
.poem-card {
background: var(--pk-bg-box);
padding: 2rem 1.5rem;
margin-bottom: 2rem;
border-radius: 4px;
box-shadow: 0 2px 8px var(--pk-c-block-shadow);
transition: all 0.3s;
position: relative;
text-align: left;
}
.poem-card:hover {
transform: translateY(-3px);
box-shadow: 0 4px 12px var(--pk-c-block-shadow);
}
.poem-card:not(:last-child):after {
content: '❦';
display: block;
text-align: center;
color: var(--pk-c-sub);
margin-top: 2rem;
font-size: 1.2rem;
}
.poem-title {
font-size: 1.5rem;
font-family: Georgia, serif;
margin: 0 0 0.5rem;
}
.poem-title a {
color: var(--pk-c-font);
text-decoration: none;
transition: color 0.3s;
}
.poem-title a:hover {
color: var(--pk-c-primary);
}
.poem-meta {
font-size: 0.85rem;
color: var(--pk-c-sub);
margin-bottom: 1rem;
}
.poem-excerpt {
font-family: Georgia, serif;
line-height: 1.8;
color: var(--pk-c-font);
}
.poem-excerpt::first-letter {
font-size: 2.2em;
float: left;
line-height: 1;
margin-right: 0.1em;
color: var(--pk-c-primary);
}
这些样式只作用于
.poetry-digest内的元素,不会影响其他页面 。
6️⃣ 创建页面并选择模板
- WordPress 后台 → 页面 → 新建页面,标题填“文摘集(诗篇)”。
- 右侧“页面属性 → 模板”下拉,选择“文摘集(诗篇)”。
- 发布页面,即可访问。
正文完