sharepoint.H@ck

There are a few posts out there that tell you how you can show / hide the QuickLaunch / Treeview menus, but most of them did not really work out so well for me.

So here is how I did it through cusomized master pages:

• Open your / a default master page (obviously better to have your own) i nyour favorite editor.
• Look for the </HEAD> tag and paste the following Java Script before the closing tag:
  
  <script language="javascript">
  <!--
  function showhide(layer_ref) {
  var state = 'block';
  eval( "state=document.all." + layer_ref + ".style.display");
  if (state == 'block') {
  state = 'none';
  eval( "document.all[\"img" + layer_ref + "\"].src = \"_layouts/images/BLK_RGT.GIF\";");
  }
  else {
  state = 'block';
  eval( "document.all[\"img" + layer_ref + "\"].src = \"_layouts/images/BLK_LEFT.GIF\";");
  }
  if (document.all) { //IS IE 4 or 5 (or 6 beta)
  eval( "document.all." + layer_ref + ".style.display = state");
  }
  if (document.getElementById &&!document.all) {
  hza = document.getElementById(layer_ref);
  hza.style.display = state;
  }
  }
  //-->
  </script>
  
  Basically, this script allows us to show and hide the contents of any <div> tags contained within the .master page. If you look at the script you will see that I have used default MOSS images for my "show" and "hide" functions.
  
• Next: locate the TreeView / QuickLaunch tags you wish to hide, for the purposes of this blog I am going to modify the TreeView, find the following tag:
  
  <div class="ms-treeviewouter">
• Add the followinf attributes: <div class="ms-treeviewouter" id="regionalNav" style="display:block">
  
  What we are doing here is giving the TreeView an ID so we know what our action link is going to hide, and we are also specifying that we would like it to be displayed by default (change to display:none) if you wish to hide it by default.
  
• Next: locate the following code just above your treeview:
  
  <SharePoint:SPLinkButton runat="server" NavigateUrl="~site/_layouts/viewlsts.aspx" id="idNavLinkSiteHierarchy" Text="<%$Resources:wss,treeview_header%>" AccessKey="<%$Resources:wss,quiklnch_allcontent_AK%>"/></td>
  
  This is the title bar of the TreeView (the one that says "Site Hierarchy").
  
• Next: add the following code:
  
  <td style="margin-right:0pt" width="10%"><a id="lnkregionalNav" style="cursor:hand" onclick="showhide('regionalNav');"><img src="_layouts/images/BLK_LEFT.GIF" name="imgregionalNav"/></a></td>
  
  Here we are adding a new column for the "Show" and "Hide" images and actions. Note that I have stated that I want to show / hide the TreeView with the ID of "regionalNav". I have also specified what image should be displayed on initial page load (if you change the display state of the treeview; be sure to change the image to the correct one!)
  
• Save and apply your master pages :)
• You can do the same to any control with a div tag in your .master.

P.S I would dump screenshots if I were able to :)