企业信息门户快速搭建手册模板.doc

企业信息门户快速搭建手册

一、创建站点 - 3 -
二、页面设计 - 6 -
1、创建文档库 - 8 -
2、创建页眉文件 - 16 -
3、修改css文件 - 20 -
4、创建页脚文件 - 20 -
5、首页其它部件设计 - 21 -
（1）、内容编辑器web部件布局和格式属性修改做法 - 21 -
（2）、取静态内容（带宏替换功效）修改。eg：搜索。 - 25 -
（3）、个人工作助理做法。 - 27 -
6、首页新闻设计 - 28 -
（1）、创建CMS文件夹 - 28 -
（2）、在CMS文件夹中新建文档 - 28 -
在CMS文件夹点击新建文档 - 29 -
（3）、CMS引用 - 29 -
三、二级页面（静态页面和栏目树） - 31 -
1、创建静态页面文档库。 - 31 -
2、创建一个web部件页面 - 34 -
3、编辑新生成web部件页 - 35 -
4、在css文件中添加bmgk风格 - 40 -
5、铺设静态页面左侧底图 - 42 -
6、将“企业概况”静态页面和首页挂接 - 42 -
四、二级页面（文档库） - 44 -
1、创建网站和工作区 - 44 -
2、创建文档库 - 46 -
3、在css文件中加入文档库风格修饰代码 - 48 -
五、CMS - 52 -
1、CMS频道创建和公布 - 52 -
（1）、创建频道 - 52 -
（2）、公布频道 - 55 -
2、首页新闻和CMS挂接 - 58 -
3、修改新闻频道细览页页眉页脚 - 60 -
（1）、创建新闻频道页眉 - 60 -
（2）、创建新闻频道页脚 - 62 -
4、新闻频道概览页 - 64 -
（1）、创建web部件页 - 64 -
（2）、修改更多链接 - 64 -
(3)、修改概览页样式 - 64 -
六、细化首页 - 65 -
1、帮助信息 - 65 -
（1）、上传图片和文件 - 65 -
（2）、修改页脚帮助信息链接 - 65 -
2、联络我们 - 65 -
3、网站地图 - 66 -
4、开启网站匿名 - 66 -
七、美化首页 - 67 -
1、首页添加“文档和列表”和“网站设置” - 67 -
（1）、创建purview文档库，在该目录下上载“权限.htm”。 - 67 -
（2）、在首页中添加“取静态内容（带宏替换功效）”web部件。 - 67 -
（3）、更改purview文档库权限 - 67 -
2、将顶部功效条隐藏，增加浮动登录按钮 - 67 -
（1）、将登录按钮图片denglu.gif上传至EX_STATICPAGES_文档库_EX_RESOURCE_目录下 - 67 -
（2）、修改css文件 - 67 -
八、附件 - 68 -
1、隐藏工具栏相关CSS代码 - 68 -
（1）、WSS网站工具栏 - 68 -
（2）、SPS网站工具栏 - 69 -
2、创建滚动新闻 - 69 -
（1）、横向滚动 - 69 -
（2）、纵向滚动 - 70 -
3、弹出菜单操作步骤 - 72 -
4、创建日程安排 - 74 -
5、创建任务督办 - 74 -
6、意见箱 - 74 -
7、办公用具管理 - 75 -

一、创建站点
和SPS在同一服务器场顶级站点创建
用浏览器打开SPS门户，点击页面右上角“登录”，在弹出对话框中输入用户名和密码，即可登录到门户。

密码
域 \ 邮件帐号

点击功效条上面“网站”，进入下一页面后点击页面左下侧“创建网站”，图所表示

输入标题(能够是汉字)和URL(最好用英文，以方便访问)，及电子邮件地址，点击创建按钮。以下图

进入以下图页面后点击确定按钮，进入下一步选择网站模板页面。

在此页面下模板选择“空白网站（带页眉页脚）”，以下图所表示。

选好后点确定按钮，即可。创建好WSS门户首页以下图所表示

注意：新建门户首页会自动继承父门户页眉和页脚

二、页面设计
点击主页右上角“修改共享网页” “添加Web部件”
“浏览”

