欢迎访问2017年洛阳SEO牛广的官方博客,只要标题有亲测有效的都是原创文章。为大家提供最新真实有效的案例,承接网站SEO百度优化业务QQ:939380096

网站404页面虚拟主机设置方法+JS跳转-亲测有效

SEO niuguang 1785次浏览 7个评论

 为什么要设置404页面

 洛阳SEO牛广认为,可以让网站对用户变的友好,当发生了某些原因导致网页错误时候出现404页面,简单讲就是能让页面起死回生。跳转到首页,对用户进行再一次的展示。让用户再次点击产生转化。

如何设置404页面

 在一般情况下 网站存放位置2个地方.

1 虚拟云 (虚拟主机)。

2  云服务器(独立VPS) 这个又分 Wamp环境和Lamp环境.

在这里站长牛广演示 虚拟云 废话不多说请看下文。

演示材料 

 百度云 虚拟云 404页面设置 (其他的虚拟主机基本都是一样)。

虚拟云 404页面设置

 第一步

首先准备好 自己的404页面 和 图片文件。

  404页面为了方便一般都是把CSS JS HTML 都写在一个 html文件里 方便管理(一般情况下404页面一旦做好是不动的).

  如果你想把css js 进行导入 分类出来也行,这个看个人了。  里面的路径不能错,特别是图片文件路径

404页面

第二步

上传FTP 

        我们把404.html这个页面上传到网站目录, 一般情况是上传到网站跟目录,如果你想放到其他目录也行但是有一点就是要记好路径地址(等下要把地方放在主机控制面板设置里面)。

  本次演示404放在根目录,图片文件要对应好html中写的路径,当你把你的图片上传到FTP自己指定的目录后,可以在阅览器的地址栏访问下路径看看能不能访问到你的图片。

FTP目录

图片路径测试

洛阳SEO牛广404页面图片路径

第三步

修改主机控制面板设置

百度云404控制页面操作

到这里基本上就结束了 我们来测试下。

123.html这个页面是不存在的。

404测试页面

测试成功。

测试页面

 

 下面代码是洛阳SEO牛广网站上的404页面代码 带有js 5秒跳转 js我已经写好了注释, 复制粘贴改下路径就能用。

<html>
<head>
<meta charset="utf-8">
<title>404页面自动跳转</title>
<style>
*{margin:0;padding:0;outline:none;font-family:\5FAE\8F6F\96C5\9ED1,宋体;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;-khtml-user-select:none;user-select:none;cursor:default;font-weight:lighter;}
.center{margin:0 auto;}
.whole{width:100%;height:100%;line-height:100%;position:fixed;bottom:0;left:0;z-index:-1000;overflow:hidden;}
.whole img{width:100%;height:100%;}
.mask{width:100%;height:100%;position:absolute;top:0;left:0;background:#000;opacity:0.6;filter:alpha(opacity=60);}
.b{width:100%;text-align:center;height:400px;position:absolute;top:50%;margin-top:-230px}.a{width:150px;height:50px;margin-top:30px}.a a{display:block;float:left;width:150px;height:50px;background:#fff;text-align:center;line-height:50px;font-size:18px;border-radius:25px;color:#333}.a a:hover{color:#000;box-shadow:#fff 0 0 20px}
p{color:#fff;margin-top:40px;font-size:24px;}
#num{margin:0 5px;font-weight:bold;}
</style>
<script type="text/javascript">
 var num=6; //定义变量值 设置秒数
 function redirect(){ //创建函数
 num--; //变量减减
 document.getElementById("num").innerHTML=num; //找到div
 if(num==2){ //判断函数值
 window.location.href="http://www.xiaoguangseo.com"; //跳转
 }
 }
 setInterval("redirect()", 1000); //反复调用函数
</script>
</head>

<body onLoad="redirect();">
<div class="whole">
 <img src="http://www.xiaoguangseo.com/wp-includes/images/back.jpg" />
 <div class="mask"></div>
</div>
<div class="b">
 <img src="http://www.xiaoguangseo.com/wp-includes/images/404.png" class="center"/>
 <p>
 暂时未能找到您查找的页面<br>
 可能输入的网址错误或此页面不存在<br>
 <span id="num"></span>秒后自动跳转到主页
 </p>
 </div>

</body>
</html>

小广 , 版权所有丨如未注明 , 均为原创丨本网站采用BY-NC-SA协议进行授权 , 转载请注明网站404页面虚拟主机设置方法+JS跳转-亲测有效
喜欢 (0)
发表我的评论
取消评论
表情 贴图 加粗 删除线 居中 斜体 签到
(7)个小伙伴在吐槽
  1. I'm writing to make you be aware of what a excellent discovery my daughter developed reading through your webblog. She noticed lots of things, including what it is like to possess an excellent coaching character to get the mediocre ones just completely grasp selected grueling subject matter. You really did more than my expectations. Thanks for churning out such insightful, healthy, revealing not to mention easy guidance on that topic to Evelyn. Adidas NMD XR1 Camouflage Main Dark Grey [url=http://www.adidas-nmds.us.com/adidas-nmd-xr1-camouflage-main-dark-grey-p-513.html]Adidas NMD XR1 Camouflage Main Dark Grey[/url]
    匿名2018-08-13 23:15 (4天前)
  2. This website online can be a walk-through for all of the data you needed about this and didn抰 know who to ask. Glimpse right here, and also you抣l undoubtedly discover it. yeezy
    匿名2018-08-14 03:32 (4天前)
  3. My wife and i were now fortunate when Louis managed to do his researching through the ideas he had from your own weblog. It's not at all simplistic to simply possibly be offering tricks which many others may have been trying to sell. And we also know we have the writer to give thanks to for that. Most of the explanations you have made, the simple website navigation, the friendships your site make it possible to promote - it's got most spectacular, and it is assisting our son and us consider that that situation is excellent, which is seriously pressing. Thanks for everything! adidas nmd
    匿名2018-08-14 03:43 (4天前)
  4. Nice post. I study something more challenging on totally different blogs everyday. It should at all times be stimulating to learn content from other writers and observe a bit of something from their store. I抎 favor to make use of some with the content on my blog whether or not you don抰 mind. Natually I抣l give you a hyperlink in your internet blog. Thanks for sharing. yeezy
    匿名2018-08-14 16:47 (4天前)
  5. This is the right blog for anyone who wants to find out about this topic. You notice a lot its almost onerous to argue with you (not that I really would need匟aHa). You definitely put a new spin on a topic thats been written about for years. Nice stuff, simply nice! adidas nmd
    匿名2018-08-16 21:01 (2天前)
  6. I intended to post you that tiny note to be able to say thanks once again on your wonderful knowledge you've discussed here. This is really seriously generous with people like you giving freely what exactly a number of us could possibly have sold for an e book to generate some cash for themselves, even more so given that you could have tried it if you ever decided. Those concepts in addition worked like a good way to realize that other people online have the identical keenness really like my very own to grasp lots more with respect to this matter. I'm sure there are lots of more pleasurable situations up front for many who examine your website. adidas ultra boost 3.0
    匿名2018-08-17 12:41 (22小时前)
  7. Oh my goodness! an incredible article dude. Thank you Nonetheless I am experiencing concern with ur rss . Don抰 know why Unable to subscribe to it. Is there anybody getting identical rss problem? Anybody who knows kindly respond. Thnkx paul george shoes
    匿名2018-08-18 05:26 (5小时前)