Extend Focus on Content button

As we all know many customers want a custom look and feel for their SharePoint sites. This often includes a custom menu, and possible some other ‘non-page’ content, such as a twitter feed incorporated in the MasterPage.

SharePoint 2013 offers OOTB functionality for users to ‘Focus on content’ by clicking the corresponding button in the top right corner of the screen.

This normally hides the top and left navigation menu. However, in the case of a custom Master Page, you might want to extend that functionality to include different elements on the page.

Turns out that this is actually rather simple functionality to extend. All that you need is for your MasterPage to include JQuery, and a custom .js file that contains the following javascript:

As you can see we use the ID to get the corresponding div tag. This means that in the MasterPage the elements that you want to hide, need to have an ID. Then you can simply add new ID’s to the two lines for showing and hiding the div.

That’s it! Clicking the button now also hides or shows those DIV’s.

Source used: http://social.msdn.microsoft.com/Forums/sharepoint/en-US/4e0d077e-25bb-4dfa-86f3-7e1caffad108/focus-on-content-button