依据部件性质，将“Web部件列表”中“内容编辑器”和“取静态内容（带宏替换功效）”拖入页面所需位置中（拖动方法为在待选部件上，按住鼠标左键移动，到指定位置后释放鼠标左键即可）。

1、创建文档库
点击主页左上角“文档和列表”

进入创建文档库页面，图所表示，然后点击“创建”

点开新建文件夹

创建一个保留图片及资源文件文件夹：_EX_RESOURCE_（文件名大小写均可）

点击“保留并关闭”，返回到上级目录。

打开建好“_EX_RESOURCE_”文件夹，点击上载文档。

2、创建页眉文件
在“EX_STATICPAGES_”文档库下，点击新建文档，这时系统会进入Microsoft
FrontPage编辑页面。

从coding文件中，选择页眉及导航条所在TABLE（有时可能包含多个TABLE）。

将其代码有选择地拷贝到新建文件（eg：new_page_1.htm）中，img路径替换为“_EX_RESOURCE_/”，并将导航条中首页链接更改为：<a href=”_EX_EXCHANGESITE_/”>首页</a>（备注：导航条中不要写绝对地址）,同时添加以下代码：
<link rel="stylesheet" href="_EX_RESOURCE_/css.css" type="text/css">
(其中标红处是门户名称，eg：daqing)。使页面宽度设定为760，居中显示，同时在页面web部件之间不显示缝隙，加入以下代码：
<Script>
document.title="网站标题";
function AutoFitFrame()
{
try{
node=event.srcElement;
if(node.contentWindow.document.body.innerHTML !="")
{
node.style.height=node.contentWindow.document.body.scrollHeight;
node.style.width=node.contentWindow.document.body.scrollWidth;
}

}catch(ex)
{
}
}
var ptables
ptables= document.getElementsByTagName("TABLE")
if(ptables.length > 0)
ptables(0).className="ms-main"
window.attachEvent("onload",flfoaterDiv);
window.attachEvent("onload",initFloaterExport);
window.attachEvent("onscroll",flfoaterDiv);
window.attachEvent("onresize",flfoaterDiv);
function initFloaterExport()
{
try{
document.getElementById("diidIOExportToSpreadsheet").className="diidIOExport";
}
catch(ex)
{
}

try{
document.all("floaterSettingsDiv").style.display="inline";
}
catch(ex)
{
}
}
function flfoaterDiv()
{
try{
document.all("floaterSettingsDiv").style.left=document.body.clientWidth-110;
document.all("floaterSettingsDiv").style.top=document.body.scrollTop;
}
catch(ex)
{
}
}
</script>
替换日期代码：
<script LANGUAGE="JavaScript">document.write(new Date().getYear()+"年"+(new Date().getMonth()+1)+"月"+new Date().getDate()+"日")</script> 星期<script LANGUAGE="VBScript">Select Case weekday(Date)
Case 1
document.write "日"
Case 2
document.write "一"
Case 3
document.write "二"
Case 4
document.write "三"
Case 5
document.write "四"
Case 6
document.write "五"
Case 7
document.write "六"
end select
</script>
选择保留文件，文件名输入为“head.htm”。

选择保留文件，文件名输入为“head.htm”。

3、修改css文件
建好页眉文件后，回到“_EX_RESOURCE_”文件夹下，打开css文件，添加下面代码：
.ms-main
{
width:760;
background-color:#ffffff;
}
body
{
text-align :center;
}

.ZoneSpacinghorizontal
{
display:none
}

.ms-PartSpacingVertical
{
display:none
}
4、创建页脚文件
和创建页眉（head.htm）建立次序和方法相同，在“EX_STATICPAGES_”目录下，创建一个新文件，将此文件名保留为“foot.htm”，将coding代码有选择拷贝进文件即可。

回到主页，就能够看到显示有头脚主页面。

5、首页其它部件设计
（1）、内容编辑器web部件布局和格式属性修改做法
修改web部件布局和格式操作方法有2种。
方法一 从页面右上角“修改共享网页”-----“修改共享web部件”------“选择待须改部件（eg：内容编辑器web部件[1]）”

方法二 直接从“修改web部件”进入，eg：内容编辑器web部件[1]

