sharepoint中控制的content query web part 控件的显示样式的xslt

 

      总的步骤如下：

      1、添加内容查询部件

      2、设置查询范围

      3、导出查询部件文件，.webpart文件

      4、修改webpart文件中的<property name="CommonViewFields" type="string" >Title,Text;Modified,DateTime</property>配置节，添加你想要显示的栏目

      5、用SPD打开顶级网站，在右侧的树目录中找到样式库，如下图所示

      sharepoint中控制的content query web part 控件的显示样式的xslt

      拷贝ContentQueryMain[控制内容显示]和ItemStyle【控制条目显示】一份，重命名为自定义的名称

     6、修改webpart文件中的<property name="MainXslLink" type="string" >/Style Library/XSL Style Sheets/ContentQueryMain_OUWeb_Bulletin.xsl</property>
              <property name="ItemXslLink" type="string" >/Style Library/XSL Style Sheets/ItemStyle_OUWeb_Bulletin.xsl</property>

      这两个配置节，样式路径选择为自定义的样式文件。

      7、保存修改之后的webpart文件，在网站导入这个webpart文件。

      8、效果出来了。

      9、以后就是修改xsl样式了，格式化显示。
      

 

      在SP的开发过程中，有的时候首页需要一些webpart来显示子网站的内容，显示一个标题，可以链接的，还有tooltip的，开始的时候我用content qeury web part ，后来发现他默认只能显示标题，什么时间啊，用户名啊，什么的都不能显示。

      过一段时间发现，我错误了，那个控件还是很强大的，详见微软的官网http://msdn.microsoft.com/en-us/library/bb447557.aspx。

     内容需要编辑ItemStyle.xsl，标题格式化需要编辑ContentQueryMain.xsl中的，下面是我添加的一个标题

   

 


        <xsl:variable name="Rows" select="/dsQueryResponse/Rows/Row" />
        <xsl:variable name="RowCount" select="count($Rows)" />
        <xsl:variable name="IsEmpty" select="$RowCount = 0" />
            <table id="cbqwp" cellspacing="0" cellpadding="0" border="1" bordercolor="#0099FF" class="cbq-layout-main" title="论坛热帖">
                <tr style="font-size:14px;background-color:#0099FF"><a href="#" style="font-weight:bolder;">论坛热帖</a>
                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a href="#">More</a>
                     <xsl:if test="$FeedEnabled = 'True'">
                        <div class="cqfeed">
                            <xsl:variable name="FeedUrl1" select="concat($SiteUrl,$FeedPageUrl,'xsl=1&amp;web=',$WebUrl,'&amp;page=',$PageId,'&amp;wp=',$WebPartId)" />
                            <a href="{cmswrt:RegisterFeedUrl( $FeedUrl1, 'application/rss+xml')}"><img src="\_layouts\images\rss.gif" border="0" alt="{cmswrt:GetPublishingResource('CbqRssAlt')}"/></a>
                        </div>
                        </xsl:if>
                </tr>
                <tr>
                    <xsl:choose>
                        <xsl:when test="$IsEmpty">
                             <xsl:call-template name="OuterTemplate.Empty" >
                                 <xsl:with-param name="EditMode" select="$cbq_iseditmode" />
                             </xsl:call-template>
                        </xsl:when>
                        <xsl:otherwise>
                             <xsl:call-template name="OuterTemplate.Body">
                                 <xsl:with-param name="Rows" select="$Rows" />
                                 <xsl:with-param name="FirstRow" select="1" />
                                 <xsl:with-param name="LastRow" select="$RowCount" />
                            </xsl:call-template>
                        </xsl:otherwise>
                    </xsl:choose>
                </tr>
            </table>
           
    </xsl:template>

 

     效果图如下

    sharepoint中控制的content query web part 控件的显示样式的xslt

 

      可是不是很理想，More应该在右面，还有啊，内容是三栏，上面如何也弄三栏和下面的配合的，还需要研究啊？那位知道的话，可以告诉我啊，还有啊，还可以弄幻灯片效果，是http://www.cnblogs.com/ghner这位老兄说的，可是他没有给出任务信息，http://www.cnblogs.com/ghner/archive/2008/06/16/1212775.html就是这个地址的效果，知道的老兄可以告知一下。

      刚才调整了一下ContentQuery.xsl文件中一些代码的位置，标题就好看多了，见下图，大家可以参看下面的代码，自己做一些修改，实现更强大的控制。

       刚开始我是在原来的table上面添加了一行，用来显示标题，现在我是添加一个table在原来的table上面，好像好多了。

      还有一点要注意，如果你修改自带的ContentQueryMain，全部的CQWP都会有影响。要想消除这种影响，就要先将原有的拷贝一份，该一个名字，然后再修改。最后在.webpart文件中引用自定义的ContentQueryMain,格式为

      <property name="MainXslLink" type="string">/Style Library/XSL Style Sheets/MyCustomCQMain.xsl</property>

      MainXslLink为原来的一个属性，原来的值为空，修改为上面的模式，MyCustomCQMain.xsl是自定义的文件名，还有其他的itemstyle，如果有需要的话，也最好自定义一些吧，这样就对原来的没有影响了。

