June 20, 2012

Hiding Content in Master Pages, Page Layouts

Heather Waterman recently published a helpful article on the "proper" way to hide ContentPlaceHolder content in a SharePoint master page. After reading it I thought that rather than simply tweeting out the link I'd elaborate a bit more to provide some additional details and a second, also proper, option.

In her real-life example, a past developer had put comments around a content placeholder in the master page. Therefore, when someone attempted to edit a page which referenced that placeholder using SharePoint Designer, they got an error in Design View stating that "The page has one or more <asp:Content> controls that do not correspond with <asp:ContentPlaceHolder> controls in the Master Page. This is not entirely true, and is another silly SPD behavior. The ContentPlaceHolder control DOES exist in the master page, and DOES render the content specified by the page layout! It just isn't seen by the user because it is commented out. For example, when I place a comment around the "PlaceHolderPageTitleInTitleArea" placeholder in the v4.master page, the page loads successfully - I simply can't see the page title:



But if I view the page source, it shows that it rendered as it always does:


Of course, this is the beauty and basic functionality of a scripting language like ASP.NET or PHP - that the server-side code is intermixed with but still independent from the surrounding HTML. The HTML comment tags are irrelevant to the ASP code which identifies and fills in the placeholder content.

If we remove an <asp:ContentPlaceHolder> control from the master page completely, then we'll see the same error in SharePoint Designer, but we'll also get an application error when trying to view the page:


So if commenting out placeholder content causes a problem in SharePoint Designer (in addition to making the master page code harder to read) and removing the placeholder completely causes total chaos, what's the best way to hide placeholder content? Well, there are actually two options. Heather's explanation is one of them: move the placeholder into an <asp:Panel visible="false"> control. This is how the nightandday.master page used by the publishing infrastructure hides a number of placeholders. It is worth noting that you can stick as many placeholders as you'd like inside of the same invisible panel.

The other option, which is used by the default v4.master page in SharePoint 2010, is to wrap a placeholder in a tag with the "s4-die" class. This is SharePoint CSS class with "display: hidden" on it, rendering all the contents invisible.

In my opinion, neither approach is ever THE right or wrong one. If the placeholder already exists within it's own <div> tag, I prefer to simply add the "s4-die" class to it so that it's still easy to see where the content was originally intended to belong and is easier to make reappear in the future. However, if there are multiple wrappers around a placeholder or you're removing an entire section with multiple placeholders, then it seems much cleaner to move the placeholders into an invisible panel at the bottom of the page and completely delete the surrounding HTML.

I hope this sheds some additional light on the topic!

No comments:

Post a Comment