经过以上方法能够进入到以下界面，其中界面右边即为待改部件工具窗格。
点开界面右边“源编辑器”，弹出一个网页对话框。

从coding文件中选择该部件所对应代码拷贝至网页对话框中

注意：将每部分代码拷入源编辑中时，将原有文件中全部“img/”路径替换为“EX_STATICPAGES_/_EX_RESOURCE_”路径，然后“保留”。

点开右边工具栏“外观”，修改“标题”中名称，如“企业概况”、“交流和写作”、“网上办公”等。在框架样式中选“无”。然后“应用”------“确定”。

（2）、取静态内容（带宏替换功效）修改。eg：搜索。
点开“取静态内容（带宏替换功效）”下拉箭头，选“修改共享web部件”。

在右面工具框自定义属性下，
文件路径中输入“_EX_EXCHANGESITE_/EX_STATICPAGES_/search.htm”
在外观下
标题中输入“搜索”
框架样式中选“无”。
然后“应用”------“确定”。

创建搜索文件

和创建页眉（head.htm）建立次序和方法相同，在“EX_STATICPAGES_”目录下，创建一个新文件，将此文件保留为“search.htm”，并将“search”图片上传至“_EX_RESOURCE_”下,将下面代码拷贝进文件中即可。
<div align="left">
<table align=center border="0" cellpadding="0" cellspacing="2" width="146">
<tr>
<td width="40" valign=middle>
<select style="height:20;font-size:12px;width:60" sname="SearchScopeSel"

id="SearchScopeSel" class="a"><option value=1 >
部门</option><option value=0>集团</option></select></td>
<td >
<input name="SearchString" id="idSearchString" type="text" class="a"
style="width:66;height:18" size="15"></td>
<td width="20" align="left">
<img src="_EX_RESOURCE_/search.gif" border="0" onclick="javascript:DoscopeSearch()" alt="搜索"></td>
</tr>
</table>
</div>
<Script>
function DoscopeSearch()
{
var scope= document.all("SearchScopeSel").value
if(document.all('idSearchString').value==""){
alert("请输入关键字");
return;
}
if(scope=="0")
{
location=("/search.aspx?k="+document.all('idSearchString').value);

}
else
{
SubmitSearchRedirect('_layouts/2052/searchresults.aspx')
}
}
</Script>
（3）、个人工作助理做法。
a. 个人邮件：链接到：“http：//pc”(弹出新窗口)
b. 个人订阅：链接到：“_layouts/2052/MySubs.aspx”
c. 日程安排：在本站点下建立一个事件列表，链接到该列表
d. 地 址 簿：在本站点下建立一个联络人列表，链接到该列表
e. 协同工作：在本站点下建立一个任务列表，链接到该列表
f. 个人查询：在本站点下一个web部件页，应该弹出新窗口
g. 办公自动化：现在依据各单位自己情况链接，应该弹出新窗口

6、首页新闻设计
（1）、创建CMS文件夹
进入“EX_STATICPAGES_”文档库，点新建文件夹在“名称”框中输入“CMS”，然后选择“保留并关闭”。

（2）、在CMS文件夹中新建文档

在CMS文件夹点击新建文档，弹出M]icrosoft Office FrontPage页面，在该页将coding代码进行拷贝编辑，注意，img路径替换为：“_EX_RESOURCE_/”，将此文件保留为后缀为.htm形式。eg：通知公告可存为tzgg.htm或通知公告.htm。

（3）、CMS引用

点击“取静态内容（带宏替换功效）”下拉箭头，选“修改共享web部件”，展开自定义属性。文件路径中输入：“_EX_EXCHANGESITE_/_EX_STATICPAGES_/CMS/….htm”
外观标题中输入名称，框架样式中选“无”。然后“应用”“确定”。
页面以下显示：

三、二级页面（静态页面和栏目树）
1、创建静态页面文档库。
（1）、创建以二级栏目命名文档库，eg：“企业概况”，文档模板选“Microsoft Office FrongtPage网页”。

（2）、添加扩展属性

点开目前文档下左栏最下面“修改设置和栏”，选“添加新栏”。

