Monday, July 17, 2006

Modifying the WSS3 tree navigation control

I wanted to create a structure of sites and allow easy navigation between them. Sharepoint 2007 (or rather, WSS3) has a fantastic tree view of the site hierarchy that you can activate if you want through the site administration page.

One of the grate things about the tree view is that it expands on the server side. This means that the page wont suffer from bad performance even if the site tree is large (unless there are a lot of sites directly underneath it and not in a hierarchy).

I will explain in this article how to tweak some features of this control.

Step 1 - Turn on the tree-view navigation:

  1. Open the site you want to display the tree in
  2. Open the "site actions" dropdown and select site settings
  3. From the site actions, under "Look and Feel" click "Navigation Options"
  4. Tick the "Enable Tree View" box to show the tree view. Notice that you also have an option to disable quick launch, but that is for another article.
  5. Go back to the home page in your site:

So far, so good.

Now - my problem was that I wanted the users to see only the sites and not the document libraries. As you can see - the tree view by default is showing everything (my sites were blank sites so they didnt have any lists, but I want them to have lists and not to display them) including the "Form Templates" library in the top level site!

Step 2 - Modify the Control in the Master Page

  1. Open the site in frontpage.
  2. In the folder list, expand the "_catalogs" folder and then the "masterpage" folder and find the "default.master" page and open it.
  3. I prefer to work in split view - that way I can get to where I want in the code much faster. Just click on the tree control in the bottom pane, and the code pane at the top will jump to the code section of the tree.
  4. Find the piece of code that says ">SharePoint:sphierarchydatasourcecontrol<" as shown below:
  5. Modify the code- under "IncludeDiscussionFolders" add a new line and write (frontpage offers intellisense so it will help you write it) the code that says not to show document libraries, lists and folders:
  6. Save the file and exit sharepoint designer.

End Result

You can see that now the navigation shows a tree of only sites. You also learned how to show only document libraries, or only lists and so on. (note - there is a way to tell it not to show sub webs...can you figure it out yourself?)

Hope you enjoyed this. More to come!

if you liked this tip, help it by kicking it!
kick it on

[Update: 27/04/2007]
I have been asked by people "why can we not see the treeview after enabling it". Well, the answer is simple - the tree view control isn't in the master page for the page you are looking at. You will need to either change the master page itself, or set a different master page for the page.


Madhur said...

Great Post !!!
There are very few blogs on editing of sharepoint sites which features things like master pages.
I have hard time editing master pages and understanding its content placeholders. Still I am not able to fully brand the WSS v3 site.
One problem still remains is editing the application.master which is used by mysite and other central administration pages.

Anonymous said...

I just post about same tricks but with some other objective : always using the rootweb reference in the treeview

Enjoy SharePoint 2007

Anonymous said...

Do you know if it is possible to change the images used on the nodes of the SPTreeView?

Anonymous said...

It is possible to change the images used on the nodes of the SPTreeView by using the ExpandImageUrl, CollapseImageUrl and NoExpandImageUrl attributes from the default.master

Anonymous said...

Good One.
But I'm facing a problem while tryin g to create a Site using a template.

This is what i have done:
1) I have created a Blank Site.
2) Went to SiteActions -> SiteSettings->Tree View->Show Tree View Checked
3) Saved the Site as Template.
4) Created a Site with this Site Template.
5) But the Tree View is not coming in this new Site. I have to again in SiteActions -> SiteSettings->Tree View and checked that option.

My Question is Why it is not coming in the template itself.

I will be highly thankful if you can provide me a solution for this.

SR said...

Try setting the Treeviewenabled to true and Quicklaunchenabled to false when you create the new site from site template - it worked for me.. These properties are in SPWeb object

Anonymous said...

Great post. It gave me the idea that one could create an Outlook-style tree-view SharePoint 2007left-navigation by having tabs for the lists, libraries, and sites that would only show the corresponding nodes of the tree view.