您现在的位置：动易雅虎 >> WEB之旅 >> 动易模板实践>> 内容正文
推荐阅读

修改 SiteFactory 评论样式

　　修改 SiteFactory 内容页的评论样式，主要是要修改标签库中的“评论列表.config”标签文件（Template/模板方案/标签库/评论列表.config）以组织评论显示的结构。

 　　修改后的标签内容如下：

<root>
<LabelType>通用列表标签</LabelType>
<LabelImage>../../Admin/Images/LabelIco/GetArticleCustom.gif</LabelImage>
<LabelIntro>DIV格式的简单评论列表</LabelIntro>
<LabelDataType>sql_sysquery</LabelDataType>
<attributes>
<name>gid</name>
<default>1</default>
<intro>内容ID</intro>
</attributes>
<attributes>
<name>listnum</name>
<default>10</default>
<intro>显示数量</intro>
</attributes>
<LabelSqlString>SELECT Top @pagesize * FROM PE_Comment WHERE Commentid NOT IN (SELECT TOP @startrow Commentid FROM PE_Comment where GeneralID = @gid ORDER BY UpdateDateTime DESC) and (GeneralID = @gid) AND Status=1 ORDER BY UpdateDateTime DESC</LabelSqlString>
<LabelTemplate><![CDATA[<?xml version="1.0" encoding="utf-8"?>
<xsl:transform version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:pe="labelproc" exclude-result-prefixes="pe">
<xsl:param name="SystemCurrentPage" />
<xsl:param name="listnum" />
<xsl:output method="html" />
<xsl:template match="/">
<xsl:variable name="loginedusername" select="pe:LoginedUserName()"/>
<xsl:variable name="isadminlogined" select="pe:IsAdminLogined()"/>
<xsl:if test="count(/NewDataSet/Table)=0" >
<div class="child_list">
<ul>
<li>尚无评论!</li>
</ul>
</div>
<div class="child_list_Shadow"></div>
</xsl:if>
<xsl:for-each select="NewDataSet/Table">
<xsl:variable name="userimg" select="pe:GetUserFace(UserName)"/>

<div class="child_list">
<div class="comment_r">
<p>
<!--顶踩-->
<span id="LblPKOppose">
<span>{PE.Label id="评论辩论统计人数" CommentID="<xsl:value-of select="CommentID"/>" Position="-1" /}</span>
<a>
<xsl:attribute name="href">
<xsl:value-of select="pe:InstallDir()"/>Comment/CommentPKZoneManage.aspx?CommentID=<xsl:value-of select="CommentID" />&amp;Id=<xsl:value-of select="GeneralID" />&amp;Title=<xsl:value-of select="CommentTitle" />
</xsl:attribute>
<xsl:attribute name="onkeydown">return Oppose(event);</xsl:attribute>
<xsl:attribute name="onmouseout">jsAreaMouseOut(event);</xsl:attribute>
<xsl:attribute name="onmouseover">PopupArea(event, 'Oppose<xsl:value-of select="CommentID" />')</xsl:attribute>踩</a>
</span>
<span id="LblPKAgree">
<span>{PE.Label id="评论辩论统计人数" CommentID="<xsl:value-of select="CommentID"/>" Position="1" /}</span>
<a>
<xsl:attribute name="href">
<xsl:value-of select="pe:InstallDir()"/>Comment/CommentPKZoneManage.aspx?CommentID=<xsl:value-of select="CommentID" />&amp;Id=<xsl:value-of select="GeneralID" />&amp;Title=<xsl:value-of select="CommentTitle" />
</xsl:attribute>
<xsl:attribute name="onkeydown">return Agree(event);</xsl:attribute>
<xsl:attribute name="onmouseout">jsAreaMouseOut(event);</xsl:attribute>
<xsl:attribute name="onmouseover">PopupArea(event, 'Agree<xsl:value-of select="CommentID" />')</xsl:attribute>顶</a>
</span>
</p>
<p>
<!--引用-->
<span id="LblExcerpt"> <a>
<xsl:attribute name="href">
<xsl:value-of select="pe:InstallDir()"/>Comment/CommentExcerpt.aspx?CommentID=<xsl:value-of select="CommentID" />&amp;Id=<xsl:value-of select="GeneralID" />&amp;Title=<xsl:value-of select="CommentTitle" /></xsl:attribute> <xsl:attribute name="target">_blank</xsl:attribute>引用</a>
</span>
<!--PKZone-->
<span id="LblPKZone"> <a>
<xsl:attribute name="href" >
<xsl:value-of select="pe:InstallDir()"/>Comment/CommentPKZoneManage.aspx?Id=<xsl:value-of select="GeneralID" />&amp;CommentID=<xsl:value-of select="CommentID" />&amp;Title=<xsl:value-of select="CommentTitle" />
</xsl:attribute> <xsl:attribute name="target">_blank</xsl:attribute>PK Zone</a>
</span>
</p>
</div>
<div class="comment_l">
<!--标题-->
<h4>
<span id="ctl00_CphContent_LblTitle">
<xsl:value-of select="pe:FiltText(CommentTitle)"/>
</span>
</h4>
<h6>
<!--姓名-->
<xsl:value-of select="ReplyUserName"/>
<xsl:if test="UserName = '游客'">
游客
</xsl:if>
<!--时间-->
　<xsl:value-of select="pe:FormatDate(UpdateDateTime,'yy-mm-dd hh:mm:ss')"/>
</h6>

<p>
<!--楼-->
<div class="comment_listnum">
第<span>
<xsl:number value="position() + ($listnum * ($SystemCurrentPage - 1))" />
</span>楼
</div>
<!--内容-->
<span id="LblContent">
<span id="commenttxt_{CommentID}">
<xsl:choose>
<xsl:when test="IsPrivate = 'false'">
<xsl:value-of  select="pe:FiltText(Content)"/>
</xsl:when>
<xsl:otherwise>
<xsl:choose>
<xsl:when test="(UserName=$loginedusername and $loginedusername!='') or $isadminlogined='true'">
<xsl:value-of  select="pe:FiltText(Content)"/>
</xsl:when>
<xsl:otherwise>
<h6>（本评论只有评论人和管理员可见！）</h6>
</xsl:otherwise>
</xsl:choose>
</xsl:otherwise>
</xsl:choose>
</span>
</span>
</p>
</div>
<!--管理员回复-->
<xsl:if test="ReplyAdmin != '' and Reply !=''" >
<xsl:choose>
<xsl:when test="ReplyIsPrivate='false'">
<div class="Reply">
<h6><span>管理员回复　</span><xsl:value-of select="pe:FormatDate(ReplyDatetime,'yy-mm-dd hh:mm:ss')"/></h6>
<xsl:value-of select="Reply"/>
</div>
</xsl:when>
<xsl:otherwise>
<xsl:if test="UserName=$loginedusername and $loginedusername!=''">
<div class="Reply">
<h6><span>管理员回复　</span><xsl:value-of select="pe:FormatDate(ReplyDatetime,'yy-mm-dd hh:mm:ss')"/></h6>
<xsl:value-of select="Reply"/>
</div>
</xsl:if>
</xsl:otherwise>
</xsl:choose>
</xsl:if>
</div>
<div class="child_list_Shadow"></div>

<!--顶快捷内容-->
<div>
<xsl:attribute name="id">Agree<xsl:value-of select="CommentID" />
</xsl:attribute>
<xsl:attribute name="class">comment_agree</xsl:attribute>
<ul>
<li>
<xsl:attribute name="class">pkzone</xsl:attribute>
<xsl:attribute name="onclick">addpkzone(<xsl:value-of select="CommentID" />,1,this.innerHTML)</xsl:attribute>
<xsl:attribute name="onmouseover">this.className='pkzoneover'</xsl:attribute>
<xsl:attribute name="onmouseout">this.className='pkzone'</xsl:attribute>精彩！一针见血
</li>
<li>
<xsl:attribute name="class">pkzone</xsl:attribute>
<xsl:attribute name="onclick">addpkzone(<xsl:value-of select="CommentID" />,1,this.innerHTML)</xsl:attribute>
<xsl:attribute name="onmouseover">this.className='pkzoneover'</xsl:attribute>
<xsl:attribute name="onmouseout">this.className='pkzone'</xsl:attribute>观点独到^_^
</li>
<li>
<xsl:attribute name="class">pkzone</xsl:attribute>
<xsl:attribute name="onclick">addpkzone(<xsl:value-of select="CommentID" />,1,this.innerHTML)</xsl:attribute>
<xsl:attribute name="onmouseover">this.className='pkzoneover'</xsl:attribute>
<xsl:attribute name="onmouseout">this.className='pkzone'</xsl:attribute>说的很对！
</li>
<li>
<xsl:attribute name="class">pkzone</xsl:attribute>
<xsl:attribute name="onclick">addpkzone(<xsl:value-of select="CommentID" />,1,this.innerHTML)</xsl:attribute>
<xsl:attribute name="onmouseover">this.className='pkzoneover'</xsl:attribute>
<xsl:attribute name="onmouseout">this.className='pkzone'</xsl:attribute>您说的有道理
</li>
</ul>
</div>
<!--踩快捷内容-->
<div>
<xsl:attribute name="id">Oppose<xsl:value-of select="CommentID" />
</xsl:attribute>
<xsl:attribute name="class">comment_agree</xsl:attribute>
<ul>
<li>
<xsl:attribute name="class">pkzone</xsl:attribute>
<xsl:attribute name="onclick">addpkzone(<xsl:value-of select="CommentID" />,-1,this.innerHTML)</xsl:attribute>
<xsl:attribute name="onmouseover">this.className='pkzoneover'</xsl:attribute>
<xsl:attribute name="onmouseout">this.className='pkzone'</xsl:attribute>乱七八糟说什么？
</li>
<li>
<xsl:attribute name="class">pkzone</xsl:attribute>
<xsl:attribute name="onclick">addpkzone(<xsl:value-of select="CommentID" />,-1,this.innerHTML)</xsl:attribute>
<xsl:attribute name="onmouseover">this.className='pkzoneover'</xsl:attribute>
<xsl:attribute name="onmouseout">this.className='pkzone'</xsl:attribute>您说的没道理~~
</li>
<li>
<xsl:attribute name="class">pkzone</xsl:attribute>
<xsl:attribute name="onclick">addpkzone(<xsl:value-of select="CommentID" />,-1,this.innerHTML)</xsl:attribute>
<xsl:attribute name="onmouseover">this.className='pkzoneover'</xsl:attribute>
<xsl:attribute name="onmouseout">this.className='pkzone'</xsl:attribute>简直是不知所云O^O
</li>
</ul>
</div>

</xsl:for-each>
</xsl:template>
</xsl:transform>]]></LabelTemplate>
<UsePage>True</UsePage>
<LabelSqlCount>select count(*) from PE_Comment where GeneralID = @gid AND Status=1</LabelSqlCount>
<OutType>sin</OutType>
<CacheTime>12</CacheTime>
</root>

 　　CSS 定义如下：

