Your very own Quick Launch

A question that gets asked often is about the Quick Launch menu in WSS sites. Whenever you create a list or document library, one of the options is to show it on the Quick Launch. This places it into a grouped category under Documents, Pictures, Lists, etc. It's very effective for directing your users to the content of the site. There are however sometimes where you want to control what you display here and in some cases, users get confused over seeing a heading called Surveys but none to be found. A simple fix is to load the page up in FrontPage and remove those sections. However here's a tip that makes it more flexible (yes, you'll still need to do this in FrontPage but only once).

The whole Quick Launch area is just a simple table made up of Navigation webbots and headings. Rather than having tables for our Quick Launch let's replace it with a new Web Part Zone. This way we can allow web developers (and/or people with the appropriate rights) to add web parts to this section rather than having them load up FrontPage to do any customization.

The table in question starts at line 118 of default.aspx. You can select it in design mode and either delete it or just clear out the contents (I suggest highlighting the contents and deleting it, leaving an empty table).

So this gobbly-gook:

<TD class="ms-navheader"><A HREF="layouts/1033/viewlsts.aspx?BaseType=1">
  Documents</A></TD></TR>
    <TR><TD style="height: 6px">
  <!--webbot bot="Navigation" S-Btn-Nobr="FALSE" S-Type="sequence" S-Rendering="html" S-Orientation="Vertical" B-Include-Home="FALSE" B-Include-Up="FALSE" U-Page="sid:1004" S-Bar-Pfx="<table border=0 cellpadding=4 cellspacing=0>" S-Bar-Sfx="</table>" S-Btn-Nml="<tr><td><table border=0 cellpadding=0 cellspacing=0><tr><td><img src='
layouts/images/blank.gif' ID='100' alt='Icon' border=0>&amp;nbsp;</td><td valign=top><a ID=onetleftnavbar#LABELID# href='#URL#'>#LABEL#</td></tr></table></td></tr>" S-Target TAG="BODY" --></TD></TR>
    <TR><TD class="ms-navheader"><A HREF="
layouts/1033/viewlsts.aspx?BaseType=1&ListTemplate=109">
  Pictures</A></TD></TR>
    <TR><TD style="height: 6px">
  <!--webbot bot="Navigation" S-Btn-Nobr="FALSE" S-Type="sequence" S-Rendering="html" S-Orientation="Vertical" B-Include-Home="FALSE" B-Include-Up="FALSE" U-Page="sid:1005" S-Bar-Pfx="<table border=0 cellpadding=4 cellspacing=0>" S-Bar-Sfx="</table>" S-Btn-Nml="<tr><td><table border=0 cellpadding=0 cellspacing=0><tr><td><img src='layouts/images/blank.gif' ID='100' alt='Icon' border=0>&amp;nbsp;</td><td valign=top><a ID=onetleftnavbar#LABELID# href='#URL#'>#LABEL#</td></tr></table></td></tr>" S-Target TAG="BODY" --></TD></TR>
    <TR><TD class="ms-navheader"><A HREF="layouts/1033/viewlsts.aspx?BaseType=0">
  Lists</A></TD></TR>
    <TR><TD style="height: 6px">
  <!--webbot bot="Navigation" S-Btn-Nobr="FALSE" S-Type="sequence" S-Rendering="html" S-Orientation="Vertical" B-Include-Home="FALSE" B-Include-Up="FALSE" U-Page="sid:1003" S-Bar-Pfx="<table border=0 cellpadding=4 cellspacing=0>" S-Bar-Sfx="</table>" S-Btn-Nml="<tr><td><table border=0 cellpadding=0 cellspacing=0><tr><td><img src='
layouts/images/blank.gif' ID='100' alt='Icon' border=0>&amp;nbsp;</td><td valign=top><a ID=onetleftnavbar#LABELID# href='#URL#'>#LABEL#</td></tr></table></td></tr>" S-Target TAG="BODY" --></TD></TR>
    <TR><TD class="ms-navheader"><A HREF="
layouts/1033/viewlsts.aspx?BaseType=3">
  Discussions</A></TD></TR>
    <TR><TD style="height: 6px">
  <!--webbot bot="Navigation" S-Btn-Nobr="FALSE" S-Type="sequence" S-Rendering="html" S-Orientation="Vertical" B-Include-Home="FALSE" B-Include-Up="FALSE" U-Page="sid:1006" S-Bar-Pfx="<table border=0 cellpadding=4 cellspacing=0>" S-Bar-Sfx="</table>" S-Btn-Nml="<tr><td><table border=0 cellpadding=0 cellspacing=0><tr><td><img src='layouts/images/blank.gif' ID='100' alt='Icon' border=0>&amp;nbsp;</td><td valign=top><a ID=onetleftnavbar#LABELID# href='#URL#'>#LABEL#</td></tr></table></td></tr>" S-Target TAG="BODY" --></TD></TR>
    <TR><TD class="ms-navheader"><A HREF="layouts/1033/viewlsts.aspx?BaseType=4">
  Surveys</A></TD></TR>
    <TR><TD style="height: 6px">
  <!--webbot bot="Navigation" S-Btn-Nobr="FALSE" S-Type="sequence" S-Rendering="html" S-Orientation="Vertical" B-Include-Home="FALSE" B-Include-Up="FALSE" U-Page="sid:1007" S-Bar-Pfx="<table border=0 cellpadding=4 cellspacing=0>" S-Bar-Sfx="</table>" S-Btn-Nml="<tr><td><table border=0 cellpadding=0 cellspacing=0><tr><td><img src='
layouts/images/blank.gif' ID='100' alt='Icon' border=0>&amp;nbsp;</td><td valign=top><a ID=onetleftnavbar#LABELID# href='#URL#'>#LABEL#</td></tr></table></td></tr>" S-Target TAG="BODY" --></TD></TR>
       <TR><TD style="padding-left:0px;padding-right:0px"><img width=1px src='/
layouts/images/blank.gif' ID='100' alt='Icon' border=0></TD>

Becomes this:

<TD class="ms-navheader">&nbsp;</TD></TR>
    <TR><TD style="height: 6px">&nbsp;</TD></TR>
    <TR><TD class="ms-navheader">&nbsp;</TD></TR>
    <TR><TD style="height: 6px">&nbsp;</TD></TR>
    <TR><TD class="ms-navheader">&nbsp;</TD></TR>
    <TR><TD style="height: 6px">&nbsp;</TD></TR>
    <TR><TD class="ms-navheader">&nbsp;</TD></TR>
    <TR><TD style="height: 6px">&nbsp;</TD></TR>
    <TR><TD class="ms-navheader">&nbsp;</TD></TR>
    <TR><TD style="height: 6px">&nbsp;</TD>

Optionally you can delete all the rows (the <TR> tags) and just have one row. Now place your mouse cursor where the empty table is and select Data | Insert Web Part Zone from the FrontPage menu. This creates a new zone where the menu was:

<WebPartPages:WebPartZone id="{8D0A3551-0BFE-4AEA-B16E-C70539440704}" runat="server" title="Zone 1">
</WebPartPages:WebPartZone>

Double click on the zone in design view and change the name to something meaningful (like "Menu"). Save the page and you're good to go. Now your web designers don't have to fire up FrontPage to change your system and you can drop any web part into that area.

Additional things you can do when you're in FrontPage:

  • Set the style of the <TD> tags to ms-bodyareaframe so any web parts you drop in here look like the rest of the page
  • Remove the "Quick Launch" image
  • Change the style of the surrounding table from ms-navframe to ms-bodyareaframe (or remove the style completely) so it doesn't stand out from the rest of the page.

Now what can you put in this new zone? Plenty.

You could create a custom list to hold menu links, adding columns to the list for visibility (like a checkbox called Published or Visible) then create a view that filters on that. Anytime you want to add a new menu item it's as easy as adding it a new item to the list (or changing a property of a previous one to make it appear in the view).

There are also some great treeview web parts out there (CorasWorks has one that gives you a heirachial tree view of the entire site and there are other freebies that show you an explorer like view of your document libraries). Look around and you'll find some great stuff.

You can also save this site as a template to recreate it easily or even replace the default.aspx page on the server so any new team sites are created with this capability. Lots of possiblities here so use your imagination.

Additional links:

Ian Morrish has a great article on creating a dynamic menu using Web Part Pages that exist in a document library.
Jim Duncan has a blog on how to use a XSLT Data View and grouping to create a custom expand/collapse behavior with lists. Combine this with Ian's menu and you'll have a slick UI that's all data driven from your site.

Have fun!

5 Comments

Comments have been disabled for this content.