【SharePoint 中如何将HTML文件转换为母版页】分享给互联网技能从业者学习和参考。
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会覆盖掉之前修改的。