SharePoint 2013—创建Master Page
本文主要介绍如何为SharePoint 2013网站创建Master Page。与以前版本开发不同,如果你熟悉html/CSS/JavaScript, 那么恭喜你,SharePoint2013的Master Page你已经掌握了90%。以前版本的Master Page开发是基于asp.net的,而SharePoint2013的Master Page是基于HTML的。本文将会一步一步来实现创建一个新的Master Page。
以http://sharepoint.microsoft.com/en-us/Pages/default.aspx为例子,该网站是微软SharePoint官方网站,我们要创建一个类似于它的2013网站。
SharePoint Master Page结构分析及准备工作
使用Master Page可以为网站中的页面创建一致的布局、样式。在本例中,导航,Log将会出现在网页顶部。
版本信息,相关链接等将会出现在网站底部。
网页中间的内容会出现在内容页里面,创建一个Page Layout即可。网页中间内容不在本文讨论范围之内,具体办法和SharePoint 2010类似。
第一步就是创建一个HTML页面,为了简化期间,直接使用图片来代替复杂的样式等内容,请自动忽略样式及美观。
HTML页面效果如下图:
HTML代码如下:
注意:如果想顺利将此文件转化为Master Page, 里面的HTML标签要闭合。不能出来错误或不完整的标签,例如少“</div>”。
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title></title>
<link rel="stylesheet" type="text/css" href="images/style.css"/>
</head>
<body>
<div class="warp">
<div class="header"><img src="Images/Header.png" /></div>
<div class="maincontent">网页主要内容会显示在这</div>
<div class="footer"><img src="Images/footer.png" /></div>
</div>
</body>
</html>
Design Manager
点击网站设置,在弹出菜单中就可以看到“Design Manager”。点击之后即可以将刚做的HTML页面转化为Master Page。
如果点击网站设置在弹出菜单中没有“Design Manager”,在网站设置中激活“Publishing”功能即可。
上传HTML文件及图片
在网站设置中,点击“Master pages and page layouts”。
然后将HTML文件上传到该文件夹中。
图片和样式上传到了网站”Images”文档库,所以在HTML页面中的图片地址稍后要做一些调整。
将HTML转换为Master Page
点击Design Manager,打开转换页面。选择4”Edit Master Pages”. 在打开的页面选择”Convert an HTML file to a SharePoint master page”.
在弹出的选择框中选择刚上传的HTML页面。
点击文件名开始转化。
系统会提示转化结果,下一步要做的就是将黄色的DIV区域移到将来编辑内容的区域。
用SharePoint Designer打开网站,然后在Master Pages中找到我们的HTML页面。在HTML文件的下方自动生成了同名的master page文件。
在高级模式下编辑HTML页面。可以自动SharePoint自动为HTML页面添加了很多标记。
找到黄色的DIV,然后将它移到中间内容区域。
最终形成的代码如下:
最终效果如下图:
将master page发布之后,就可以在网站设置中将网站master page换成自定义的。网页最终效果如下图:
转载于:https://www.cnblogs.com/crazysharepoint/archive/2012/11/26/SP2013MasterPage.html
SharePoint 2013—创建Master Page相关推荐
- 如何在SharePoint 2013 创建Power pivot 库(How to create a PowerPivot Gallery )及错误解决方法
如何在SharePoint 2013 创建Power pivot 库(How to create a PowerPivot Gallery ) 为了这样一个功能 浪费我一个上午的时间. 需求是在Sha ...
- 为SharePoint 2010创建Application Page
如果不了解什么是Application Page,可以参考我以前写过的这篇文章.SharePoint 2010的页面模型没有太多的变化,基本和2007保持一致.对于开发人员而言,为SharePoint ...
- SharePoint 2013 创建一个搜索中心和搜索设置
这篇文章不是太多深奥的东西,只是一个简单的搜索配置,假设你已经有了,请跳过这篇文章. 行,输入信息,大家都知道,搜索SharePoint一个主要特征.下列,我们在搜索中心创建个人资料. 1.创建Sea ...
- 通过SharePoint Designer对SharePoint 2010的Master Page进行自定制
1:需要在对应的SiteCollection 和 Site 中开启Publishing的服务 2:在Designer中创建自己的Master Page,进行对原始v4.master代码进行复制,和修改 ...
- SharePoint要在master page中动态显示List数据的几种方式
我们都知道,在SharePoint中,Content page继承自Page layout,而Page layout又继承自Master page.Master page的作用大家都知道,它定义了站点 ...
- SharePoint 2013创建应用程序时IIS端口文件夹下没文件
最近SharePoint 2007迁移到2013的时候,碰到创建应用程序时IIS端口文件夹下没文件的问题,网上找了大把的原因,终于在这里找到了解决方案: Fix: 1. Open IIS on the ...
- 利用SharePoint 2013 创建Service Desk 网站之发布表单模板到文档库
前面我们的表单模板基本上已经创建完成,接下来我们就该把这些表单模板发布到我们的网站,操作的方法如下: 1. 点击文件-发布到SharePoint服务器 2. 填写我们的发布地址: 3. 设置为表单库: ...
- SharePoint 2013中规划企业搜索体系结构
SharePoint 2013中规划企业搜索体系结构 摘要:了解如何规划小型.中型或大型企业搜索体系结构. 设置企业搜索体系结构之前,需要仔细规划很多事项.我们将逐步帮助您规划小型.中型或大型企业搜索 ...
- 在 SharePoint 2013 中选择正确的 API 集
决定使用哪个 API 集的因素 您可以在多个 API 集中选择一个来访问 SharePoint 2013 平台.您使用哪一个 API 集取决于以下因素: 应用程序的类型. 可能的类型包括但不限于以下不 ...
- SharePoint 2013 的硬件和软件要求
http://technet.microsoft.com/zh-CN/library/cc262485%28v=office.15%29.aspx 重要说明: 如果您就生产系统未满足本文档中所述的最低 ...
最新文章
- js 识别汉字和全角字符
- caffe loss
- Hybrid框架UI重构之路:三、工欲善其事,必先利其器
- 给WIN7安装盘添加双PE3.0
- java double精确比较,Java float比double更精确?
- poj 3486 A Simple Problem with Integers(树状数组第三种模板改段求段)
- ES6-----学习系列十三(类与对象)
- 高斯滤波/高斯平滑/高斯模糊的实现及其快速算法(Gaussian Filter, Gaussian Smooth, Gaussian Blur, Fast implementation)
- ckeditor 部分保存按钮去除_怎样去除mp4视频中的水印呢
- Sql Server Express版本升级到企业版
- mysql 数据库建模工具 mysqlworkbench
- AI近义词替换工具.v.1.2
- C语言学习 -- 数组
- 游戏修改器制作教程三:内存与Cheat Engine
- WPF界面美化(整体作用到控件),一步步教你使用FirstFloor.ModernUI
- 假设检验:使用p值来接受或拒绝你的假设
- 皓月酒店管理系统: Jquery + Servlet + Mybatis
- 想用FPGA加速神经网络,这两个开源项目你必须要了解
- 企业经营中的“细节杀”:无线AP让你比别人更快一步
- 因网络延迟造成数据库插入相同记录,如何解决.
热门文章
- iOS下拉刷新和上拉刷新
- 回顾云计算项目的得与失
- jquery 分页插件
- mysql sqrt_详解MySQL中的SQRT函数的使用方法
- 电脑太慢了最简单的办法怎么弄_最简单快速的方法恢复电脑误删文件-数据恢复常见问题...
- fastadmin在html中查询数据,常见问题 · fastadmin 常见问题 · 看云
- usb环境Linux,Linux环境下USB的原理、驱动和配置
- mybatis注册映射文件
- JAVA if语句快捷键_java编程基础 第一、第二章
- oracle查询所有表字段属性_MybatisPlus基础篇学习笔记(四)------查询方法