wordpress自定義404頁面
阿新 • • 發佈:2019-02-07
404頁面自定義是每個網站不可以或缺的,不同的網站創意也有所不同。今天我們給begin主題的404頁面加一個文章歸檔,操作很簡單。
先上效果圖
具體步驟如下
第一步、找到文章歸檔的呼叫程式碼
開啟begin/pages/template-archieves.php,
<h2> 當然,你也可以看看其他精彩內容喲!</h2>
<br>
<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: 2 em;
}
.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頁面吧。