sharepoint中控制的content query web part 控件的显示样式的xslt   

代码如下

 


        <xsl:variable name="Rows" select="/dsQueryResponse/Rows/Row" />
        <xsl:variable name="RowCount" select="count($Rows)" />
        <xsl:variable name="IsEmpty" select="$RowCount = 0" />
         <table id="cbqwp" cellspacing="0" cellpadding="0" border="1" bordercolor="#0099FF" class="cbq-layout-main" title="论坛热帖">
                <tr style="font-size:14px;background-color:#0099FF">
                    <td><a href="#" style="font-weight:bolder; font-size:14px;font-weight:bolder;">论坛热帖</a>
                            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                     </td>
                     <td>
                         <a href="#" style="font-weight:bolder; font-size:14px;font-weight:bolder;">Moresharepoint中控制的content query web part 控件的显示样式的xslt</a>
                     </td>
                     <td>
                         <xsl:if test="$FeedEnabled = 'True'">
                            <div class="cqfeed">
                                <xsl:variable name="FeedUrl1" select="concat($SiteUrl,$FeedPageUrl,'xsl=1&amp;web=',$WebUrl,'&amp;page=',$PageId,'&amp;wp=',$WebPartId)" />
                                <a href="{cmswrt:RegisterFeedUrl( $FeedUrl1, 'application/rss+xml')}"><img src="\_layouts\images\rss.gif" border="0" alt="{cmswrt:GetPublishingResource('CbqRssAlt')}"/>RSS</a>
                            </div>
                            </xsl:if>
                     </td>
                </tr>
        </table>
                
            <table id="cbqwp" cellspacing="0" cellpadding="0" border="1" bordercolor="#0099FF" class="cbq-layout-main" title="论坛热帖">
                <tr>
                    <xsl:choose>
                        <xsl:when test="$IsEmpty">
                             <xsl:call-template name="OuterTemplate.Empty" >
                                 <xsl:with-param name="EditMode" select="$cbq_iseditmode" />
                             </xsl:call-template>
                        </xsl:when>
                        <xsl:otherwise>
                             <xsl:call-template name="OuterTemplate.Body">
                                 <xsl:with-param name="Rows" select="$Rows" />
                                 <xsl:with-param name="FirstRow" select="1" />
                                 <xsl:with-param name="LastRow" select="$RowCount" />
                            </xsl:call-template>
                        </xsl:otherwise>
                    </xsl:choose>
                </tr>
            </table>
           
    </xsl:template>

      可以定制的，不过是用到处webpart文件，声明要使用的栏目，然后编写xslt，定义显示的格式，可以多列，可以自定义一些东西，不错。

      在xslt中还可以用函数来处理，格式化时间什么的。有计划以后写一个系列，最近开始学习java web编程，从基础开始学习，居然第一章就是xml、dtd、schema、xsl、xslt，所以才想起了SP中的xsl定义显示的格式。

      园子里面已经有很多的文章了，我就不写步骤了。留个标记。

      这位老兄总结的就很不错，谢谢了先。   http://www.cnblogs.com/heavencloud/archive/2009/03/28/1423788.html

