Home » SharePoint 2013 » Modifying SharePoint 2013 Master Pages Part 2, Working with Master Pages with SharePoint Designer 2013

Modifying SharePoint 2013 Master Pages Part 2, Working with Master Pages with SharePoint Designer 2013

SharePoint Designer 2013 is the preferred method of customizing master pages for publishing sites in SharePoint 2013, on premises, or SharePoint Online, Office 365. In a video tutorial Making Changes to Master Pages, Yaroslav Pentsarskyy, SharePoint MVP and published author demonstrates how to use SharePoint Designer, 2013 to build a custom master page for a custom CSS. A subscription to our site is required to view the video tutorial.

The safest way to copy a master page, and its matching HTML file, is with SharePoint Designer, 2013. With a simply “ctrl C” and “ctrl V” procedure a master page can be copied into a local file suitable for customization. As Yaroslav notes in this video, inadvertently saving changes to the same file name for a master page is a very risky procedure. Once changed, the master page will no longer be accessible in its out of the box condition. Important features may be lost. Better to work with a copy when the objective is to create a new custom version of a master page.

The Master Page gallery can be accessed directly from SharePoint Designer 2013, with a click on the “Master Pages” link exposed in the “Site Objects” section of the left hand “Navigation” bar. SharePoint Designer 2013 will filter the master pages and layouts included in the “Master Pages and Layouts” gallery, providing a fast method of getting right to the master pages.

As we noted in the previous post to this blog, any customization needs to be effected through the .html version of the master page. SharePoint Designer 2013 will not permit users to modify the .master version of the master page. It’s fine working with the .html page. If a new .html page is saved, SharePoint Designer 2013 will automatically create a .master version of the page.

The “preview in the browser” feature of SharePoint Designer 2013 can be used to study the way a master page actually appears. As Yaroslav demonstrates, a benefit of using this feature for the Firefox browser is the access it will provide to Firebug as a method of identifying structural elements of the page requiring customization. In the next post to this blog we will continue our commentary on this tutorial.

Ira Michael Blonder

© Rehmani Consulting, Inc. & Ira Michael Blonder, 2013 All Rights Reserved