无废话SharePoint入门教程四[创建SharePoint母版页]
朋友炒股两个月赚了10万,我帮他推广一下公众号,把钱用来投资总比放银行连通货膨胀都跑不过里强, 硬核离职,在家炒股 ,这是他每天的日志,有些经验是花钱也买不到的。
一、前言
文章成体系,如果有不明白的地方请查看前面的文章。
二、目录
1.创建HTML页面
2.将HTML文件转换为SharePoint母版页
3.在 SPD中修改母版页“PlaceHolderMain代码段”位置
4.发布母板页
5.使用母版页
6.最终效果
7.母版页转换中的重要知识点介绍
1.创建HTML页面
在电脑的任意位置(此处示例放到D盘的根目录下)创建TestMaster.html文件
(1)文件位置:
(2)文件源码:
- <!DOCTYPE html>
- <html>
- <head>
- <title>测试母版页</title>
- </head>
- <body>
- <div style="font-size: 24px; color: #ff0000; margin: 0px auto; text-align: center">这里是页头</div>
- <div style="font-size: 24px; color: #0000ff; margin: 0px auto; text-align: center">这里是页尾</div>
- </body>
- </html>
(3)效果预览
2.将HTML文件转换为SharePoint母版页
1.点击右上角的【小齿轮】--【设计管理器】--【编辑母版页】--【将HTML文件转换为SharePoint母版页】,如下图所示:
2.在弹出的”选择资产”页面点击【添加】,如下图所示:
3.在弹出的“添加母版页”页面中点击【浏览】找到在D盘的TestMaster.html文件并点击【确定】按钮,如下图所示:
4.在弹出的“母版页栏目库”设置中选择内容类型为“设计文件”并修改标题(此处为测试母版页),点击【保存】按钮,如下图所示:
5.在“选择资产”页面选择刚刚上传的TestMaster.html文件并点击【插入】按钮,如下图所示:
6.母版页转换成功,如下图所示:
3.在 SPD中修改母版页“PlaceHolderMain代码段”位置
1.找到已安装的SPD,如下图所示:
2.在SPD中打开你的网站,如下图所示:
3.点击导航中的【母版页】,双击【TestMaster.html】文件,如下图所示:
4.点击【编辑文件】,如下图所示:
5.找到”<div data-name=”ContentPlaceHolderMain”></div>”的div块状元素(一般会在整个页面的最下方),如下图所示:
6.将”<div data-name=”ContentPlaceHolderMain”></div>”的div块状元素拷贝到应该放置的位置(一般为页头和页尾之间)保存文件并关闭,如下图所示:
注:笔者曾经试过直接将ContentPlaceHolderMain代码段在创建html时就加入,但经过SP的转换后仍然会在最下方重新生成新的ContentPlaceHolderMain代码段,根据微软官方说明也没有查阅到可以在创建的时候“定位母版页的占位符”。但在SP中创建并转换然后通过SPD来修改才能完成这整体的一个步骤似乎是不合理的。
4.发布母板页
1.再次点击右上角的【小齿轮】--【设计管理器】--【编辑母版页】,如下图所示:
2.点击TestMaster后面的【…】,在弹出的功能项中再点击【…】,然后点击【发布主要版本】,如下图所示:
3.填写注释并点击【确定】按钮,如下图所示:
4.转换成功后状态改变了“已批准”,如下图所示:
5.使用母版页
1.点击右上角的【小齿轮】--【网站设置】--【母版页】,如下图所示:
2.在网站母版页中选择TestMaster,点击【确定】按钮,如下图所示:
6.最终效果
7.母版页转换中的重要知识点介绍
1.TestMaster.html与TestMaster.master
细心的朋友可能会看到,将 .html 文件转换为 SharePoint 2013 母版页后系统中会存在两个同名母版页文件,此篇文章中为:TestMaster.html与TestMaster.master。
TestMaster.html为微软为我们提供的可修改的文件,我们在修改母版页时直接在该文件上修改内容,保存 HTML 文件后,这些更改内容会同步到关联.master中。
TestMaster.master为在SP中实际应用的文件。该文件在默认的情况下是只读的,你不可以通过SP或其他文件进行修改,如果去掉了文件的“只读”属性强行修改该文件后,当你再次保存.html文件时,.master中的修改结果将会被.html覆盖。
2. 为什么要转换 HTML 文件,而不是从头开始创建 .master 文件?
在 SharePoint 2013 中,母版页就像在 ASP.NET 中一样工作,但 SharePoint 还要求特定于 SharePoint 的某些元素(如控件和内容占位符)必须存在于该页面上,SharePoint 才能正确呈现该母版页。使用设计管理器将 HTML 文件转换为完整功能的 SharePoint 母版页,您就不必知道 ASP.NET 或 SharePoint 特定标记,而将精力集中于用 HTML、CSS 和 JavaScript 设计您的网站。
3.如果我更习惯修改.master而不想使用.html转换,怎么办?
(1)在该母版页的设置中找到【编辑属性】,如下图所示:
(2)去掉关联文件的【对号】即可,如下图所示:
说明:本篇文章中的页头页尾为了减少信息量只做了两个DIV,掌握了方法后可以自定义扩展
版权:http://www.cnblogs.com/iamlilinfeng
无废话SharePoint入门教程四[创建SharePoint母版页]的更多相关文章
- 无废话ExtJs 入门教程四[表单:FormPanel]
无废话ExtJs 入门教程四[表单:FormPanel] extjs技术交流,欢迎加群(201926085) 继上一节内容,我们在窗体里加了个表单.如下所示代码区的第28行位置,items:form. ...
- 无废话SharePoint入门教程五[创建SharePoint页面布局]
一.前言 文章成体系,如果有不明白的地方请查看前面的文章. 二.目录 1.创建页面布局 2.首次使用页面布局 3.修改页面布局 4.使用页面布局 5.最终效果 1.创建页面布局 (1)打开设计管理器, ...
- 无废话WCF入门教程四[WCF的配置文件]
一.概述 配置也是WCF编程中的主要组成部分.在以往的.net应用程序中,我们会把DBConn和一些动态加载类及变量写在配置文件里.但WCF有所不同.他指定向客户端公开的服务,包括服务的地址.服务用于 ...
- 无废话WCF入门教程六[一个简单的Demo]
一.前言 前面的几个章节介绍了很多理论基础,如:什么是WCF.WCF中的A.B.C.WCF的传输模式.本文从零开始和大家一起写一个小的WCF应用程序Demo. 大多框架的学习都是从增.删.改.查开始来 ...
- 无废话ExtJs 入门教程十四[文本编辑器:Editor]
无废话ExtJs 入门教程十四[文本编辑器:Editor] extjs技术交流,欢迎加群(201926085) ExtJs自带的编辑器没有图片上传的功能,大部分时候能够满足我们的需要. 但有时候这个功 ...
- WCF入门教程(四)通过Host代码方式来承载服务 一个WCF使用TCP协议进行通协的例子 jquery ajax调用WCF,采用System.ServiceModel.WebHttpBinding System.ServiceModel.WSHttpBinding协议 学习WCF笔记之二 无废话WCF入门教程一[什么是WCF]
WCF入门教程(四)通过Host代码方式来承载服务 Posted on 2014-05-15 13:03 停留的风 阅读(7681) 评论(0) 编辑 收藏 WCF入门教程(四)通过Host代码方式来 ...
- 无废话ExtJs 入门教程十五[员工信息表Demo:AddUser]
无废话ExtJs 入门教程十五[员工信息表Demo:AddUser] extjs技术交流,欢迎加群(201926085) 前面我们共介绍过10种表单组件,这些组件是我们在开发过程中最经常用到的,所以一 ...
- 无废话ExtJs 入门教程二十一[继承:Extend]
无废话ExtJs 入门教程二十一[继承:Extend] extjs技术交流,欢迎加群(201926085) 在开发中,我们在使用视图组件时,经常要设置宽度,高度,标题等属性.而这些属性可以通过“继承” ...
- 无废话ExtJs 入门教程二十[数据交互:AJAX]
无废话ExtJs 入门教程二十[数据交互:AJAX] extjs技术交流,欢迎加群(521711109) 1.代码如下: 1 <!DOCTYPE html PUBLIC "-//W3C ...
随机推荐
- Mybatis框架基于注解的方式,实对数据现增删改查
编写Mybatis代码,与spring不一样,不需要导入插件,只需导入架包即可: 在lib下 导入mybatis架包:mybatis-3.1.1.jarmysql驱动架包:mysql-connecto ...
- cocos2dx UI总结
1.a->addChild(b); 如果b是一个layer,则默认是忽略锚点的,此时无论你怎么设置它的锚点都没用,必须先b->ignoreAnchorPointForPosition(fa ...
- 移动端重构系列-移动端html页面优化
对于访问量大的网站来说,前端的优化是必须的,即使是优化1KB的大小对其影响也很大,下面来看看来自ISUX的米随随讲讲移动手机平台的HTML5前端优化,或许对你有帮助和启发. 概述 1. PC优化手段在 ...
- 20161127-emmagee
Android 自动化测试 Emmagee Emmagee 是一个性能测试小工具 用来监控指定被测应用在使用过程中占用机器的CPU, 内存,流量资源的性能小工具 阅读目录 Emmagee 介绍 Emm ...
- jQuery get() 函数
get() 函数 用于获取当前jQueryobject对象所匹配的DOM元素 语法 jQueryobject.get(index)//因为在JQuery中.很多时候和[]等价所以jQueryobjec ...
- 说说focus /focusin /focusout /blur 事件
事件触发时间 focus:当focusable元素获得焦点时,不支持冒泡:focusin:和focus一样,只是此事件支持冒泡:blur:当focusable元素失去焦点时,不支持冒泡:focusou ...
- springmvc 用注解方式添加事务不生效解决方法
springmvc 事务注册有很多种方法,在此我只mark 用注解方式添加transaction不生效的解决办法. springmvc 注解方法添加事务步骤: 1.在 spring的 root-con ...
- C# 实现 Excel文件的数据导入
前台 <asp:FileUpload ID="fuFile" runat="server" /> 后台 public string GetExcel ...
- CentOS 安装 lamp(转)
一般情况下,安装的都是最新的正式版,除非你有特殊需求,要安装指定的版本,本文暂不讨论.从最基础的开始,一点点完成一个可用的 Linux 主机.这里就开始介绍如何在 CentOS 6.0 上安装 LAM ...
- ORACLE RAISE
ORACLE 出错信息的输出 偷懒的办法直接在Exception 后使用raise但是错误信息不是很完整使用RAISE_APPLICATION_ERROR(-20999, DBMS_UTILITY.f ...