Begin主题给404页面加文章归档

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

先上效果图

Begin主题给404页面加文章归档

 

 

具体步骤如下

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

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

  1. <h2>  当然，你也可以看看其他精彩内容哟！</h2>
  2.                     <br>
  3.                     <style type="text/css">
  4.                         .year {
  5.                             font-size: 16px;
  6.                             margin: 10px -21px 10px -21px;
  7.                             padding: 0 20px;
  8.                             border-bottom: 1px solid #ebebeb;
  9.                             border-left: 5px solid #0088cc;
  10.                         }
  11.                         .mon {
  12.                             color: #000;
  13.                             line-height: 30px;
  14.                             margin: 5px 0 5px 5px;
  15.                             cursor: pointer;
  16.                         }
  17.                         .post_list li {
  18.                             line-height: 30px;
  19.                             text-indent: 2em;
  20.                         }
  21.                         .post_list {
  22.                             color: #999;
  23.                             margin: 0 0 10px 0;
  24.                         }
  25.                         .mon-num {
  26.                             color: #999;
  27.                             margin: 0 0 0 10px;
  28.                         }
  29.                     </style>
  30.                     <?php require get_template_directory() . '/inc/function/archives.php'; ?>
  31.                     <div class="archives">
  32.                         <?php cx_archives_list(); ?>
  33.                     </div>
  34.                     <script type="text/javascript">
  35.                         $(document).ready(function(){
  36.                             (function(){
  37.                                 $('#all_archives span.mon').each(function(){
  38.                                     var num=$(this).next().children('li').size();
  39.                                     var text=$(this).text();
  40.                                     $(this).html(text+' <span class="mon-num">'+num+' 篇</span>');
  41.                                 });
  42.                                 var $al_post_list=$('#all_archives ul.post_list'),
  43.                                     $al_post_list_f=$('#all_archives ul.post_list:first');
  44.                                 $al_post_list.hide(1,function(){
  45.                                     $al_post_list_f.show();
  46.                                 });
  47.                                 $('#all_archives span.mon').click(function(){
  48.                                     $(this).next().slideToggle(400);
  49.                                     return false;
  50.                                 });
  51.                             })();
  52.                         });
  53.                     </script>

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

 

第二步、编辑404页面

打开begin/404.php，在

  1. <?php get_search_form(); ?>

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