在栏名处输入“深度”，信息类型选“数字(1, 1.0, 100)”，
要求此栏包含信息选“是”。然后“确定”。

点击“返回栏目名称”，eg本例“返回企业概况”。

添加新栏目后界面以下。

（3）、在该文档库下创建所属全部静态页面。

（4）、设置树形结构
计划要展示栏目树，并对树中每个节点表示其深度。这里约定栏目树结构深度从0开始。
深度编号
0
1
2
3

生产周报

总部机关

发展研究部

政治思想工作部

计划研究部

直属企事业

油气田企业

大庆石油管理局
深度编码将能控制树显示层次，树中同一层次结点显示次序将由列表中次序编码来控制。依据上表将深度值赋给列表中静态页面。（能够手动修改各个页面次序，次序号间隔缺省为100）
2、创建一个web部件页面
（1）、创建pages文档库
文档库名称命名为“pages”，在文档模板处选“web部件页”，然后创建。

进入以下界面

（2）、在该pages库下选“新建文档
在该pages库下选“新建文档”，在下一页面中输入二级栏目名称，
eg：企业概况，布局模板默认“页眉，页脚，左栏，正文”。然后“创建”。
3、编辑新生成web部件页
（1）、将右边工具栏中“站点、库、列表显示”拖到页面“左栏”中，点开“站点、库、列表显示”栏右边下拉箭头，选“修改共享web部件”。

（2）、点开右边工具栏中“内容设置”

在框中按以下对照填写。
名称 填写值
列举列表内容 *

风格定义 bmgk

指定列表名称

列表类型选择

是否是显示犯错信息 FALSE

目标地址，多目标时用“;”分割 _EX_THISSITE_#二级栏目名称（eg：企业概况）

Xsl文件地址 _EX_ROOTSITE_/_layouts/2052/eip/nav_tree.xsl
或_EX_ROOTSITE_/_layouts/2052/eip/Doc_list.xsl

最大深度 -1

Xsl内容
然后“应用”---“确定”。
（3）、将“显示内容”拖入到“中间”栏中
点开右边“修改共享网页”，选“添加web部件”----“导入”，进入下一页面，点击“浏览”，将“显示内容.dwp”文件导入，然后“上载”，出现已上载web部件下“显示内容”，将“显示内容”拖入正文中

在“显示内容”下拉箭头点击 —→ 点开“修改共享Web部件” —→ 在“显示内容”下点开“外观”—→ 在框架样式中下拉菜单中选“无”—→ 应用 —→ 确定 —→

进入下列页面。

下面是在“XSL”文件地址中，
1、用“_EX_ROOTSITE_/_Layouts/2052/eip/Doc_list.xsl”显示栏目树例子：

2、用“_EX_ROOTSITE_/_Layouts/2052/eip/nav_tree.xsl” 显示栏目树例子：

4、在css文件中添加bmgk风格
在“_EX_RESOURCE_”目录下打开css文件，将下列定义加入文件中：
/* Tree's CSS */
/*栏目树顶部*/
.gsgkDocMgtTreeViewHead {
background-image: url('qygk.jpg');
background-repeat: no-repeat;
width: 160px;
height: 185px;
}
.gsgkDocMgtTreeViewBody {
background-image: url('erji_05.jpg');
background-repeat: repeat-y;
width: 160px;
height: 20px;
}
/*定义Level缩进*/
.gsgkmvIndent {
background-image: url('cy_j_04.gif');
background-repeat: no-repeat;
background-position: right;
padding-left:56px;
}
td.gsgkTreeViewMainNode {
font-family: "宋体";
font-size: 12px;
color: #000000;
text-decoration: none;
letter-spacing: 1px;
height:12px;
cursor: hand;
text-align:left;
padding-top:10px;
padding-left:2px;
}
/*栏目链接样式*/
A.gsgkTreeViewMainNode {
font-family: "宋体";
font-size: 12px;
color: #000000;
text-decoration: none;
letter-spacing: 1px;
height:10px;
cursor: hand;
}
/*栏目树底部*/
.gsgkDocMgtTreeViewBottom {
background-image: url('erji_05.jpg');
background-repeat: repeat-y;
}
/*隐藏中间工具栏*/
.smartpagetitle{
display:none
}
请将红色注释部分删除
参见：中国石油企业信息门户技术规范(V1.4)第三章第五节Doc_List和NAV_TREE风格定义
5、铺设静态页面左侧底图
点击页面右上角“修改共享页面”――设计此页――点击显示内容WEB部件下拉箭头，点击“修改共享WEB部件”图

