Toggle Ribbon with JQuery

To toggle 2010's ribbon neat and short:

Reference JQuery:
<script src="/sites/inet/_js/jquery-1.4.4.min.js" type="text/ecmascript"></script>
Put this either in a separate .js and reference the js file:
$(document).ready(function(){
    $('#s4-ribbonrow').hide();
    $('#toggleribbon').click(function() {
         $('#s4-ribbonrow').toggle();
    });
 });

Put this some where.  This is what you will click to toggle the ribbon:
<img id="toggleribbon" src="/../../images/imgToggle.jpg"/>

Custom form did not stick to list

A site owner customized a new form for a list.  He then went into SharePoint Designer and went to list properties to set the form as the 'new item form'.  When he clicked OK, the setting did not seem to be saved and reverted back to the original newform.aspx. 

Solution: Under 'List Properties' -> 'Supporting Files' (4th tab),  make sure the second drop down 'Content type specific forms' is set to 'item', then go and select the new customized form:

Cannot connect to sql express 2008, server doesn't support requested protocol

Got the following error:

Need to enable TCP/IP on Sql Server Configuration Manager:

Once TCP/IP is enabled, restart the SQL Instance:

Now connecting from VS 2010 works. 

Hide left nav

Hiding the left nav:

<script type="text/javascript"> 
 $(document).ready(function(){
    $("#s4-leftpanel").addClass("hide");
    $("#MSO_ContentTable").css("margin-left", "-10px");  //adjust for the margin
 });
</script>

The css:
.hide{
 display:none;
}

Add Left Nav to new page

1. Open the page in SharePoint Designer 2010.

2. Go to the 'style' tab in the ribbon, on the 'master page' section, click on 'Attach' and attach the custom (or default) master page:

3. Afterwards, you should see something like this:

  The place holder for left nav:



4.  Select the PlaceHolderleftNavBar, click on the arrow and select 'Default to Master's content'.  The page should now show the left nav:

SharePoint 2010 branding: webpart

A really nice article on rounding corners for the webpart:
https://www.nothingbutsharepoint.com/sites/eusp/Pages/web-part-style-in-sharepoint-2010.aspx

SharePoint 2010 branding: keep title area visible

To keep the title area visible when clicking on the ribbon commands, modify #s4-titlerow in the css to:

#s4-titlerow {      display: block !important;  }

SharePoint 2010 branding: left nav accordion, highlight location

Collapse/expandable left nav:
$(document).ready(function() {
 $("#s4-leftpanel-content ul.root>li.static").css("border-bottom","1px Solid #eaeaea");

 $("div.s4-ql div.menu-vertical > ul.root > li.static >a").each(function()
   {    
    // Does this have children UL elements
     if($(this).parent().children("ul").size() > 0){

   //initial load hide
   $(">ul", $(this).parent()).hide();
    $($(this).parent()).addClass("cssClosed");
  
    $("div.menu-vertical>ul.root>li.static>ul.static>li.selected").parent().css("display", "block");
    $("div.menu-vertical>ul.root>li.static>ul.static>li.selected").parent().parent().addClass("cssOpen");
  
    //add toggle
    $(this).toggle(function() {
    $(">ul", $(this).parent()).show("slow");
    $($(this).parent()).removeClass("cssClosed");
    $($(this).parent()).addClass("cssOpen");

     },
     function() {
    $(">ul", $(this).parent()).hide("slow");
    $($(this).parent()).removeClass("cssOpen");
    $($(this).parent()).addClass("cssClosed");
     }
   );
        
  }      
  });

});

The css:
.cssClosed {
 background:url('/_layouts/images/Menu-right.gif') no-repeat 160px 7px;
}
.cssOpen{
 background:url('/_layouts/images/Menu2.gif') no-repeat 150px 7px;
}

The result (closed):

The result (opened):

Result selected:

SharePoint 2010 branding: left nav 2

From:

to:

Css modification:
Modify:
.s4-ql,.s4-specialNavLinkList{
list-style-type:none;
margin:0px 0px 20px 0px;
padding:0px;
}

to:.s4-ql,.s4-specialNavLinkList{
list-style-type:none;
margin:0px 0px 5px 0px; /*space between recycle bin and lists*/
padding:0px;
}

SharePoint branding: left nav

To minimize the space between the left nav headings and the below links, update this style:

.s4-ql ul.root ul{
margin:0px 0px 20px 0px;
padding-left:0px;
}

to

.s4-ql ul.root ul{
margin:0px 0px 0px 0px;
padding-left:0px;
}

Page will change from:

to