<xsl:template name="ForumStyle" match="Row[@Style='ForumStyle']" mode="itemstyle">
        <xsl:variable name="SafeLinkUrl">
            <xsl:call-template name="OuterTemplate.GetSafeLink">
                <xsl:with-param name="UrlColumnName" select="'LinkUrl'"/>
            </xsl:call-template>
        </xsl:variable>
        <xsl:variable name="DisplayTitle">
            <xsl:call-template name="OuterTemplate.GetTitle">
                <xsl:with-param name="Title" select="@Title"/>
                <xsl:with-param name="UrlColumnName" select="'LinkUrl'"/>
            </xsl:call-template>
        </xsl:variable>
        <xsl:variable name="LinkTarget">
            <xsl:if test="@OpenInNewWindow = 'True'" >_blank</xsl:if>
        </xsl:variable>
        <div id="linkitem" class="item link-item">
            <table >
                   <tr>
                       <td width="200px">
                           <xsl:if test="string-length($DisplayTitle) = 0">
                               <a href="{$SafeLinkUrl}" target="{$LinkTarget}" title="{@Title}">
                                    <xsl:value-of select="$DisplayTitle"/>sharepoint中控制的content query web part 控件的显示样式的xslt
                            </a>
                           </xsl:if>
                           <xsl:if test="string-length($DisplayTitle) &lt;= 10">
                               <a href="{$SafeLinkUrl}" target="{$LinkTarget}" title="{@Title}">
                                    <xsl:value-of select="$DisplayTitle"/>sharepoint中控制的content query web part 控件的显示样式的xslt
                            </a>
                           </xsl:if>
                           <xsl:if test="string-length($DisplayTitle) &gt; 10">
                               <a href="{$SafeLinkUrl}" target="{$LinkTarget}" title="{@Title}">
                                    <xsl:value-of select="substring($DisplayTitle,1,9)"/>sharepoint中控制的content query web part 控件的显示样式的xslt
                            </a>
                           </xsl:if>                        
                       </td>
                       <td width="100px">
                           <xsl:value-of select='substring(@Modified,1,4)'></xsl:value-of>
                       </td>
                       <td align="right">回复数量:
                           <xsl:value-of select="@ItemChildCount"/>    
                       </td>
                   </tr>
           </table>
            
        </div>
    </xsl:template>

 

 

        下面是我从网上找到的一些资料，记录下来吧。

        http://blogs.msdn.com/ecm/archive/2006/10/25/configuring-and-customizing-the-content-query-web-part.aspx

        http://www.heathersolomon.com/blog/articles/customitemstyle.aspx

 

/* Item Styles - Store in a CSS file or the master page file*/        
.S2StyleImage {
    border-bottom: 1px rgb(251,230,187) solid;
    padding: 5px 7px 10px 0px;
    }
.S2StyleTitle {
    padding-top: 10px;
    }
.S2StyleTitle a, .S2StyleTitle a:link, .S2StyleTitle a:visited, .S2StyleTitle a:hover {
    font-weight: bold;
    font-size: 1.2em;
    }
.S2StyleDescription {
    padding: 5px 0px 10px 0px;
    border-bottom: 1px rgb(251,230,187) solid;
    }
.S2StyleBorder {
    border-bottom: 2px rgb(251,230,187) solid;
    }



<xsl:template name="S2Article_ShowImageTitleBody" match="Row[@Style='S2Article_ShowImageTitleBody']" mode="itemstyle">
        <xsl:variable name="SafeImageUrl">
            <xsl:call-template name="OuterTemplate.GetSafeStaticUrl">
                <xsl:with-param name="UrlColumnName" select="'ImageUrl'"/>
            </xsl:call-template>
        </xsl:variable>
        <xsl:variable name="SafeLinkUrl">
            <xsl:call-template name="OuterTemplate.GetSafeLink">
                <xsl:with-param name="UrlColumnName" select="'LinkUrl'"/>
            </xsl:call-template>
        </xsl:variable>
        <xsl:variable name="DisplayTitle">
            <xsl:call-template name="OuterTemplate.GetTitle">
                <xsl:with-param name="Title" select="@Title"/>
                <xsl:with-param name="UrlColumnName" select="'LinkUrl'"/>
            </xsl:call-template>
        </xsl:variable>
        <xsl:variable name="LinkTarget">
            <xsl:if test="@OpenInNewWindow = 'True'" >_blank</xsl:if>
        </xsl:variable>
        
        <xsl:variable name="bodyContent">
            <xsl:call-template name="removeMarkup">
                <xsl:with-param name="string" select="@PublishingPageContent"/>
            </xsl:call-template>
        </xsl:variable>
                        
       <table cellpadding="0" cellspacing="0" width="100%">
            <tr>
                   <td class="S2StyleTitle" colspan="2">
                    <xsl:call-template name="OuterTemplate.CallPresenceStatusIconTemplate"/>     
                        <a href="{$SafeLinkUrl}" target="{$LinkTarget}" title="{@LinkToolTip}">
                        <xsl:value-of select="$DisplayTitle"/>
                        </a>
                </td>
            </tr>
            <tr class="S2StyleBorder">
                 <xsl:if test="string-length($SafeImageUrl) != 0">
                    <td class="S2StyleImage"> 
                        <a href="{$SafeLinkUrl}" target="{$LinkTarget}">
                            <img class="image" src="{$SafeImageUrl}" alt="{@ImageUrlAltText}" />
                        </a>
                    </td>
                </xsl:if>
                <td class="S2StyleDescription" valign="top">
                   <xsl:value-of select="substring($bodyContent,1,100)"/>sharepoint中控制的content query web part 控件的显示样式的xslt (<a href="{$SafeLinkUrl}" mce_href="{$SafeLinkUrl}" target="{$LinkTarget}" title="{@LinkToolTip}">more</a>)
                </td>
            </tr>
        </table>
</xsl:template>    

