MOSS母版页制作学习笔记(二)
4、<asp:ContentPlaceHolder ID="PlaceHolderSearchArea" runat="server" />
放置搜索框的占位符;全局母版页,添加了内容的默认写法是
<asp:ContentPlaceHolder id="PlaceHolderSearchArea" runat="server">
<SharePoint:DelegateControl runat="server" ControlId="SmallSearchInputBox"/>
</asp:ContentPlaceHolder>
当 然样式也可以调整,例如只要搜索框,就直接写代码:
<asp:ContentPlaceHolder id="PlaceHolderSearchArea" runat="server">
<SPSWC:SearchBoxEx id="SearchBox" RegisterStyles="false" TextBeforeDropDown="" TextBeforeTextBox="<%$Resources:cms,masterpages_searchbox_label%>" TextBoxWidth="100" GoImageUrl="<% $SPUrl:~sitecollection/xx.jpg %>"
GoImageUrlRTL="<% $SPUrl:~/xx.jpg %>" UseSiteDefaults="true" DropDownMode = "HideScopeDD" SuppressWebPartChrome="true" runat="server" WebPart="true" __WebPartId="{0CA22729-81FE-4BC5-8261-D2A8EE83AE77}"/>
</asp:ContentPlaceHolder>
放置搜索框的占位符;全局母版页,添加了内容的默认写法是
<asp:ContentPlaceHolder id="PlaceHolderSearchArea" runat="server">
<SharePoint:DelegateControl runat="server" ControlId="SmallSearchInputBox"/>
</asp:ContentPlaceHolder>
当 然样式也可以调整,例如只要搜索框,就直接写代码:
<asp:ContentPlaceHolder id="PlaceHolderSearchArea" runat="server">
<SPSWC:SearchBoxEx id="SearchBox" RegisterStyles="false" TextBeforeDropDown="" TextBeforeTextBox="<%$Resources:cms,masterpages_searchbox_label%>" TextBoxWidth="100" GoImageUrl="<% $SPUrl:~sitecollection/xx.jpg %>"
GoImageUrlRTL="<% $SPUrl:~/xx.jpg %>" UseSiteDefaults="true" DropDownMode = "HideScopeDD" SuppressWebPartChrome="true" runat="server" WebPart="true" __WebPartId="{0CA22729-81FE-4BC5-8261-D2A8EE83AE77}"/>
</asp:ContentPlaceHolder>
5、<asp:ContentPlaceHolder ID="PlaceHolderHorizontalNav" runat="server" />
放置水平导航栏的占位符;全局母版页,添加了内容的默认写法是
<asp:ContentPlaceHolder id="PlaceHolderHorizontalNav" runat="server">
<SharePoint:AspMenu
ID="TopNavigationMenu"
Runat="server"
DataSourceID="topSiteMap"
EnableViewState="false"
AccessKey="<%$Resources:wss,navigation_accesskey%>"
Orientation="Horizontal"
StaticDisplayLevels="2"
MaximumDynamicDisplayLevels="1"
DynamicHorizontalOffset="0"
StaticPopoutImageUrl="/_layouts/images/menudark.gif"
StaticPopoutImageTextFormatString=""
DynamicHoverStyle-BackColor="#CBE3F0"
SkipLinkText=""
StaticSubMenuIndent="0"
CssClass="ms-topNavContainer">
<StaticMenuStyle/>
<StaticMenuItemStyle CssClass="ms-topnav" ItemSpacing="0px"/>
<StaticSelectedStyle CssClass="ms-topnavselected" />
<StaticHoverStyle CssClass="ms-topNavHover" />
<DynamicMenuStyle BackColor="#F2F3F4" BorderColor="#A7B4CE" BorderWidth="1px"/>
<DynamicMenuItemStyle CssClass="ms-topNavFlyOuts"/>
<DynamicHoverStyle CssClass="ms-topNavFlyOutsHover"/>
<DynamicSelectedStyle CssClass="ms-topNavFlyOutsSelected"/>
</SharePoint:AspMenu>
<SharePoint:DelegateControl runat="server" ControlId="TopNavigationDataSource">
<Template_Controls>
<asp:SiteMapDataSource
ShowStartingNode="False"
SiteMapProvider="SPNavigationProvider"
id="topSiteMap"
runat="server"
StartingNodeUrl="sid:1002"/>
</Template_Controls>
</SharePoint:DelegateControl>
</asp:ContentPlaceHolder>
要 应用其他样式,就把cssclass样式都去掉,修改应用到母版页的样式表就可以了,另外,注意DataSourceID,导航栏的数据来源是可以设定, 例如从xml中获取数据;StaticDisplayLevels和MaximumDynamicDisplayLevels也很重要,可以用来修改导航 栏的样式和展现方式。
6、<asp:ContentPlaceHolder ID="PlaceHolderTopNavBar" runat="server" />
放置水平导航栏一行内容的占位符,在PlaceHolderHorizontalNav外面一层。
放置水平导航栏一行内容的占位符,在PlaceHolderHorizontalNav外面一层。
7、<asp:ContentPlaceHolder ID="WSSDesignConsole" runat="server" />
页面编辑控件,当页面进入编辑页面模式时使用(当我们点 Site Actions, Edit Page后)
页面编辑控件,当页面进入编辑页面模式时使用(当我们点 Site Actions, Edit Page后)
8、<asp:ContentPlaceHolder ID="SPNavigation" runat="server" />
在 Windows SharePoint Services中默认为空,用于附加的页面编辑控件的占位符,
9、<asp:ContentPlaceHolder ID="PlaceHolderPageImage" runat="server" />
左侧的图片的占位符,
10、<asp:ContentPlaceHolder ID="PlaceHolderTitleLeftBorder" runat="server" />
Title区左侧边框的占位符,
11、<asp:ContentPlaceHolder ID="PlaceHolderTitleBreadcrumb" runat="server" />
TitleBreadcrumb页面导航区的占位符,
12、<asp:ContentPlaceHolder ID="PlaceHolderPageTitleInTitleArea" runat="server" />
Breadcrumb区 下面的标题的占位符,
13、<asp:ContentPlaceHolder ID="PlaceHolderMiniConsole" runat="server" />
一个放置页面级命令的地方,比如在WIKI站点里的Edit Page, History, Incoming Links的占位符,
14、<asp:ContentPlaceHolder ID="PlaceHolderTitleRightMargin" runat="server" />
Title区右侧空白的占位符,
15、<asp:ContentPlaceHolder ID="PlaceHolderTitleAreaSeparator" runat="server" />
TitleAreaSeparator 区的占位符,
16、<asp:ContentPlaceHolder ID="PlaceHolderLeftNavBarDataSource" runat="server" />
左侧导航区数据源的占位 符,
17、<asp:ContentPlaceHolder ID="PlaceHolderCalendarNavigator" runat="server" />
在页面中有日历时为其显示一个日期选择框的占位符,
18、<asp:ContentPlaceHolder ID="PlaceHolderLeftNavBarTop" runat="server" />
左侧导航区上面的导航区的占位符,
19、<asp:ContentPlaceHolder ID="PlaceHolderLeftNavBar" runat="server" />
左侧导航区的占位符,
20、<asp:ContentPlaceHolder ID="PlaceHolderLeftActions" runat="server" />
左侧导航区下面的动作区的占位符,
21、<asp:ContentPlaceHolder ID="PlaceHolderNavSpacer" runat="server" />
左侧导航区的宽度的占位符,
22、<asp:ContentPlaceHolder ID="PlaceHolderLeftNavBarBorder" runat="server" />
左侧导航区的边框元素的占位 符,
23、<asp:ContentPlaceHolder ID="PlaceHolderBodyLeftBorder" runat="server" />
页面body的边框元素的占位符,
24、<asp:ContentPlaceHolder id="PlaceHolderPageDescription" runat="server" />
页面描述区的占位符,
25、<asp:ContentPlaceHolder id="PlaceHolderMain" runat="server" />
页面主体的占位符,
26、<asp:ContentPlaceHolder ID="PlaceHolderBodyRightMargin" runat="server" />
页面body的右边空白的占位 符,
27、<asp:ContentPlaceHolder ID="PlaceHolderFormDigest" runat="server"/>
这是页面中必备的 "form digest"安全组件的占位符,
28、<asp:ContentPlaceHolder ID="PlaceHolderUtilityContent" runat="server" />
页面底部需要的一块特殊内容的占位 符,
29、<asp:ContentPlaceHolder ID="PlaceHolderBodyAreaClass" runat="server" />
附加在页面顶部的body中的样式的占位符,
30、<asp:ContentPlaceHolder ID="PlaceHolderTitleAreaClass" runat="server" />
TitleArea附加的样式的占 位符,
31、<asp:ContentPlaceHolder id="PlaceHolderAdditionalPageHead" runat="server" />
提供给内容页添加所有可以放在<head>区域的内容,如CSS、JS等的占位符,
从美工处拿到界面的展示效果和html布局,css样式表
这个按理是不用说了,这里少说几句,html的页面也是有布局要求的,要提前和美工说好,比如要把头尾中间分开,需要写循环的地方不要用一个表 格套下来等等。
从SPD创建一个新的母版页,将html代码复制进去
step(1): 打开Sharepoint Designer.
step(2): 在文件菜单点击New,选择Sharepiont Content,选择Page 标签。
step(3): 双击母版页来创建一个母版页。
step(4): 选择在代码模式下查看母版页。
step(5): 把html的代码拷贝并粘贴到母板页中(注意别把原来的必须元素代码覆盖了)
step(6): 去掉重复的元素,例如<html>
step(2): 在文件菜单点击New,选择Sharepiont Content,选择Page 标签。
step(3): 双击母版页来创建一个母版页。
step(4): 选择在代码模式下查看母版页。
step(5): 把html的代码拷贝并粘贴到母板页中(注意别把原来的必须元素代码覆盖了)
step(6): 去掉重复的元素,例如<html>
将美工模拟的控件用母版页中的占位符替换;
除了必须的元素外,还需要添加什么附加控件,也加到相应的位置;
这两个就不用说了吧。。