Using custom XSL list rendering templatest in SharePoint 2010

When working with SharePoint 2010 solution you have to take a look at the Blog site template (C:\Program Files\Common Files\Microsoft Shared\Web Server Extensions\14\TEMPLATE\SiteTemplates\Blog), it’s site template that gives you set of cool new features, such as ability to present your pages as Wiki Pages, Masterpage that by default give you custom nav and more. One of the concepts in a blog template is a concept of post list or actual post item to appear as XSL view on the item or a list.

One of the great advantages of using XSL view webpart (XsltListViewWebPart) is that you can treat your items as a list item and apply filtering, sorting as well as XSL transformation rules to it. So in essence you have access to all of the fields that were give to you in the List view you’re referencing and you can transform the look and feel to however you want.

For example I have defined my page in ONET.XML the following way:

<Module Name=”MyModule” Url=”Lists/MyList” Path=”Lists\MyListDef”>
      <File Url=”MyPage.aspx” IgnoreIfAlreadyExists=”TRUE”>
        <View List=”301″ BaseViewID=”1″ WebPartZoneID=”Left” WebPartOrder=”1″>
<![CDATA[
                        <webParts>
                            <webPart xmlns="http://schemas.microsoft.com/WebPart/v3">
                                <metaData>
                                    <type name="Microsoft.SharePoint.WebPartPages.XsltListViewWebPart,Microsoft.SharePoint,Version=14.0.0.0,Culture=neutral,PublicKeyToken=71e9bce111e9429c" />
                                    <importErrorMessage>Cannot import this Web Part.</importErrorMessage>
                                </metaData>
                                <data>
                                    <properties>
                                        <property name="AllowConnect" type="bool">True</property>
                                        <property name="ChromeType" type="chrometype">None</property>
                                        <property name="AllowClose" type="bool">False</property>
                                    </properties>
                                </data>
                            </webPart>
                        </webParts>
                    ]]></View>
</File>
</Module>

In here the BaseViewID is the View defined in schema.xml that will pass all of the ViewFields that will be used in the view. If we deploy our page with XSLListViewWebPart just like this – we will have a regular out of the box SharePoint list view as is, but if we want to make it look good we have to use XSL.

First, we’ll reference our custom XSL sheet in schema.xml of you list definitions like this right under the view definition:

<XslLink>MySchema.xsl</XslLink>

The MySchema.xsl  will be looked for in the following folder (C:\Program Files\Common Files\Microsoft Shared\Web Server Extensions\14\TEMPLATE\LAYOUTS\XSL), which you can now provision your XSL to.

In this XSL you can define the template and how it’ll render your list by matching the BaseViewID that is being passed into the view:

<xsl:template match=”View[(@BaseViewID='1') and List/@TemplateType='301']“>
….
<xsl:template>

in here we make sure we apply correct template to the list of our interest (Template = 301) and to the right view of that list BaseViewID=1

Here you can define variety of fields and use HTML and JS to output them in a desired format. Check out one of the existing templates in C:\Program Files\Common Files\Microsoft Shared\Web Server Extensions\14\TEMPLATE\LAYOUTS\XSL for more reference.

Enjoy!

This entry was posted in sharepoint, sharepoint 2010 and tagged , , , , , . Bookmark the permalink.

Comments are closed.