<!-- Remove Markup from escaped page content - Call function in the style -->
<xsl:template name="removeMarkup">
    <xsl:param name="string" />
    <xsl:choose>
    <xsl:when test="contains($string, '&lt;')">
        <xsl:variable name="nextString">
            <xsl:call-template name="removeMarkup">
            <xsl:with-param name="string" select="substring-after($string, '&gt;')" />
            </xsl:call-template>
        </xsl:variable>
    <xsl:value-of select="concat(substring-before($string, '&lt;'), $nextString)" />
    </xsl:when>
    <xsl:otherwise>
        <xsl:value-of select="$string" />
    </xsl:otherwise>
    </xsl:choose>
</xsl:template>

 

      在显示富文本内容的时候，也就是html内容的时候，还可以去除html标记中的<br>之类的东西

/* Item Styles - Store in a CSS file or the master page file*/        
.S2StyleImage {
    border-bottom: 1px rgb(251,230,187) solid;
    padding: 5px 7px 10px 0px;
    }
.S2StyleTitle {
    padding-top: 10px;
    }
.S2StyleTitle a, .S2StyleTitle a:link, .S2StyleTitle a:visited, .S2StyleTitle a:hover {
    font-weight: bold;
    font-size: 1.2em;
    }
.S2StyleDescription {
    padding: 5px 0px 10px 0px;
    border-bottom: 1px rgb(251,230,187) solid;
    }
.S2StyleBorder {
    border-bottom: 2px rgb(251,230,187) solid;
    }



<xsl:template name="S2Article_ShowImageTitleDescrip" match="Row[@Style='S2Article_ShowImageTitleDescrip']" mode="itemstyle">
        <xsl:variable name="SafeLinkUrl">
            <xsl:call-template name="OuterTemplate.GetSafeLink">
                <xsl:with-param name="UrlColumnName" select="'LinkUrl'"/>
            </xsl:call-template>
        </xsl:variable>
        <xsl:variable name="SafeImageUrl">
            <xsl:call-template name="OuterTemplate.GetSafeStaticUrl">
                <xsl:with-param name="UrlColumnName" select="'ImageUrl'"/>
            </xsl:call-template>
        </xsl:variable>
        <xsl:variable name="DisplayTitle">
            <xsl:call-template name="OuterTemplate.GetTitle">
                <xsl:with-param name="Title" select="@Title"/>
                <xsl:with-param name="UrlColumnName" select="'LinkUrl'"/>
            </xsl:call-template>
        </xsl:variable>
        <xsl:variable name="LinkTarget">
            <xsl:if test="@OpenInNewWindow = 'True'" >_blank</xsl:if>
        </xsl:variable>
        <table cellpadding="0" cellspacing="0" width="100%">
            <tr>
                   <td class="S2StyleTitle" colspan="2">
                    <xsl:call-template name="OuterTemplate.CallPresenceStatusIconTemplate"/>     
                        <a href="{$SafeLinkUrl}" target="{$LinkTarget}" title="{@LinkToolTip}">
                        <xsl:value-of select="$DisplayTitle"/>
                        </a>
                </td>
            </tr>
            <tr class="S2StyleBorder">
                 <xsl:if test="string-length($SafeImageUrl) != 0">
                    <td class="S2StyleImage"> 
                        <a href="{$SafeLinkUrl}" target="{$LinkTarget}">
                            <img class="image" src="{$SafeImageUrl}" alt="{@ImageUrlAltText}" />
                        </a>
                    </td>
                </xsl:if>
                <td class="S2StyleDescription" valign="top">
                       <xsl:value-of select="@Description" />
                </td>
            </tr>
        </table>
</xsl:template>

<!-- Remove Markup from escaped page content - Call function in the style -->
<xsl:template name="removeMarkup">
    <xsl:param name="string" />
    <xsl:choose>
    <xsl:when test="contains($string, '&lt;')">
        <xsl:variable name="nextString">
            <xsl:call-template name="removeMarkup">
            <xsl:with-param name="string" select="substring-after($string, '&gt;')" />
            </xsl:call-template>
        </xsl:variable>
    <xsl:value-of select="concat(substring-before($string, '&lt;'), $nextString)" />
    </xsl:when>
    <xsl:otherwise>
        <xsl:value-of select="$string" />
    </xsl:otherwise>
    </xsl:choose>
</xsl:template>

       

相关文章：

猜你喜欢
相关资源
相似解决方案
热门标签
Java Python linux javascript Mysql C# Docker 算法 前端 SpringBoot Redis Vue spring 设计模式 .net core .net kubernetes c++ 数据库 数据结构 大数据 js 机器学习 微服务 Android Go 程序员 面试 JVM ASP.net core 云原生 人工智能 后端 PHP git CSS golang k8s Nginx Django mybatis 深度学习 多线程 React 架构 devops 爬虫 云计算 Spring Boot LeetCode