showmsg 是 DedeCMS 中一个非常核心的提示页面,广泛用于登录成功/失败、投稿成功/失败、操作成功/失败等各种场景,默认的样式比较老旧,修改它可以极大地提升网站的用户体验和界面美观度。

修改 showmsg 主要有两种方法:
- 推荐方法:修改模板文件(最灵活、最常用)
- 直接修改 PHP 文件(不推荐,升级会覆盖)
修改模板文件(推荐)
这是最推荐的方法,因为它遵循了 DedeCMS 的模板与逻辑分离的原则,即使未来升级系统,你的修改也不会丢失。
步骤 1:找到模板文件
showmsg 的模板文件位于:
/templets/system/showmsg.htm

你需要用 FTP 或文件管理器登录你的服务器,找到并下载这个文件。
步骤 2:分析默认模板结构
打开 showmsg.htm,你会看到类似下面的代码结构:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=<?php echo $cfg_soft_lang; ?>">系统提示</title>
<link href="templets/style/dedecms.css" rel="stylesheet" type="text/css" />
<style type="text/css">
body {
background-color: #F5F5F5;
}
.main {
width: 560px;
margin: 100px auto;
border: 1px solid #EBEBEB;
background-color: #FFFFFF;
padding: 40px;
border-radius: 5px;
box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}
.main h1 {
font-size: 24px;
color: #333;
margin-bottom: 20px;
border-bottom: 1px solid #EBEBEB;
padding-bottom: 10px;
}
.main .msg {
font-size: 16px;
line-height: 1.8;
color: #555;
margin-bottom: 30px;
}
.main .btn {
display: inline-block;
margin-right: 15px;
}
</style>
</head>
<body>
<div class="main">
<h1><?php echo $msgtitle; ?></h1>
<div class="msg">
<?php echo $msg; ?>
</div>
<div class="btn">
<?php
if($gourl=='-1')
{
echo "<a href='javascript:history.go(-1);'>返回上一页</a>";
}
else if($gourl=='')
{
echo "<a href='".$GLOBALS['cfg_phpurl']."/index.php'>网站首页</a>";
}
else
{
echo "<a href='".$gourl."'>立即跳转</a>";
}
?>
( <span id="tiao">5</span> 秒后自动跳转...)
</div>
</div>
<script language="javascript">
var secs = 5;
var URL = "<?php echo $gourl; ?>";
function LoadUrl()
{
if(secs==0){
location.href=URL;
}else{
secs--;
document.getElementById('tiao').innerHTML=secs;
setTimeout("LoadUrl()", 1000);
}
}
setTimeout("LoadUrl()", 1000);
</script>
</body>
</html>
步骤 3:自定义你的样式和内容
你可以像修改任何其他 HTML 模板一样修改 showmsg.htm。
修改 CSS 样式:
在 <style> 标签内修改,或者引入你自己的 CSS 文件。
- 更换背景色: 修改
body的background-color。 - 修改主容器样式: 修改
.main的宽度、边框、背景色、内边距、圆角和阴影,让它看起来更现代化。 - 和文字样式: 修改
h1和.msg的字体、颜色、大小等。 - 修改按钮样式: 修改
.btn和<a>标签的样式,使其更像一个按钮。
示例:一个更现代的 showmsg.htm 修改
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=<?php echo $cfg_soft_lang; ?>">系统提示 - <?php echo $cfg_webname; ?></title>
<!-- 引入你自己的CSS文件,而不是默认的 -->
<link href="{dede:global.cfg_templetsurl/}/style/style.css" rel="stylesheet" type="text/css" />
<style type="text/css">
/* 全局背景 */
body {
background-color: #f0f2f5;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
/* 提示框容器 */
.msg-box {
width: 90%;
max-width: 500px;
margin: 120px auto;
background: #fff;
border-radius: 8px;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
overflow: hidden; /* 确保圆角生效 */
}
.msg-header {
padding: 20px 30px;
border-bottom: 1px solid #eee;
}
.msg-header h1 {
font-size: 22px;
font-weight: 500;
color: #333;
margin: 0;
}
/* 根据不同状态设置标题颜色 */
.success .msg-header h1 { color: #52c41a; }
.error .msg-header h1 { color: #f5222d; }
.info .msg-header h1 { color: #1890ff; }
.msg-body {
padding: 30px;
text-align: center;
}
.msg-body .msg-icon {
font-size: 48px;
margin-bottom: 20px;
}
.success .msg-icon { color: #52c41a; }
.error .msg-icon { color: #f5222d; }
.info .msg-icon { color: #1890ff; }
.msg-body .msg-text {
font-size: 16px;
line-height: 1.6;
color: #666;
margin-bottom: 30px;
}
.msg-footer {
padding: 0 30px 30px;
text-align: center;
}
.msg-footer a {
display: inline-block;
margin: 0 10px;
padding: 8px 20px;
background-color: #1890ff;
color: #fff;
border-radius: 4px;
text-decoration: none;
transition: background-color 0.3s;
}
.msg-footer a:hover {
background-color: #40a9ff;
}
</style>
</head>
<body>
<?php
// 根据消息类型给容器添加不同的class
$box_class = 'info'; // 默认为信息
if (strpos($msgtitle, '成功') !== false || strpos($msgtitle, '恭喜') !== false) {
$box_class = 'success';
} elseif (strpos($msgtitle, '失败') !== false || strpos($msgtitle, '错误') !== false || strpos($msgtitle, '警告') !== false) {
$box_class = 'error';
}
?>
<div class="msg-box <?php echo $box_class; ?>">
<div class="msg-header">
<h1><?php echo $msgtitle; ?></h1>
</div>
<div class="msg-body">
<div class="msg-icon">
<?php if ($box_class == 'success'): ?>
<i class="fa fa-check-circle"></i> <!-- 需要引入FontAwesome图标库 -->
<?php elseif ($box_class == 'error'): ?>
<i class="fa fa-times-circle"></i>
<?php else: ?>
<i class="fa fa-info-circle"></i>
<?php endif; ?>
</div>
<div class="msg-text"><?php echo $msg; ?></div>
</div>
<div class="msg-footer">
<?php
if($gourl=='-1')
{
echo "<a href='javascript:history.go(-1);'>返回上一页</a>";
}
else if($gourl=='')
{
echo "<a href='".$GLOBALS['cfg_phpurl']."/index.php'>返回首页</a>";
}
else
{
echo "<a href='".$gourl."'>立即跳转</a>";
}
?>
( <span id="tiao">5</span> 秒后自动跳转...)
</div>
</div>
<script language="javascript">
var secs = 5;
var URL = "<?php echo $gourl; ?>";
function LoadUrl()
{
if(secs==0){
if(URL == ''){
URL = '<?php echo $GLOBALS['cfg_phpurl']."/index.php"; ?>';
}
location.href=URL;
}else{
secs--;
document.getElementById('tiao').innerHTML=secs;
setTimeout("LoadUrl()", 1000);
}
}
setTimeout("LoadUrl()", 1000);
</script>
</body>
</html>
修改 PHP 逻辑以传递更多变量(可选)
如果你想根据不同的操作(如登录、投稿)显示完全不同的页面,你可以在调用 ShowMsg() 函数的 PHP 文件中,传递额外的变量。
在 /member/login.php 中,找到类似这样的代码:
// 登录成功
ShowMsg('登录成功!', 'index.php', 0, 5000);
你可以修改它,传递一个自定义的模板或状态:
// 定义一个自定义的模板文件
$tpl = 'login_success.htm';
ShowMsg('登录成功!', 'index.php', 0, 5000, $tpl);
你需要修改 showmsg.php 文件(位于 /include/common.inc.php 或 /include/helpers/ 目录下,具体版本位置可能不同)来支持这个新参数。
在 showmsg.php 中查找 ShowMsg 函数,并修改它:
// 原始函数可能类似这样
function ShowMsg($msg, $gourl, $onlymsg = 0, $limittime = 0)
{
// ... 逻辑 ...
include_once(DEDETEMPLATE.'/system/showmsg.htm');
exit();
}
// 修改后的函数,增加 $tpl 参数
function ShowMsg($msg, $gourl, $onlymsg = 0, $limittime = 0, $tpl = 'showmsg.htm')
{
// ... 其他逻辑不变 ...
// 检查自定义模板是否存在,如果存在则使用,否则使用默认模板
$template_file = DEDETEMPLATE . '/system/' . $tpl;
if (file_exists($template_file)) {
include_once($template_file);
} else {
include_once(DEDETEMPLATE.'/system/showmsg.htm');
}
exit();
}
这样,你就可以为特定场景创建专门的提示页面,如 login_success.htm、post_error.htm 等。
直接修改 PHP 文件(不推荐)
这种方法是直接修改生成 showmsg 页面的 PHP 代码,通常位于 /include/helpers/ 目录下的 showmsg.php 文件。
为什么不推荐? 因为 DedeCMS 升级时,这些核心文件会被新版本的文件覆盖,导致你的所有修改丢失,你需要每次升级后都重新修改一遍。
操作步骤(仅作了解):
-
找到并打开
/include/helpers/showmsg.php。 -
在文件顶部,你会看到定义 CSS 样式的代码。
// ... 其他代码 ... $msgtitle = $msgtitle; $msg = $msg; $gourl = $gourl; $tpldir = $cfg_templets_dir; // 你可以在这里修改 $css 变量 $css = " <style type=\"text/css\"> <!-- body { background-color:#FFFFFF; font-family: Arial, Helvetica, sans-serif; margin: 0px; } ... 默认的CSS代码 ... --> </style> "; // ... 其他代码 ... include_once($tpldir."/system/showmsg.htm"); -
直接修改
$css变量里的 CSS 代码来改变样式。 -
同样,你也可以修改
include_once($tpldir."/system/showmsg.htm");这一行,让它指向你自定义的模板文件路径。
总结与最佳实践
| 方法 | 优点 | 缺点 | 推荐度 |
|---|---|---|---|
| 修改模板文件 | 灵活,可完全控制 HTML/CSS。 符合 MVC 思想,逻辑与表现分离。 升级安全,修改不会被覆盖。 |
需要了解基本的 HTML 和 CSS。 | ⭐⭐⭐⭐⭐ (强烈推荐) |
| 修改 PHP 文件 | 可以快速实现一些小改动。 对于不熟悉模板文件的人来说似乎更直接。 |
升级风险,修改极易丢失。 破坏了系统文件,不利于维护。 |
⭐ (不推荐,除非有特殊需求) |
给你的建议:
- 从修改
/templets/system/showmsg.htm开始。 - 引入你自己的 CSS 文件,而不是直接写在模板里,这样更易于管理。
- 利用 PHP 变量(如
$msgtitle,$msg)来动态显示内容。 - 如果需要更复杂的定制,再考虑修改
showmsg.php函数来支持自定义模板。
通过以上方法,你就可以轻松地将 DedeCMS 默认的 showmsg 页面改造成符合你网站风格的、现代化的提示界面了。
