账号通
    

注册

找回密码

账号  

密码  

话题
互动
会员
服务
<<返回列表上一个主题 下一个主题 打印本帖 复制本帖地址

393070

查看

587

回复
主题：◆科讯7.0◆超级清爽留言本效果◆DIV+CSS布局◆需要留言本的请进啦◆ [收藏主题] 转到：  
孤风大虾 当前离线

1700

主题

7

广播

118

粉丝
添加关注
级别:高一年

用户积分:10218 分
登录次数:451 次
注册时间:2006/3/28
最后登录:2022/3/10
孤风大虾 发表于：2010/10/29 16:42:00   | 显示全部帖子 查看该作者主题 楼主 
科汛智能建站系统
一分钟快速开通线上知识店铺

科讯官方的留言本效果极差，因此修改了留言本效果。在此放出来与大家共享。



首先上效果图：



点击查看原图

怎么样？很清爽的效果吧？



下面是发表留言的效果图。



点击查看原图



想要的话，继续往下看喽。



首先下载本插件。



以下内容只有回复后才可以浏览,请先登录！



下面是CSS：



  2. #GuestList {width:690px; margin:0 auto; clear:both; padding:10px 0;}

  3. #club_link { width:690px; overflow:hidden; height:38px;}
  4.   #club_link a { display:block; width:110px; float:right; height:30px; background-image:url(/image/club_linl.png); text-indent:-999em; padding:0 10px 0 0; background-repeat:no-repeat}
  5.   #club_link .a { background-position:0 -30px;}
  6. #Content { width:550px; height:200px;}
  7. .club_list{ width:690px; overflow:hidden; border-top:1px solid #B9D8F9; clear:both; padding:0 0 10px;}
  8. .club_left { width:120px; float:left; height:120px; background:#E8F2FD}
  9.   .club_123 { font-family:"Arial Black", Gadget, sans-serif; font-size:60px; display:block; width:120px; height:90px; text-align:center; color:#1074D8}
  10.   .club_name { width:120px; display:block; height:30px; text-align:center; font-weight:bold; color:#f60;}
  11. .club_right { width:560px; float:right}
  12.   .club_top { height:30px; line-height:30px; overflow:hidden; width:560px; border-bottom:1px solid #B9D8F9}
  13.    .club_title { float:left; font-size:14px; color:#f60;}
  14.   .club_con { line-height:22px; color:#666; text-indent:2em; padding:5px 0;}
  15.   .club_date { height:30px; line-height:30px; text-align:right; color:#1074D8; float:right}
  16.   .club_huifu { width:538px; background:#f7fbff; padding:10px; border:1px dashed #B9D8F9; float:right}
  17.    .club_huifu_title { font-size:14px; color:#f00;}
  18.    .club_huifu_con { line-height:22px; color:#666; text-indent:2em; padding:5px 0;}
  19.    .club_huifu_date { height:20px; line-height:20px; color:#1074D8; float:right}



CSS中用到的图片已经放在了压缩包内。请自行调整图片的路径。



留言本的宽度为690px，是标准的宽度，如果你的网页不是这个标准，那么请自行调整。



下面是留言本首页模版代码：请将代码自行复制到你的模版中。



  2. <div id="GuestList">

  3. <div id="club_link"><a href="post.asp" class="b">发布留言</a><a href="guestbook.asp" class="a">留言首页</a></div>
  4. {$GetGuestList}
  5. </div>



下面是留言本发布留言模版代码：请将代码自行复制到你的模版中。



  2. <div id="GuestList">

  3. <div id="club_link"><a href="post.asp" class="b">发布留言</a><a href="guestbook.asp" class="a">留言首页</a></div>
  4. {$WriteGuestForm}
  5. </div>



此外，发布留言的模版的head区域还需要JS，可自行从科讯默认的模版中复制。



算了，我还是写上来吧，省得麻烦。



  2. <script src="{$GetInstallDir}ks_inc/jquery.js"></script>

  3. <script src="{$GetInstallDir}{$GetClubInstallDir}/images/club.js"></script>
  4. <script src="{$GetInstallDir}ks_inc/kesion.box.js"></script>
  5. <script type="text/javascript">
  6. function checkform()
  7. {
  8.   if (jQuery("#SelectCategoryId").val()==1){
  9.    if (myform.CategoryId.value=='0'){
  10.     alert('主题分类必须选择!');
  11.     return false;
  12.    }
  13.   }
  14.    if (myform.Subject{$RndID}.value==""){
  15.    alert("主题一定要填写！");
  16.        myform.Subject{$RndID}.focus();
  17.     return false;
  18.   }
  19.   if (myform.boardid.value=="")
  20.   { alert("请选择要发布的版面!");return false;
  21.   }
  22.   
  23. {IF:KS.Setting(59)="1"}
  24.   if (myform.Name.value==""){
  25.      alert("你好像还忘了填昵称哦！");
  26.      myform.Name.focus();
  27.      return false;
  28.   }
  29.      
  30.   if (myform.Email.value==""){
  31.      alert("电子邮件一定要填写哦！");
  32.      myform.Email.focus();
  33.      return false;
  34.    }
  35.    haha=myform.Email.value
  36.    if(haha.length>0)
  37.    {
  38.       i=haha.indexOf("@");
  39.       if(i==-1)
  40.       {
  41.        alert("哇！您输入的电子邮件有错误哦！")
  42.        myform.Email.focus();
  43.        return false;
  44.       }
  45.         ii=haha.indexOf(".")
  46.       if(ii==-1)
  47.       {
  48.        alert("哇！您输入的电子邮件有错误哦！")
  49.        myform.Email.focus();
  50.        return false;
  51.       }
  52.      }
  53.      else
  54.      {
  55.       alert("能告诉我您的有效电子邮件吗？");
  56.       myform.Email.focus();
  57.       return false;
  58.      }
  59.   {/IF}
  60.   if (Editor.getEditorContents()=='')
  61.   {
  62.        alert("主题内容不能留空！");
  63.        return false;
  64.    }
  65.   {$CheckCode}
  66.    return true;
  67. }
  68. </script>



最后，再一次提醒，如果你发现在浏览器中里面变形，请检查你的模版的第一行代码是否如下：



  2. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

  3. <html xmlns="http://www.w3.org/1999/xhtml">



采用XHML 1.0 宽松版的标准。



此清爽留言本效果由菏泽网站建设地方网络工作室提供。本工作室不对使用该插件造成的任何损失负责。
 
做官网 就用科汛智能建站系统!
  支持(9) | 反对(0) 回到顶部顶端 回到底部底部
孤风大虾 当前离线

1700

主题

7

广播

118

粉丝
添加关注
级别:高一年

用户积分:10218 分
登录次数:451 次
注册时间:2006/3/28
最后登录:2022/3/10
孤风大虾 发表于：2010/11/3 16:57:00   | 显示全部帖子 查看该作者主题 沙发 
科汛智能建站系统
一分钟快速开通线上知识店铺
下载之后，直接覆盖，然后按照我的帖子的描述去做即可。
 
孤风自己开发了一套CMS系统，博采科讯的长处，去除了无关的功能，有兴趣的百度 FengCms
有课程 找生源 就上科汛课堂街
  支持(0) | 反对(0) 回到顶部顶端 回到底部底部
＜上一主题 | 下一主题 ＞
Powered By KesionCMS Version X1
厦门科汛软件有限公司 © 2006-2016 页面执行1.92969秒 powered by KesionCMS 9.0