IT俱乐部-城北日常经验分享

Z-Blog设置自定义404错误页面不显示系统默认的错误后台页

202101-22

浏览: 99232 评论: 0

zblogphp当出现错误或者找不到页面时,默认是出现打不开的页面直接跳转到zblogphp自带的错误页面去了,这个页面对搜索引擎不太友好,而且会暴露出网站的台后及网站文件目录,这样十分不友好.如果是调试需要那可以在调试的时候

网站404页面的目的是告诉浏览者其所请求的页面不存在或链接错误，同时引导用户使用浏览网站的其他页面而不是关闭网页离开。自定义404错误页面是增强用户体验的很好的做法，花时间去设计一个创意的404错误页面是一件非常值得的事情，尽管这个页面被看到的概率很小。

zblogphp当出现错误或者找不到页面时,默认是出现打不开的页面直接跳转到zblogphp自带的错误页面去了,这个页面对搜索引擎不太友好,而且会暴露出网站的台后及网站文件目录,这样十分不友好.如果是调试需要那可以在调试的时候切换回去吧,

下面直接说方法,简单又快捷:直接在自己用的主题目录所在的文件夹下找到template文件夹，在里面新建一个404.php文件，这样就有了404的页面了,当然你不需要这个页要调试的的时候,直接删除这个404.PHP就可以了嘛.

下面送大家一个漂亮的404页的模板.

Z-Blog设置自定义404错误页面不显示系统默认的错误后台页上图的404错误页面是不是很漂亮？那么使用zblog的同学要如何将这个页面添加到自己的网站中呢？首先我们打开主题所在的文件夹下的template文件夹，在里面新建一个404.php文件，然后将以下代码添加的文件中。

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8"/>
    <meta http-equiv="Cache-Control" content="no-transform"/>
    <meta http-equiv="Content-Language" content="{$language}" />
    <meta name="author" content="IT俱乐部 it-club.cn"/> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
    <title>对不起，页面未找到 404</title>
    <style type='text/css'>
    body{font:12px/1.5 'Microsoft Yahei',Simsun;font-size:14px;line-height:1.42857143;color:#333;background:#f5f5f5}
    .wrapper-page{width:420px;margin:7.5% auto;text-align:center}
    .page-ex h1{font-size:98px;line-height:150px;font-weight:700;color:#252932;margin:10px 0;text-shadow:rgba(61,61,61,.3) 1px 1px,rgba(61,61,61,.2) 2px 2px,rgba(61,61,61,.3) 3px 3px}
    .page-ex h2{font-size:30px;color:#505458;line-height:35px;margin:10px 0}
    .page-ex p{font-size:14px;color:#505458;margin:0 0 10px}
    input[type=text]{float:left;width:71%;position:relative;font-size:14px;color:rgba(0,0,0,.6);margin-left:-1px;margin-bottom:0;padding:12px 17px;line-height:1.3333333;background-color:#fafafa;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;-webkit-box-shadow:inset 0 1px 2px rgba(0,0,0,.1);-moz-box-shadow:inset 0 1px 2px rgba(0,0,0,.1);box-shadow:inset 0 1px 2px rgba(0,0,0,.1);border:1px solid #eee;box-shadow:none;outline:0;z-index:2}
    input[type=submit]{width:20%;font-size:16px;font-weight:700;color:#fff;line-height:32px;padding:10px 16px;line-height:1.3333333;border-radius:6px;padding-right:15px;border:2px solid #BDBDBD;background:#BDBDBD;outline:0;cursor:pointer;background-color:#1e88e5;border:1px solid #1e88e5;border-radius:2px;letter-spacing:.2px;opacity:.93;-webkit-box-shadow:0 1px 2px 0 rgba(0,0,0,.1);-moz-box-shadow:0 1px 2px 0 rgba(0,0,0,.1);box-shadow:0 1px 2px 0 rgba(0,0,0,.1);-webkit-transition:all .3s ease-out;-moz-transition:all .3s ease-out;-o-transition:all .3s ease-out;-ms-transition:all .3s ease-out;transition:all .3s ease-out}
    .page-back{background-color:#7e57c2;color:#FFF;letter-spacing:.2px;opacity:.93;display:inline-block;padding:6px 12px;margin-bottom:0;font-size:14px;font-weight:400;line-height:1.42857143;text-align:center;border:1px solid transparent;border-radius:4px;text-decoration:none;-webkit-transition:all .3s ease-out;-moz-transition:all .3s ease-out;-o-transition:all .3s ease-out;-ms-transition:all .3s ease-out;transition:all .3s ease-out}
    .page-back:hover,input[type=submit]:hover{opacity:1;-webkit-box-shadow:0 2px 5px 0 rgba(0,0,0,.16),0 2px 10px 0 rgba(0,0,0,.12);-moz-box-shadow:0 2px 5px 0 rgba(0,0,0,.16),0 2px 10px 0 rgba(0,0,0,.12);box-shadow:0 2px 5px 0 rgba(0,0,0,.16),0 2px 10px 0 rgba(0,0,0,.12)}
    @media only screen and (max-width:767px){.wrapper-page{width:90%}
    }
    @media only screen and (max-width:480px){.wrapper-page{width:90%}
    input[type=text]{width:61%}
    }
    </style>
</head>
<body>
<div class="wrapper-page">
    <div class="page-ex">
        <h1>404!</h1>
        <h2>对不起，页面未找到</h2><br>
        <p>找不到内容？尝试下我们的搜索吧!</p>
        <form name="search" method="post" action="{$host}zb_system/cmd.php?act=search">
	    <input type="text" name="q" size="11"> 
	    <input type="submit" value="搜索">
	</form>
        <br>
        <a class="page-back" href="{$host}">返回首页</a>
    </div>
</div>
</body>
</html>

保存文件后，打开网站后台首页点击[清空缓存并重新编译模板]，然后访问前台页面看下404错误页面的效果吧！

是不是很简单