定制SPS实战记录 系列之二
来源:互联网 发布:卓创资讯农产品数据库 编辑:程序博客网 时间:2024/06/04 19:36
1. 首先在指定目录创建CSS文件,并配置SPS的相关属性
(1)在如下SPS目录创建自定义的CSS文件,如CustomStylesheet.css,用来定制SPS页面外观的显式。
C:/Program Files/Common Files/Microsoft Shared/web server extensions/60/TEMPLATE/LAYOUTS/1033/STYLES
(2)配置SPS的属性以支持定制的style sheet
Browse to the portal instance with an account that has administrator privileges.
以管理员身份访问Portal站点。
Click Site Settings, and then click Change portal site properties and SharePoint site creation settings.
Update the Location of cascading style sheet file property with the following value:
通过点击Site Settings,并进一步点击Change portal site properties and SharePoint site creation settings。在显示的新页面中,更新Custom Cascading Style Sheet的设置:
/_layouts/[Loc ID]/styles/CustomStylesheet.css
The portal site now renders HTML elements based on the following order of cascading style sheets:
- OWS.CSS (Windows SharePoint Services style sheet)
- SPS.CSS (SharePoint Portal Server style sheet)
- CustomStylesheet.CSS (上述创建的CSS文件)
2. 创建特定目录用来存放SPS需要的资源
一般在定制SPS页面时,需要创建一些资源文件,如图片或logo等等,这里建议在如下的SPS目录下创建一个新的目录:
<%SystemDrive%>:/Program Files/Common Files/Microsoft Shared/web server extensions/60/TEMPLATE/IMAGES
如,创建一个名称为:rickie的目录
<%SystemDrive%>:/Program Files/Common Files/Microsoft Shared/web server extensions/60/TEMPLATE/IMAGES/rickie
然后,可以将对应的资源文件存放在上述目录下,你可以通过如下的URL访问:
/_layouts/images/rickie/[Image Name]
3. 编辑定制CSS文件
首先打开上述第一步创建的CSS文件,并添加如下内容:
.ms-phnavtableone
{
padding-left: 10px;
padding-top: 1px;
padding-bottom: 1px;
}
.ms-phnavtableone a
{
font-family: Tahoma;
font-size: 70%;
font-weight: bold;
color: blue;
text-decoration: none;
}
.ms-phnavtableone a:hover
{
text-decoration: underline ;
}
.ms-phnavtableone 用来定义或控制horizontal navigation bar的外部表格。刷新SPS页面,看看定制效果。
.ms-phnav1wrapper {
background-image: none;
border-top: 1px yellow solid;
border-bottom: 1px yellow solid;
background-color: #FFCC00;
BACKGROUND-REPEAT: no-repeat;
}
.ms-phnavmidc1sel, .ms-phnavmidc0sel
{
BORDER-top: black 1px solid;
BORDER-left: black 1px solid;
BORDER-right: black 1px solid;
BORDER-bottom: black 1px solid;
}
.ms-phnavmidc1sel a,.ms-phnavmidc0sel a
{
color: green;
}
上述元素用来控制horizontal navigation bar的外观显示:
.ms-phnav1wrapper: Wrapper over horizontal navigation bar
.ms-phnavmidc[n](Sel): Middle center of an area in the horizontal navigation bar
Div.ms-titleareaframe
{
border-top: 3px solid #4D917C;
}
.ms-sbtable
{
background-color: #4D917C;
}
.ms-sblbcorner
{
background-image: url(/_layouts/images/rickie/cornerbl.gif);
}
.ms-sbtopcorner
{
background-image: url(/_layouts/images/rickie/cornertop.gif);
}
上面元素用来控制search box的外观显示,其中后面的2个样式用来引用用户自己创建的images文件,这2个images文件用来控制search box左边圆角的显示。
OK. 定制SPS Portal Site的页面外观暂告一段落,现在可以刷新页面看看效果。
- 定制SPS实战记录 系列之二
- 定制SPS实战记录 系列之二
- SPS定制
- sps定制
- Flume系列二之案例实战
- QuickPart应用系列 之二---实现QuickPart 属性定制
- 自己定制SPS的颜色
- SSM框架实战系列之三_Maven之二
- MongoDB实战系列之二:MongoDB的常用操作
- MongoDB实战系列之二:MongoDB的常用操作
- MongoDB实战系列之二:MongoDB的常用操作
- SCCM 2012 R2实战系列之二:前提工作准备
- Lync Server 2013 实战系列之二:标准版-前期准备
- XenServer 6.5实战系列之二:Starting with Server Virtualization
- SSM框架实战系列之二_Maven之一
- MyBatis实战记录(二)
- UNet实战系列(二)
- Git开发系列(二):实战
- Ajax表单提交实例
- 测试一下这里的blog
- 一个Linux学习高手写给初学者的话
- C/C++去空格的函数
- Lucene 分词原理
- 定制SPS实战记录 系列之二
- 成熟-生命-学生!
- 标签/JS 问题解决合集
- 世界杯笑话
- 做一个专业的IT管理人才必备的十大能力
- 编码讨论---乱码问题之终极解决
- 招聘Java 软件工程师
- 在Redhat9 Linux下安装汉化eclipse3.1.2的c/c++开发平台
- 不同的sql写法提高hibernate性能,避免hibernate的BUG