在页面右侧出现显示内容属性，点击“源编辑器”，出现显示内容WEB部件代码。
在代码下面添加铺底图样式代码

<style type="text/css">
#MSO_ContentTable{
background-image:url(../EX_STATICPAGES_/_EX_RESOURCE_/erji_05.jpg);
padding-left:0px;
background-repeat:repeat-y;
height:100%
}
</style>
6、将“企业概况”静态页面和首页挂接
（1）、点击文档库和列表，点文档库中“pages”，进入pages页面—→点开“企业概况”，将此页面URL地址后加“?main=企业介绍.htm ” —→ 然后将“” 拷贝，用UTF-8编码器.htm编译器进行编译。把编译过地址Pages以后内容重拷贝。

回到主页，点击右上角“修改共享网页”-----“修改共享web部件”----“企业概况”，

进入下一页面，（1）点开“源编辑器”将上一步编译过地址Pages以后内容拷贝到其对应链接处，然后保留—应用---确定。

四、二级页面（文档库）
二级栏目是文档库创建方法。Eg：党群工作。
1、创建网站和工作区
点击主页左上角“创建”, 进入创建页面后再点击最下方“创建网站和工作区”

在标题处输入栏目名称，URL名称处输入该栏目拼音简写即可。点击“创建”进入下一页面。模板选“空白网站（带页眉、页脚）”，然后“确定”。能够看到已建好党群工作子站点。

2、创建文档库
点击功效条中“文档和列表”，即可进行文档库创建。

在名称处输入该栏目下子栏目标名称，文档模板选默认“Microsoft Office Word 文档”。

建好后文档库以下：

3、在css文件中加入文档库风格修饰代码
Td.ListLeftTree_head

td.ListLeftTree_body

ms-pagetitle

（背景色）ms-navframe
(边框)ListLeftPanelBorder

TD.ms-selectednav

用FrontPage打开Css文件，在文件中加入以下代码，请依据上图对应部分名称修改对应风格。
TD.ms-unselectednav {
border:0px solid #E1ECFC;
padding-top:1px;
padding-bottom:2px;
}
.ms-navline{
display:none;
}
.ListLeftPanelBorder{
border-color:"#0F86DA";
}
.ListLeftPanelLine{
background-color:"#003399";
}
.ListLeftPanelBorderLine{
background-color:#8fdaff;
}
#listtitlearea{
display:none;
}
.ms-searchcorner{
display:none;
}
#doclibleftsearch{
display:inline!important;
}
#idSearchString{
width:110;
}
.ListLeftTree_part{
font-size:12px;
text-align:left;
width:100%;
}
a.ListLeftTree_row:visited{
color:#003399;
font-size:12px;
}
a.ListLeftTree_row{
color:#003399;
font-size:12px;
}
a.ListLeftTree_row:link {
color:#003399;
font-size:12px;
}
a#onetidViewSelector {
color:#003399;
font-size:12px;
}
a#diidPinToMyPage {
color:#003399;
font-size:12px;
}
a#diidSubscribeButton{
color:#003399;
font-size:12px;
}
a#diidCustomizeButton{
color:#003399;
font-size:12px;
}
a#diidSlideShowButton{
color:#003399;
font-size:12px;
}
a#diidFolderListButton{
color:#003399;
font-size:12px;
}
#td.ListLeftTree_row{
background-position: left;
background-image: url('012.jpg');
BACKGROUND-REPEAT:x-repeat;
padding-left:9px;
height:18px;
}
.ms-descriptiontext{
display:none;
}
.ms-navframe{
background-color: #E3F3FF;
}
.ms-pagetitle{
BACKGROUND-IMAGE: url('012.jpg');
BACKGROUND-REPEAT: x-repeat;
background-position: center;
text-align :center;
vertical-align:"text-bottom";
font-family: "宋体";
font-size: 13px;
font-weight :bold;
height:18px;
color: #071685;
}
#L_SearchViewFont{
text-align :left;
font-family: "宋体";
font-size: 14px;
font-weight :bold;
color: #009ace;
}
#search{
background-color:#E3F3FF;
}
.ms-searchform{
background-color:#E3F3FF;
}
#docliblefttitle{
display:inline!important;
color:#003399;
font-size: 13px;
}
TD.ListLeftTree_head{
BACKGROUND-IMAGE: url('home_07.jpg');
BACKGROUND-REPEAT: x-repeat;
text-align :left;
font-family: "宋体";
font-size: 13px;
font-weight :bold;
color:#ffffff;
text-align:center;
letter-spacing:1px;
width:150px;
height:28px
}
TD#L_SelectView{
text-align :left;
vertical-align:"bottom";
height:19px;
font-weight :bold;
color: #009ace;
font-size: 13px;
}
#L_RelatedTasks{
text-align :left;
vertical-align:"bottom";
height:19px;
font-size: 13px;
font-weight :bold;
color: #009ace;
}
TD.ms-selectednav{
border:0px solid #003399;
background:#FDFAD5;
padding-top:1px;
padding-bottom:2px;
}
td.ListLeftTree_body{
background-image: url('home_10.jpg');
background-repeat:no-repeat;
width:150px;
height:118px;
text-align:center;
}
.ListLeftTree_part{
width:149px
}
五、CMS
1、CMS频道创建和公布
（1）、创建频道
打开Site Manager 登录，进入登录界面
CMS服务器地址为：10.65.51.91
服务器端口号

