Click here to Skip to main content
15,886,362 members
Articles / Web Development / CSS
Tip/Trick

Hiding Title Bar, Navigation, Breadcrumb section in SharePoint 2010

Rate me:
Please Sign up or sign in to vote.
4.00/5 (1 vote)
10 Apr 2012CPOL 56.3K   1  
Customizing your SharePoint pages without editing the master page.

Introduction

In looking for a way to hide some of the navigation / bloat in SharePoint 2010, I found many articles instructing people to edit the master page in order to hide various sections.

In my opinion, it is preferred not to edit the master page and instead use JavaScript or CSS when you can in order to achieve the same goal.

Using the code 

Add a "Content Editor" web part to your page. Click "Edit web part" and choose "Edit HTML source".

A box will appear which will allow you to put in any custom JavaScript or CSS you want. In this case, I want to remove the left nav, the top breadcrumb / title bar, but keep the top nav:

CSS
<style type="text/css">
BODY #s4-leftpanel {
	DISPLAY: none
}
.s4-ca {
	MARGIN-LEFT: 0px
}
.s4-title {
	DISPLAY: none
}</style>

Finally, set the "Chrome Type" to None so that the title of the web part is not visible.

If you open your master page, you can look at the ID or class names in order to tailor this look to what you need.

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


Written By
Web Developer
United States United States
This member has not yet provided a Biography. Assume it's interesting and varied, and probably something to do with programming.

Comments and Discussions

 
-- There are no messages in this forum --