网站制作归档页,用于向访客展示内容,还可以向搜索引擎示好。WordPress 归档页的实现方法非常之多,可以插件实现,也可以用php显示的查询数据然后格式化输出。本博改版后就重新修改一下该文,老方法自己都没看懂,现在通过get_posts()
函数获取所有文章,然后格式化输出。
模板代码:
下面是我的模板代码,根据模板不同不能硬套。
<?php
/*
Template Name: Archives
*/
?>
<?php get_header(); ?>
<article class="post archives clearfix">
<?php
$totalposts = get_posts('numberposts=200&offset=0');//获取200篇文章
$yearNum = 0;//初始化
/* 遍历文章,格式化输出 */
foreach($totalposts as $post) :
$dateYear = get_the_time('Y');//获取文章年份
if($dateYear != $yearNum)://文章年份与上一篇不同
echo $yearNumCount==0?'<h2 class="yearNum yeartop">'.$dateYear.'</h2><ul style="display:block">':'</ul><h2 class="yearNum">'.$dateYear.'</h2><ul>';//不同就输出新年份
endif;
$yearNum = $dateYear;
$yearNumCount++;
?>
<li> <?php the_time('m-d') ?> : <a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></li>//格式化输出
<?php endforeach; ?>
</ul>
<?php while(have_posts()) : the_post(); ?>
</article>
<?php comments_template(); ?>
<?php endwhile; ?>
<?php get_footer(); ?>
jQuery脚本
<script>
jQuery(document).ready(function($){
/* 归档页 */
$(".yearNum").on("click", function(){
$(this).next().slideToggle();
$(this).toggleClass("closemenu");
});
});
</script>
CSS样式化
这个看个人喜好来,配合jQuery脚本实现合理的交互逻辑就可以,我自己先隐藏除了当前年份的其他所有文章,然后点击展开
WordPress 归档页面制作
新建页面,模板选择 Archives 即可,内容直接空白
没有评论