/* --内容页样式-- */
.comment_l {
    margin-right: 155px;
}
.comment_l p {
    margin-right: 155px;
}
.comment_l h6 {
    color: #ccc;
}
.comment_r {
    float: right;
    width: 130px;
    text-align: center;
}
/* 楼 */
.comment_listnum {
    margin-right: 20px;
    float: left;
    font: normal normal bold 16px/50px Arial, "宋体", Helvetica, sans-serif;
    color: #ccc;
}
.comment_listnum span {
    font-size: 36px;
    color: #aaa;
}
/* 顶踩 */
.comment_r span#LblPKAgree, .comment_r span#LblPKOppose {
    float: left;
    background: url(images/ding.gif) no-repeat left top;
    display: block;
    height: 75px;
    width: 58px;
    font-size: 20px;
    font-weight: bold;
}
.comment_r span#LblPKOppose {
    float: right;
    background-position: right -90px;
}
.comment_r span#LblPKAgree span, .comment_r span#LblPKOppose span {
    margin-bottom: 8px;
    display: block;
    line-height: 30px;
    color: #c00;
    font-size: 24px;
}
.comment_r span#LblPKAgree a, .comment_r span#LblPKOppose a {
    color: #fff;
}
/* 顶踩下拉 */
.comment_agree {
    position: absolute;
    padding: 5px;
    width: 120px;
    min-width: 100px;
    height: auto;
    border: 1px solid #d3d3d3;
    background-color: white;
    display: none;
}
/* 评论PK快捷短语变色 */
.pkzoneover {
    cursor :pointer;
    background: #eee;
    color: #c00;
}

