Loading...

Saturday, November 30, 2013

How to: Convert an HTML file into a master page in SharePoint 2013?

How to: Convert an HTML file into a master page in SharePoint 2013?
This seems to be easier way to convert  design html file to master page.
 I think , this is introduced to integrate html elements like header, footer, main contents into respective SharePoint elements like different content placeholder ids , SharePoint controls etc  in html file itself , so that this file is editable in any Non-SharePoint html editors . This is great. but for beginners this may be a little tricky.
I would suggest , rather than converting entire html file into master page , one should  start with startermaster.html.
To do so
1)Download startermaster.html from Master Page gallery.Open startermaster.html in browser and inspect header and footer elements in Developer tools
2)Now copy html elements like topnavigation div , logo div , search div etc from original html  file to
  startermaster.html (also rename this file to suitable name) at appropriate place.
3) This startermaster.html  is now ready for converting to master page .In this way , the html validation errors also can be avoided .Now embed SharePoint snippets at appropriate place.