登录域
邮件帐号
口令

输入正确后，进入管理界面，以下图所表示

找到本单位频道 ，比如： 培训站点，鼠标右键单击，弹出菜单选择NEW Channel ，图所表示

在Name中填入频道名称，点击OK按钮即可。

选择Tools频道，选中右边两个页面文件：defaut和summary，击鼠标右键后选“Copy”,再选中刚建立新频道，点击鼠标右键后选择”Paste”
注意：Locking Owner列假如不是everyone 则 该频道还未公布，以下图所表示。

（2）、公布频道
打开浏览器，在地址栏输入http://<cms server>/tools/) 注意前面<cms server>是CMS服务器所在IP，这里我们输入，点击页面左下角“编辑”，进入编辑模式，输入用户名和口令后进入编辑模式。（注意：公布时登录帐号要和创建频道帐号一致，不然看不到要公布页面）

形式：域\邮件帐号

点击编辑模式，进入下一页面，点击左下角“制作管理”，进入制作管理页面，以下图所表示。

点击上图中转到，进入下一页面，点击“同意”

以后再点击“制作管理”，然后点击“同意”，将文件全部公布完成。此时在Site Manager中刷新此频道，在此频道下default.htm和summary.htmlocking Owner应该为everyone。
2、首页新闻和CMS挂接
在浏览器中打开门户，点击功效条中“文档和列表”，打开EX_STATICPAGES_文档库，然后打开CMS文件夹，鼠标指向tzgg.htm，点击下拉箭头，在弹出菜单中点击“在 Microsoft Office Frontpage 中编辑”

打开文件后，将页面中示例新闻删除，图所表示

然后加入以下代码：
<iframe SCROLLING=no frameborder="0" name='view_WPQ_' src=’_EX_CMSSERVER_/油气田企业/大庆石油管理局/XXXX/XXXX/summary.htm?MaxRecords=6&MaxWords=30' width='100%' ></iframe>
如
<iframe SCROLLING=no frameborder="0" name='view_WPQ_' src='_EX_CMSSERVER_/油气田企业/大庆石油管理局/发展集团/集团信息/summary.htm?MaxRecords=6&MaxWords=30&hiddenEdit=1&noshowmore=true&showdate=true&HeadImgUrl=\sites\XXXX\EX_STATICPAGES_\_ex_resource_\007.gif' width='100%' height=100></iframe>
隐藏编辑模式 &hiddenedit=1
隐藏更多 &noshowmore=true
显示最大统计数 &MaxRecords=6
显示标题字符