SharePoint 2013: content placeholders in seattle.master

Content placeholders

While beauty lies in the eyes of the beholder, SharePoint content lies in the boxes of placeholders. New version of SharePoint Designer 2013 does not provide any preview of a master page, and the template itself has changed substantially since 2010 version, at least in it’s appearance. The new template is a riddle, so there’s a need to make up for it!

Today I start the series of few articles on SharePoint branding with this simple resource which presents the location of default Content Placeholders in SharePoint 2013’s default masterpage seattle. This graphic should allow you to see the basic structure of a SharePoint page, and let you plan some rearrangements.

The image was generated by wrapping content placeholders in seattle.master master page into div’s, adding labels, and applying some styles to draw attention to those sections and ensure readability.

If you need to do some simple repositioning on a page, like placing calendar preview below the quicklaunch menu, the figure should be helpful. While designing a new branding project, quick look also might bring some inspirations.

Few words about branding SharePoint

Every now and then developers need to rearrange elements on a page to satisfy the needs of clients and creative designers. The subject of SharePoint branding is a long one, and in my opinion there has not been said enough on how to do it efficiently, and when to give up. When you are graphic designer who did never work with SharePoint, or front-end developer who is to work on a SharePoint theme for the first time, there’s a lot to learn that is different in this platform from other CMSes and frameworks.

In some of the upcoming posts I’ll try to sum up my recent experiences with branding, with aim of helping front-end developers and designers new to SharePoint to avoid some of mistakes I made and observed. The knowledge of modern web technologies, like HTML5, CSS3, jQuery will always support you in this task, but there’s some more to know for a good start. Stay tuned!

Sources

• Working with content placeholder controls on Office Dev Center
• Share Pointers: Using a Page Layout to Hide the Left Navigation on SDTimes. Shows practical use of specifying custom content controls.