一般情况下，从客户要求上看我们搭建的网站中并没有刻意去给客户网站安装404错误页面的模板主题页面，而是有时候采用的默认系统自带的。当然如果需要追求效果或者严格度的话，最好是设置通用的404错误页面模板，这样每次制作主题的时候直接统一调用也不错。
这里老蒋有看到来自烽烟博客的ZBLOG PHP自定义通用404错误页面的模板，这里整理过来，后面有需要的时候我也会使用，如果我们有需要的也可以参考。
<!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="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
<title>对不起，页面未找到</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="https://www.yuucn.com/{$host}">返回首页</a>
</div>
</div>
</body>
</html>
以上是代码部分，我们只需要在当前主题的404.php页面更换即可，如果没有这个页面我们需要创建一个。我们可以看下效果。
简洁明了，也有返回首页页面和搜索功能。
脚本版权参考地址：https://www.fengyan.cc/1222.html
声明：本站所有文章，如无特殊说明或标注，均为本站原创发布。任何个人或组织，在未征得本站同意时，禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益，可联系我们进行处理。
评论(0)