【知更鸟】给知更鸟Begin主题404页面添加文章归档

404页面自定义是每个网站不可以或缺的，不同的网站创意也有所不同。今天我们给begin主题的404页面加一个文章归档，操作很简单。

先上效果图:

具体步骤如下:

第一步、找到文章归档的调用代码

打开begin/pages/template-archieves.php,

<h2 style="margin-top: 3.5rem">  当然，你也可以看看其他精彩内容哟！</h2>
<style type="text/css">
 .year {
 font-size: 16px;
 margin: 10px -21px 10px -21px;
 padding: 0 20px;
 border-bottom: 1px solid #ebebeb;
 border-left: 5px solid #0088cc;
 }
 .mon {
 color: #000;
 line-height: 30px;
 margin: 5px 0 5px 5px;
 cursor: pointer;
 }
 .post_list li {
 line-height: 30px;
 text-indent: 2em;
 }
 .post_list {
 color: #999;
 margin: 0 0 10px 0;
 }
 .mon-num {
 color: #999;
 margin: 0 0 0 10px;
 }
</style>
<?php require get_template_directory() . '/inc/function/archives.php'; ?>
<div class="archives">
 <?php cx_archives_list(); ?>
</div>
<script type="text/javascript">
 $(document).ready(function(){
 (function(){
 $('#all_archives span.mon').each(function(){
 var num=$(this).next().children('li').size();
 var text=$(this).text();
 $(this).html(text+' <span class="mon-num">'+num+' 篇</span>');
 });
 var $al_post_list=$('#all_archives ul.post_list'),
 $al_post_list_f=$('#all_archives ul.post_list:first');
 $al_post_list.hide(1,function(){
 $al_post_list_f.show();
 });
 $('#all_archives span.mon').click(function(){
 $(this).next().slideToggle(400);
 return false;
 });
 })();
 });
</script>

上面代码有增删，有增删，有增删（大家灵活使用）

第二步、编辑404页面

打开begin/404.php，在:

<?php get_search_form(); ?>

后面粘贴第一步复制的代码。这样，功能需求就实现了，赶快来试一试，定制你自己的404页面吧。

感谢您的来访，获取更多精彩文章请收藏本站。