前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >GithubPage自定义腾讯404界面

GithubPage自定义腾讯404界面

作者头像
@坤的
发布2018-09-21 12:04:35
1.8K0
发布2018-09-21 12:04:35
举报
文章被收录于专栏:*坤的Blog

思路来源

之前看到腾讯网络的404和github自带的404,反差很大,于是想自己弄一个了.

过程

github的404一点也不复杂,只是需要在根目录添加一个404.html的文档,或者404.md的文档就行了.

具体的代码可以参考如下:

404.html

代码语言:javascript
复制
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>系统出现错误,我们会尽快修复,对您造成不便我们感到非常抱歉。</title>
    <style type="text/css">
        .ui-error-box{
 
            background-image: url(/images/error_bj.jpg); height:260px; width: 410px; margin: 80px auto;
            color: #eb6100; font-weight: bold; padding: 140px 0 0 198px;
         
}
        .ui-error-box a{
            color: #037cd6; margin-right: 20px;
}
 
    </style>
    <script type="text/javascript" src="//qzonestyle.gtimg.cn/qzone/hybrid/app/404/search_children.js" charset="utf-8" homePageUrl="https://wangkun19930608.github.io/" homePageName="回到我的主页"></script>
    
</head>
<body>
    <div class="ui-error-box">
        <p>资源不存在或者系统内部错误<br>对您造成不便我们感到非常抱歉。</p>
    </div>
     <div style="display:none">
          <!-- github blog-->
          <script type="text/javascript">
          var cnzz_protocol = (("https:" == document.location.protocol) ? " https://" : " http://");
          document.write(unescape("%3Cspan id='cnzz_stat_icon_1271464027'%3E%3C/span%3E%3Cscript src='" + cnzz_protocol + "s13.cnzz.com/z_stat.php%3Fid%3D1271464027%26online%3D1%26show%3Dline' type='text/javascript'%3E%3C/script%3E"));
          </script>
          <!--all blog-->
          <script src="https://s13.cnzz.com/z_stat.php?id=1264550437&web_id=1264550437" language="JavaScript"></script>
    </div>
</body> 

404.md

代码语言:javascript
复制
---
permalink: /404.html
---
<html>
  <head></head>
  <body>
对不起,目前无法访问你的连接,你可以访问主页https://wangkun19930608.github.io
    </body>
</html>

[注意]

下面的代码加了就直接成为了腾讯的404页面了,有兴趣的可以自己弄弄.不想要的可以把前面的这一句话删掉.

代码语言:javascript
复制
<script type="text/javascript" src="//qzonestyle.gtimg.cn/qzone/hybrid/app/404/search_children.js" charset="utf-8" homePageUrl="https://wangkun19930608.github.io/" homePageName="回到我的主页"></script>

如果你想换成其他的404界面,可以参考下下面的连接:

猫的状态码

狗的状态码

使用时候直接跳转或者内联到对应的状态码即可.如:

https://http.cat/404

https://httpstatusdogs.com/404

参考文章

Github page 如何自定义404页面_百度经验

关于网站所有404页面替换为腾讯公益404页面的说明

版本说明

20180814 文章完成时间

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2018-08-20 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 思路来源
  • 过程
    • [注意]
      • 参考文章
        • 版本说明
        领券
        问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档