当用户访问 PbootCMS 网站时,如果请求的页面不存在,系统会显示一个错误页面,提示“您访问的页面不存在,请核对后重试!”。为了提升用户体验,可以将这个错误页面设置为1秒后自动跳转到其他页面,例如首页或指定的404页面。
步骤
-
打开错误页面模板文件:
- 进入 PbootCMS 根目录,找到
core/template/error.html
文件。
- 进入 PbootCMS 根目录,找到
-
修改
error.html
文件:- 使用文本编辑器打开
error.html
文件,按照以下内容进行修改:
- 使用文本编辑器打开
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>错误信息</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0" />
<meta name="apple-mobile-web-app-capable" content="yes" />
</head>
<body>
<div style="margin-left:10%;margin-top:5%;">
<div style="margin-bottom:20px;"><img src="{coredir}/template/face02.png" height="120"></div>
<div style="font-size:20px;margin-bottom:20px;">{info} <span id="time" style="font-size:18px;"></span></div>
<div style="margin-bottom: 1rem;">
<p>页面将在1秒后自动跳转到另一个页面...</p>
</div>
<div><span style="font-size:12px;border-top:1px solid #ccc;color:#ccc;padding-top:2px;">
程序版本:{appversion}
</span></div>
</div>
<script>
setTimeout(function() {
window.location.href = 'http://www.baidu.com/'; // 替换为你想要跳转的URL
}, 1000); // 1000毫秒后执行
</script>
{js}
</body>
</html>
说明
-
HTML 结构:
- 保留了原有的错误提示信息和样式。
- 添加了一段提示文字,告知用户页面将在1秒后自动跳转。
-
JavaScript 代码:
- 使用
setTimeout
函数,在1000毫秒(即1秒)后执行页面跳转。 window.location.href
指定了跳转的目标URL,可以根据需要替换为其他页面的URL。
- 使用
保存并测试
-
保存文件:
- 将修改后的
error.html
文件保存。
- 将修改后的
-
测试效果:
- 访问一个不存在的页面,检查是否能够看到自定义的错误提示,并在1秒后自动跳转到指定的页面。
注意事项
- 目标URL:
- 确保跳转的目标URL是有效的,避免再次跳转到错误页面。
- 用户体验:
- 考虑用户的体验,可以选择跳转到首页或其他重要的页面,而不是外部网站。
- 备份:
- 在修改文件前,建议先备份原文件,以便在出现问题时恢复。
通过以上步骤,您可以轻松地将 PbootCMS 的404错误页面设置为1秒后自动跳转,提升用户体验。
标签:URL,error,访问,404,跳转,页面 From: https://www.cnblogs.com/hwrex/p/18487165