SharePoint 2013 中将 HTML文件转换为母版页

ght

　　SharePoint 2013提供了很多新功能，下面我们看看将Html页面，转换为母版页的功能。这个功能更加方便设计人员设计母版页，并实施到sharepoint中去，是一个非常不错的功能。来来来，进入正题！~
　　1、 首先，新建一个Html页面，效果如下图：

　　预览效果：

　　2、 将这个html页面上传到sharepoint，我选择上传到“母版页样式库”；

　　3、 我选择作为“设计文件”上传，当然你也可以选择其他的文件类型；

　　4、 上传成功以后，点击“设置”—“设计管理器”，左侧导航选择“编辑母版页”；

　　5、 选择“将 HTML 文件转换为 SharePoint 母版页”，找到刚刚上传的html文件；

　　6、 选择我们上传的html文件，点击插入（如果你上传的不是设计文件，选择你上传的文件类型，才能找到你的html页面，默认是设计文件）；

　　7、 插入以后，稍等片刻，就可以看到转换成功（当然，你的html也符合标准，否则的话，可能会转换失败）；

　　8、 下面开始应用我们转换成功的母版页；

　　打开网站设置，网站母版页设置，发现下拉框里没有我们转换成功的，却只有系统自带的，好奇怪，打开spd看一眼！
　　9、 打开spd，找到母版页，发现有我们新转换的母版页，我很欣慰啊；

　　猜想：或许是因为转换的是asp.net母版页，自带的是母版页，所以下拉列表找不到？
　　10、 既然找不到，我就在spd直接设置为母版页试试；

　　中间会弹出是否更改为15的提示框，是或者否看你需要咯
　　11、 我在spd中设置为默认母版页，打开首页；

　　居然没有反应，跟之前一样，刷新了好几次，都这样！好吧，还有一个设置为自定义母版页，试试，看一看效果吧！
　　12、 设置为自定义母版页后，打开，终于出现我要的东西了！！

　　后话：谁翻译的spd，设置为默认母版页，其实改的系统母版页，而自定义母版页，改的是页面，这翻译真够坑爹的！！
　　13、 设置完系统母版页，发现一个问题，我们的内容心不在中间，而且样式跟之前也不一样了。后来查资料，转换之前的样式，不能卸载head标签里，否则会被覆盖掉。下面，我们修改这个母版页，把PlaceHolderMain放到中间吧。特别注意，我们要修改html文件，不要去修改master页面（给开发人员使用），html是设计人员使用的，修改以后会覆盖master，方便设计。

　　如上图，把PlaceHolderMain的div全部放在我们放内容的地方。而后看下效果，如下图：

　　终于看到我们的母版页的头部和尾部了！很欣慰，把丢了的样式加进去吧！
　　14、 添加样式的时候，发现，原来的样式只是被注释掉了，其实还在（如下图所示），好吧，还原回来！

　　当我试图把样式还原的时候，发现无论放在head标签或者body标签里，style样式都是不起作用的，不知道你们是不是一样，所以只好改为外部引用。
　　找了好久，找到样式表位置，跟10貌似位置不太一样，如下图：

　　加入我们自己的样式，如下图：

　　当然，我们也可以自定义一个样式表，然后引用。
　　15、 终于查看带效果的母版页了，不容易啊！如下图！效果一般，哈哈，就是测试一下，需要调整再调整了~~~

　　题外话：这样转换的模板，我们可以直接修改html页面，然后spd会自动修改master，如果修改了master再改html会覆盖掉之前修改的。