Okay it’s been a while since my last post, but first of all: my best wishes for 2007 for everyone 😉
I needed to customize the view of data of the Announcement List webpart. As you probably know, the default view is just a listing of all your data like this:
This is basic but when your content of an announcement is way too long (@Body element) your page will be vertically very long, so you want perhaps this kind of layout:
@Title 01 (+link to full item) By @Author
@Title 02 (+link to full item) By @Author
It’s not difficult to create this but there is one sneaky thing …
Steps to create a custom view:
– Create a new view based on the standard view and with the necessary fields (mostly: Body, Author, Created, …)
– Give the view a name (results in a “name.aspx”).
– Startup your Sharepoint Designer to modify the layout of it.
– Navigate to the “name.aspx” and do a checkout of it.
– Right-click on the Announcement webpart on the page and choose for the action: “Convert to XSLT Dataview” (this will render the code into a XSLT in which you can easly modify the look and feel).
From this point you can just modify in the html-xslt code your created view. I’m not going to describe this, it’s very readable and straight forward html-XSLT.
The problem that I found was this: Normally you would say: "Hey if you want only the first 50 characters of your xml-element, just use then the substring(string, start, length) xsl-function and the job is done."
So in our situation => substring(@Body, 0, 50). Save the file and hit refresh.
This resulted in an empty cell, I didn’t saw the first 50 chars… I finally found that when you enter data in een RichHTML editor (used for the body of the announcement) sharepoint automatically adds a div-tag with class-attribuut which contains a GUID.
I entered this text via the sharepoint online interface
This is the body of my announcement, bla bla bla …
but actually, the text is always saved by sharepoint like this:
So, to correct the line of xsl-code I’ll needed to write:
substring(@Body, 63, 50)
You can see, those extra html-elements are generated as a wrapper around your body text. Just add 63 to your offset and yo are done…