商业授权查询 | 主机频道 | 在线手册
教程中心

为在线客服插件自定义模板

日期:2015/1/30 9:58:09 人气:2594

企业版和商城都有此在线客服功能,如果觉得默认的在线客服界面不好看,该如何弄一个漂亮的呢?

首先,我们需要在模板根目录新建一个文件,文件名称为:“sdcms_qq.asp”,具体代码参考如下:

<style>
.plug_qq{width:150px;padding:15px 0;position:absolute;z-index:998;}
.plug_qq ul{list-style:none;margin:0;padding:0;border-bottom:1px solid #A6BBE2;}
.plug_qq ul li{line-height:30px;padding:6px 15px;border:1px solid #A6BBE2;border-top:0;border-bottom:0;background:#fff;}
.plug_qq ul .title{background:#284587;border:1px solid #284587;font-family:microsoft yahei;font-size:16px;color:#fff;}
.plug_qq ul li a{text-decoration:none;color:#333;font-size:12px;}
.plug_qq ul li a:hover{color:#f30;}
.plug_qq ul li img{margin:0 5px 0 0;}
</style>

<div class="plug_qq" id="plugqq" style="top:320px;right:10px">
    <ul>
  <li class="title">在线客服</li>
        {for i=0 to ubound(data)}
        <li><img src="http://wpa.qq.com/pa?p=1:{num(i)}:52" border="0" align="absmiddle" /><a href="tencent://message/?uin={num(i)}&menu=yes">{data(i)}</a></li>
        {/for}
    </ul>
</div>
<script src="{webroot}plug/service/setting.js"></script>

保存后,去后台的插件管理里,重新保存下在线客服的内容就可以了。

备注:以上代码仅供参考,更好的界面效果请自己设计