/* 引用和PK */
.comment_r span#LblExcerpt, .comment_r span#LblPKZone {
    float: left;
    margin-left: 5px;
    padding-left: 20px;
    background: url(images/bg_ico5.gif) no-repeat left -38px;
    display: block;
    height: 18px;
}
.comment_r span#LblPKZone{
    float: right;
    background-position: left -178px;
}
/* 管理员回复 */
.Reply{
    border: 1px solid #ccc;
    padding: 5px;
    background: #f8f8f8;
    clear: both;
}
.Reply h6{
    color: #ccc;
}
.Reply h6 span{
    color: #008E9F;
    font-weight: bold;
}
#LblContent　h6{
    color: #ccc;
    background: none;
}

/* --引用页样式-- */
ul.Comment_excerpt_l li, ul.Comment_excerpt_r li{
    background: none;
    line-height: 30px;
}
ul.Comment_excerpt_l li.txt, ul.Comment_excerpt_r li.txt{
    line-height: 122px;;
}
ul.Comment_excerpt_l li{
    text-align: right;
    background: url(images/bg_line.gif) no-repeat 0px bottom;
    padding-right: 20px;
}

/* --PK页样式-- */
.center_pk_right{
    width: 47%;
    float: right;
    text-align: left;
}
.center_pk_left{
    margin-right: 50%;
    border-right: 1px dashed #d3d3d3;
    text-align: right;
    padding-right: 2%;
}
.center_pk_right li{
    background: url(images/bg_line.gif) no-repeat left bottom;
}
.center_pk_left li{
    background: url(images/bg_line.gif) no-repeat right bottom;
}
.center_pk_right li, .center_pk_left li{
    line-height: 30px;
}

 

作者：yahu 发布时间：2008年09月26日 点击数： 【收藏】 【打印文章】
上一篇：网站地图中样式的控制　　下一篇：解决浮动与非浮动元素在 li 中布局的对齐问题
查看本文的所有评论 >>网友评论
ed hardy nfl jerseys replica handbags christian louboutin louboutin
网站地图  |  关于站长  |  友情链接  |  版权声明top
css 3 xhtml 1.0 strict PowerEasy® SiteFactory™

Copyright © 2003- PowerEasy Yahu All Rights Reserved.

Power by PowerEasy® SiteFactory™ 3.0　备案/许可证编号粤ICP备09060397号