How to: Create a folder roll-up web part to display the number of items in the folders without the use of code

1. add a content query web part on your page.
2. edit web part
3. define the query
4. select the list type = Document Library
5. select the content type = Folder Content Types
6. select items of Folder content type
7. In the Additional Filters, type-in the name of the folder you wish to roll-up
8. Group and Sort if you need to
9. Never mind about the Styles at this point. Remember however that we will need to revisit later on.
10. Change the title of the web part if you need to and click OK.

At this point, you will have a web part that lists the folders with the specific name, site collection wide. However, the requirement is that you will display the number of child items next to the name of the folder. We haven’t achieved that yet. However, it’s not extremely hard to achieve. All you need to know is that SharePoint 2010 includes a property called ItemChildCount that you can use to get the required data.

11. Navigate to the /Style Library of your site collection
12. make a copy of the ItemStyle.xsl file for backup (append the word -Original to the title)
13. Check out the ItemStyle.xsl file
14. Start SharePoint Designer and edit the ItemStyle.xsl file.
15. search for “TitleOnly”. Copy the entire <xsl:template> tag (to the closing </xsl:template>
16. Paste what you copied over the HiddenSlots template.
17. Rename the template to something meaningful to you (you will need to replace the TitleOnly in the name and Row[@Style=’TitleOnly’] locations)
18. [not required] if you would like to include a link to the parent library of the folder, create a variable to store the URL like so (this can be the first thing inside your template tag):
<xsl:variable name=”FolderLocation”>
<xsl:value-of select=”substring-before(@LinkUrl, @Title)” />
19. Scroll down between the closing </div> and the closing </xsl:template> tags and create a new div to display the number of items that exist inside each of the rolled-up folders. Like so:
<div class=”Children”>Items: <xsl:value-of select=”substring-after(@ItemChildCount,’#’) ” /></div>

If you save at this point, the web part will not work as expected. Carry on and follow the rest of the points below.

20. [not required] if you opted for the location variable above, create another div under the Children div to display a link to the library, where the folder is located. Like so:
<div class=”Location”><a href=”{$FolderLocation}”>Location</a>: <xsl:value-of select=”$FolderLocation” /></div>
21. Save the file at this point. If SPD complains, you probably have forgotten to check out the file in the Style Library. Check it out and save again.
22. Check in the ItemStyle.xsl file in the Style Library. Select a major version so that the new style can be used by everyone in the site.

At this point, you have created the style for your web part, but the web part knows nothing about the ItemChildCount property. You will need to modify the webpart itself.

23. Navigate to the page where you added the webpart at the beginning of this tutorial.
24. Select Export from the context menu (right downwards arrow)
25. Save the webpart on your computer
26. You can use any text editor to read the .webpart file. Open it in notepad
27. Search for CommonViewFields. You will find an entry. It will most probably be blank. You will need to add a reference to the ItemChildCount here.
28. Add a reference to be used by the ItemStyle.xsl like so
<property name=”CommonViewFields” type=”string”>ItemChildCount, Text</property>
29. You can add more references to other properties by separating the “value, type” pairs with a semi-colon.
30. Save the file
31. Navigate to the webpart gallery on your website
32. Upload the webpart that you saved just now
33. Navigate to the page where you added the webpart earlier on
34. Remove the original webpart
35. Add the webpart that you uploaded just now
36. Exit the page edit mode and you should be seeing your webpart listing links to folders with the name you specified, the number of child items next to the name and, last, a link to the parent library for each folder.

MGR: the Intelogist

About MGR: the Intelogist

SharePoint Server developer, turned Sitefinity developer, turned Angular developer, turned SharePoint Online consultant, turned Unily consultant, turned O365 consultant... Never a dull moment!

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes:

<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong> 

This site uses Akismet to reduce spam. Learn how your comment data is processed.