如果写自己的网站404页面？
本站的建站系统是MIP建站系统，群里面有的人问我怎么修改网站的404页面？ 其实我在好久好久以前写的《mip建站系统如何修改404页面，让网站更加友好》，我看了一下，是告诉大家在哪里修改，但是具体怎么修改，还是有一些人不会。我就把我修改的思路，分享给大家，供大家参考。
本站的建站系统是mip建站系统，群里面有的人问我怎么修改网站的404页面？
其实我在好久好久以前写的《mip建站系统如何修改404页面，让网站更加友好》，我看了一下，是告诉大家在哪里修改，但是具体怎么修改，还是有一些人不会。我就把我修改的思路，分享给大家，供大家参考。
首先，我觉得404的页面目的就是告诉大家，你访问的页面不存在了，可以去首页或者其他页面。
所以我们在设计404页面的时候，最好带上网站的默认的头部和默认的底部。
我们把404页面分成3个部分，头部、底部和中间。
解决思路：
因为本站的404页面，不支持头部文档和底部文档的调用，我们可以复制头部和底部的静态源代码，达到和默认网站页面一样的效果。
中间页面的话，要保留原始代码的，不同的问题，系统会给出是什么问题，所以这样的代码，我们要保留。具体方法如下：
1、头部代码：
方法：右键查看首页的源代码，从第一行，复制到</mip-fixed> <main class="mipcms-main">。简单修改一下标题，然后把默认的css复制我的代码是：
<!DOCTYPE html>
<html mip>
<head>
<meta charset="utf-8">
<meta name="author" content="杨泽业 qq:350379853" />
<meta name="APPlicable-device" content="pc,mobile">
<meta http-equiv="X-UA-compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=0">
<link rel="shortcut icon" href="https://www.olzz.com/favicon.ico" type="image/x-icon" />
<title>404页面！你访问的页面不存在!站长在线404页面！</title>
<link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/4.1.3/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="https://www.olzz.com/template/mipdiy/main/css/mipcms.css">
<link rel="stylesheet" type="text/css" href="https://c.mipcdn.com/static/v2/mip.css">
<link rel="canonical" href="https://www.olzz.com/">
<style mip-custom>
.page {
width: 100%;
margin: 0 auto;
text-align: center;
padding-top: 5vw;
}
.page span{
font-size: 20vw;
text-align: center;
color: #f4f4f4;
}
.page p{
margin-bottom: 15px;
font-size: 14px;
color: #aaa;
}
.page .errorMessage {
font-size: 20px;
}
.page a{
color: #aaa;
}
</style>
</head>
<body>
<!--导航部分开始-->
<mip-shell disabled></mip-shell>
<mip-fixed type="top">
<div class="mipmb-header mipmb-header-default" id="mip_header">
<div class="container">
<div class="menu-warp">
<div class="logo-text">
<a data-type="mip" href="https://www.olzz.com" data-title="站长在线">站长在线</a>
</div>
<ul class="mipmb-menu list-unstyled">
<li class='mipmb-dropdown-item '>
<a href="https://www.olzz.com/news/" data-type="mip" data-title="站长资讯" title="站长资讯">站长资讯</a>
<ul class="mipmb-dropdown-list">
<li>
<a href="https://www.olzz.com/news/benzhan/" data-type="mip" data-title="本站资讯" title='本站资讯'>本站资讯</a>
</li>
<li>
<a href="https://www.olzz.com/news/hangye/" data-type="mip" data-title="行业资讯" title='行业资讯'>行业资讯</a>
</li>
<li>
<a href="https://www.olzz.com/news/zonghe/" data-type="mip" data-title="综合资讯" title='综合资讯'>综合资讯</a>
</li>
<li>
<a href="https://www.olzz.com/news/ganwu/" data-type="mip" data-title="站长感悟" title='站长感悟'>站长感悟</a>
</li>
</ul>
</li>
<li class='mipmb-dropdown-item '>
<a href="https://www.olzz.com/xuetang/" data-type="mip" data-title="站长学堂" title="站长学堂">站长学堂</a>
<ul class="mipmb-dropdown-list">
<li>
<a href="https://www.olzz.com/xuetang/python/" data-type="mip" data-title="Python教程" title='Python教程'>Python教程</a>
</li>
<li>
<a href="https://www.olzz.com/xuetang/html/" data-type="mip" data-title="HTML教程" title='HTML教程'>HTML教程</a>
</li>
<li>
<a href="https://www.olzz.com/xuetang/css/" data-type="mip" data-title="CSS教程" title='CSS教程'>CSS教程</a>
</li>
<li>
<a href="https://www.olzz.com/xuetang/javascript/" data-type="mip" data-title="javaScript教程" title='JavaScript教程'>JavaScript教程</a>
</li>
<li>
<a href="https://www.olzz.com/xuetang/PHP/" data-type="mip" data-title="PHP教程" title='PHP教程'>PHP教程</a>
</li>
</ul>
</li>
<li class='mipmb-dropdown-item '>
<a href="https://www.olzz.com/wenda/" data-type="mip" data-title="站长问答" title="站长问答">站长问答</a>
<ul class="mipmb-dropdown-list">
<li>
<a href="https://www.olzz.com/wenda/diannao/" data-type="mip" data-title="电脑知识" title='电脑知识'>电脑知识</a>
</li>
<li>
<a href="https://www.olzz.com/wenda/jianzhan/" data-type="mip" data-title="建站知识" title='建站知识'>建站知识</a>
</li>
</ul>
</li>
<li class='mipmb-dropdown-item '>
<a href="https://www.olzz.com/ziyuan/" data-type="mip" data-title="站长资源" title="站长资源">站长资源</a>
<ul class="mipmb-dropdown-list">
<li>
<a href="https://www.olzz.com/ziyuan/ruanjian/" data-type="mip" data-title="建站软件" title='建站软件'>建站软件</a>
</li>
<li>
<a href="https://www.olzz.com/ziyuan/yuanmachengxu/" data-type="mip" data-title="源码/程序" title='源码/程序'>源码/程序</a>
</li>
<li>
<a href="https://www.olzz.com/ziyuan/zhutimoban/" data-type="mip" data-title="主题/模板" title='主题/模板'>主题/模板</a>
</li>
<li>
<a href="https://www.olzz.com/ziyuan/jiaochengziliao/" data-type="mip" data-title="教程资料" title='教程资料'>教程资料</a>
</li>
<li>
<a href="https://www.olzz.com/ziyuan/bangongruanjian/" data-type="mip" data-title="办公软件" title='办公软件'>办公软件</a>
</li>
<li>
<a href="https://www.olzz.com/ziyuan/shuji/" data-type="mip" data-title="站长书籍" title='站长书籍'>站长书籍</a>
</li>
<li>
<a href="https://www.olzz.com/ziyuan/wytx/" data-type="mip" data-title="网页特效" title='网页特效'>网页特效</a>
</li>
</ul>
</li>
<li class='mipmb-dropdown-item '>
<a href="https://www.olzz.com/zuanqian/" data-type="mip" data-title="赚钱之道" title="赚钱之道">赚钱之道</a>
<ul class="mipmb-dropdown-list">
<li>
<a href="https://www.olzz.com/zuanqian/shejiaodianshang/" data-type="mip" data-title="社交电商" title='社交电商'>社交电商</a>
</li>
<li>
<a href="https://www.olzz.com/zuanqian/ydgk/" data-type="mip" data-title="阅读观看" title='阅读观看'>阅读观看</a>
</li>
<li>
<a href="https://www.olzz.com/zuanqian/douyinanli/" data-type="mip" data-title="抖音案例" title='抖音案例'>抖音案例</a>
</li>
</ul>
</li>
<li class='mipmb-dropdown-item '>
<a href="https://www.olzz.com/shangcheng/" data-type="mip" data-title="站长商城" title="站长商城">站长商城</a>
<ul class="mipmb-dropdown-list">
<li>
<a href="https://www.olzz.com/shangcheng/wzmb/" data-type="mip" data-title="网站模板" title='网站模板'>网站模板</a>
</li>
<li>
<a href="https://www.olzz.com/shangcheng/chajian/" data-type="mip" data-title="网站插件" title='网站插件'>网站插件</a>
</li>
<li>
<a href="https://www.olzz.com/shangcheng/wlfw/" data-type="mip" data-title="网络服务" title='网络服务'>网络服务</a>
</li>
<li>
<a href="https://www.olzz.com/shangcheng/gongyi/" data-type="mip" data-title="公益商品" title='公益商品'>公益商品</a>
</li>
<li>
<a href="https://www.olzz.com/shangcheng/mianfei/" data-type="mip" data-title="免费商品" title='免费商品'>免费商品</a>
</li>
<li>
<a href="https://www.olzz.com/shangcheng/ditan/" data-type="mip" data-title="网络地摊" title='网络地摊'>网络地摊</a>
</li>
</ul>
</li>
<li class='mipmb-dropdown-item '>
<a href="https://www.olzz.com/baike/" data-type="mip" data-title="站长百科" title="站长百科">站长百科</a>
</li>
<li class='mipmb-dropdown-item '>
<a href="https://www.olzz.com/pingtai/" data-type="mip" data-title="营销平台" title="营销平台">营销平台</a>
<ul class="mipmb-dropdown-list">
<li>
<a href="https://www.olzz.com/pingtai/zimeiti/" data-type="mip" data-title="自媒体" title='自媒体'>自媒体</a>
</li>
</ul>
</li>
<li class='mipmb-dropdown-item '>
<a href="https://www.olzz.com/zz/" data-type="mip" data-title="站长导航" title="站长导航">站长导航</a>
</li>
<li class='mipmb-dropdown-item '>
<a href="https://www.olzz.com/code/" data-type="mip" data-title="代码库" title="代码库">代码库</a>
<ul class="mipmb-dropdown-list">
<li>
<a href="https://www.olzz.com/code/pythoncode/" data-type="mip" data-title="Python代码" title='Python代码'>Python代码</a>
</li>
<li>
<a href="https://www.olzz.com/code/htmlcode/" data-type="mip" data-title="HTML代码" title='HTML代码'>HTML代码</a>
</li>
<li>
<a href="https://www.olzz.com/code/csscode/" data-type="mip" data-title="CSS代码" title='CSS代码'>CSS代码</a>
</li>
<li>
<a href="https://www.olzz.com/code/javascripcode/" data-type="mip" data-title="JavaScript代码" title='JavaScript代码'>JavaScript代码</a>
</li>
<li>
<a href="https://www.olzz.com/code/phpcode/" data-type="mip" data-title="PHP代码" title='PHP代码'>PHP代码</a>
</li>
</ul>
</li>
<li class='mipmb-dropdown-item '>
<a href="https://www.olzz.com/tiku/" data-type="mip" data-title="题库" title="题库">题库</a>
<ul class="mipmb-dropdown-list">
<li>
<a href="https://www.olzz.com/tiku/pythontiku/" data-type="mip" data-title="Python题库" title='Python题库'>Python题库</a>
</li>
<li>
<a href="https://www.olzz.com/tiku/htmltiku/" data-type="mip" data-title="HTML题库" title='HTML题库'>HTML题库</a>
</li>
<li>
<a href="https://www.olzz.com/tiku/csstiku/" data-type="mip" data-title="CSS题库" title='CSS题库'>CSS题库</a>
</li>
<li>
<a href="https://www.olzz.com/tiku/javascripttiku/" data-type="mip" data-title="JavaScript题库" title='JavaScript题库'>JavaScript题库</a>
</li>
<li>
<a href="https://www.olzz.com/tiku/phptiku/" data-type="mip" data-title="PHP题库" title='PHP题库'>PHP题库</a>
</li>
</ul>
</li>
</ul>
</div>
</div>
</div>
<br>
</mip-fixed>
<main class="mipcms-main">
<!--导航部分结束-->
2、中间部分代码：
默认的代码过于简单，我除了默认的代码保留了，还增加了一个小游戏，代码如下：
<!--原模版部分开始-->
<div class="page">
<span><?php echo 404?></span>
<p class="errorMessage">原因：<?php echo htmlentities($message); ?>.</p>
</div>
<!--原模版部分结束-->
<!--自定义404部分开始-->
<div align="center">抱歉, 您所查找的页面不存在, 可能已被删除或您输错了网址!</div>
<div align="center"><a href="https://www.olzz.com">◂去首页学习</a><a href="javascript:history.go(-1);">◂返回上一页</a>
</div>
<div align="center"><b>先玩玩这个游戏！</b><br>
<mip-iframe
allowfullscreen
src="https://www.olzz.com/demo/xiaoxiaole/"
width="325"
height="420"
allowtransparency="true">
</mip-iframe>
</div>
<!--自定义404部分结束-->
3、底部部分代码：
<!--底部版权信息开始-->
<footer class="mip-footer-diy">
<div class="container">
<div class="friend-link hidden-xs"><ul><li> 友情链接：</li><li><a href="https://www.mjncw.cn/?www.olzz.com" target="_blank">卖家内参</a></li><li><a href="https://www.olzz.com/aliyun" target="_blank">阿里云优惠购</a></li><li><a href="https://www.olzz.com/txy" target="_blank">腾讯云优惠购</a></li><li><a href="https://www.gaizichengjin.com/?www.olzz.com" target="_blank">改字成金</a></li><li><a href="https://tool.olzz.com/?www.olzz.com" target="_blank">站长工具箱</a></li><li><a href="https://shop.olzz.com/?www.olzz.com" target="_blank">站长商店</a></li><li><a href="https://blog.olzz.com/?www.olzz.com" target="_blank">站长博客</a></li><li><a href="https://bbs.olzz.com/?www.olzz.com" target="_blank">站长论坛</a></li><li><a href="https://www.hmcxw.com/?www.olzz.com" target="_blank">号码查询网</a></li><li><a href="https://www.zggs.com.cn/?www.olzz.com" target="_blank">工商在线</a></li><li><a href="https://www.wenan.wang/?www.olzz.com" target="_blank">文案网</a></li><li><a href="https://www.flfw.net/?www.olzz.com" target="_blank">法律服务网</a></li></ul></div> <div>推荐链接：<a href="https://www.olzz.com/mipdiy.html" data-type="mip" data-title="mipdiy模板" title='mipdiy模板'>mipdiy模板</a>
<a href="https://www.olzz.com/neilianchajian.html" data-type="mip" data-title="seo插件" title='seo插件'>seo插件</a>
</div> <div>推荐标签：<a href="https://www.olzz.com/tag/aliyun/" data-type="mip" data-title="阿里云" title='阿里云'>阿里云</a>
<a href="https://www.olzz.com/tag/tengxunyun/" data-type="mip" data-title="腾讯云" title='腾讯云'>腾讯云</a>
</div> <a href="https://www.olzz.com/guanyubenzhan.html" data-type="mip" data-title="关于本站" title='关于本站'>关于本站</a>-
<a href="https://www.olzz.com/fazhanlicheng.html" data-type="mip" data-title="发展历程" title='发展历程'>发展历程</a>-
<a href="https://www.olzz.com/guanggaofuwu.html" data-type="mip" data-title="广告服务" title='广告服务'>广告服务</a>-
<a href="https://www.olzz.com/banquanshengming.html" data-type="mip" data-title="版权声明" title='版权声明'>版权声明</a>-
<a href="https://www.olzz.com/mianzeshengming.html" data-type="mip" data-title="免责声明" title='免责声明'>免责声明</a>-
<a href="https://www.olzz.com/shangwuhezuo.html" data-type="mip" data-title="商务合作" title='商务合作'>商务合作</a>-
<a href="https://www.olzz.com/lianxiwomen.html" data-type="mip" data-title="联系我们" title='联系我们'>联系我们</a>-
<a href="https://www.olzz.com/fukuanfangshi.html" data-type="mip" data-title="付款方式" title='付款方式'>付款方式</a> <p class="text-center mip-footer-diy"><a data-type="mip" href="https://www.olzz.com" data-title="站长在线">站长在线</a> ©2020 <a data-type="mip" href="https://www.olzz.com" data-title="站长在线">olzz.com</a> <a data-type="mip" href="https://www.olzz.com/yyzz.html" target="_blank" rel="nofollow">江华站长在线网络科技有限公司</a> 版权所有 <a href="https://www.olzz.com/sitemap.xml">Sitemap</a>
<p class="text-center mip-footer-diy"> <a href="https://wpa.qq.com/msgrd?v=3&uin=350379853&site=qq&menu=yes" rel="nofollow" target="_blank" title='点击QQ免费咨询'>QQ:350379853</a>|<a href="https://jq.qq.com/?_wv=1027&k=5BETZ6s" rel="nofollow" target="_blank" title='点击进群'>站长qq群:187388018</a>|<a href="https://www.olzz.com/img/weixin.jpg" rel="nofollow" target="_blank" title='微信扫码咨询'>微信:19146748887</a>|<a href="tel:19146748887" title='19146748887'>打电话</a>|<a href="sms:19146748887" title='19146748887'>发短信</a>|<a href="tel:07462525295" title='07462525295'>0746-2525295</a></p>
<p class="text-center mip-footer-diy">本站自豪的采用<a href="http://www.mipjz.com/?www.olzz.com" target="_blank" rel="nofollow">MIP建站系统</a> 技术支持：<a href="https://www.olzz.com/" target="_blank" title='站长在线'> 站长在线</a> <mip-stats-cnzz token="1278700007"></mip-stats-cnzz>
<mip-stats-baidu token="8abf056d431538bd6c9c1166901389ac"></mip-stats-baidu></p>
<p class="text-center mip-footer-diy"><a target="_blank" href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=43112902000022" rel="nofollow"><mip-img src="https://www.olzz.com/img/beian.png" alt="站长在线官网公安部备案" width="14" height="14"></mip-img>湘公网安备 43112902000022号</a> <a href="http://www.beian.miit.gov.cn" target="_blank" rel="nofollow">湘icp备20005810号-1</a> </p>
<mip-AdSense ad-client="ca-pub-9415624128339828" ad-slot="9640249472" ad-format="auto"></mip-adsense>
</div>
</footer>
<!--底部版权信息结束-->
<mip-fixed type="gototop">
<mip-gototop></mip-gototop>
</mip-fixed>
<script src="https://c.mipcdn.com/static/v2/mip.js"></script><!--mip核心组件，不可删除-->
<script src="https://c.mipcdn.com/static/v2/mip-stats-cnzz/mip-stats-cnzz.js"></script><!--cnzz站长统计组件-->
<script src="https://c.mipcdn.com/static/v2/mip-stats-baidu/mip-stats-baidu.js"></script><!--百度统计组件-->
<script src="https://c.mipcdn.com/static/v2/mip-gototop/mip-gototop.js" type="text/javascript" charset="utf-8"></script><!--快速回顶组件-->
<script src="https://c.mipcdn.com/static/v2/mip-history/mip-history.js" type="text/javascript" charset="utf-8"></script><!--历史记录组件-->
<script src="https://c.mipcdn.com/static/v2/mip-adsense/mip-adsense.js" type="text/javascript" charset="utf-8"></script><!--谷歌adsense广告组件-->
<script src="https://c.mipcdn.com/static/v2/mip-form/mip-form.js" type="text/javascript" charset="utf-8"></script><!--表单组件，搜索必要-->
<script src="https://c.mipcdn.com/static/v2/mip-ad/mip-ad.js"></script><!--百度广告组件-->
<script src="https://c.mipcdn.com/extensions/platform/v2/mip-cambrian/mip-cambrian.js"></script><!--熊掌号组件-->
<script src="https://c.mipcdn.com/static/v2/mip-share/mip-share.js"></script><!--分享组件-->
<script src="https://c.mipcdn.com/static/v2/mip-audio/mip-audio.js"></script><!--音频播放组件-->
</body>
</html>
如果，不会做404页面的，可以参考我的代码哦！
本文地址：https://www.olzz.com/ruhexie404yemian.html
码字不易，打个赏呗
杨泽业感谢你的支持！
站长在线站长一对一网络指导服务，一元一分钟，50元一个小时
阿里云虚拟主机1G空间，120元一年
香港、美国虚拟主机100元一年，1000元永久
腾讯云双十一0.4折起，2核8G5M三年仅700元，2核4G8M三年仅198元
阿里云虚拟主机1G空间，120元一年
香港、美国虚拟主机100元一年，1000元永久
腾讯云双十一0.4折起，2核8G5M三年仅700元，2核4G8M三年仅198元
猜你喜欢