程序師世界是廣大編程愛好者互助、分享、學習的平台,程序師世界有你更精彩!
首頁
編程語言
C語言|JAVA編程
Python編程
網頁編程
ASP編程|PHP編程
JSP編程
數據庫知識
MYSQL數據庫|SqlServer數據庫
Oracle數據庫|DB2數據庫
 程式師世界 >> 編程語言 >> .NET網頁編程 >> 關於.NET >> 使用SharePoint 2010的母版頁

使用SharePoint 2010的母版頁

編輯:關於.NET

SharePoint 2010母版頁所用的還是ASP.NET 2.0中的技術。通過該功能,實現了頁面框架布局與實際內容的分離。雖然在本質上自定義母版頁的過程和以前版本的SharePoint大致相同,但是從 2007到2010仍然有許多重要的值得我們關注的變化。

本文將試圖:

鞏固和掌握SharePoint 2010裡母版頁相關的一些基本操作

突出描述新版本和以前的版本之間的一些變化

了解一些有用的或比較常見的自定義方式

SharePoint 2010 母版頁的類型

首先,讓我們快速的看一下在SharePoint 2010中母版頁的類型:

v4.master

默認的工作組站點的母版頁。提供了功能區和其他用戶界面上的改變。

特征

網站操作在2010中更新。現在放在左側。

功能區可用。

default.master

從SharePoint 2007升級的網站使用該母版頁,除非我們手工改成v4版本。

特征

SharePoint 2007版本的 網站操作在右側

沒有功能區。

minimal.master

母版頁中幾乎什麼也沒有。通常用於搜索中心和Office Web應用程序的頁面。這個母版頁不應該與2007裡的開發人員自己修剪下來的最簡單的自定義母版頁混淆。minimal.master現在是一個開箱即用的母版頁。在SharePoint 2010裡那些修剪完的自定義母版頁通常是指Starter母版頁。

特征

不包括導航

Starter母版頁

SharePoint 2007裡通常稱為minimal母版頁。這些母版頁往往是由開發人員創建的,用於快速開始母版頁的定制,基於其上擴充功能,做出實際需要的母版頁。

simple.master

這個母版頁是用在登錄和錯誤頁面。要自定義該頁面,必須替換存放在服務器_layouts目錄下的相應頁面文件。若要了解更多信息,請參考MSDN上的文章“SharePoint中的默認母版頁”。

使用simple.master 的網頁

Login.aspx

SignOut.aspx

Error.aspx

ReqAcc.aspx

Confirmation.aspx

WebDeleted.aspx

AccessDenIEd.aspx

其他母版頁

以下這些雜七雜八的母版頁,在定制網站時一般不會去動。

包括:

application.master

applicationv4.master

dialog.master

layouts.master

layoutsv3.master

pickerdialog.master

rtedialog.master

simple.master simple.master

simplev4.master

mwsdefault.master

mwsdefaultv4.master

admin.master

popup.master

升級至SharePoint 2010母版頁

詳細內容請參考這一篇MSDN文章 。

許多以前在菜單和工具欄裡面的命令現在存放在功能區裡。因此,如果現有的母版頁中不包含功能區,許多命令將不可用。

功能區裡的控件

SharePoint 2010裡的下列控件放置在功能區裡:

發布控制台- <PublishingConsole:Console>

網站操作菜單- <PublishingSiteAction:SiteActionMenu>

登錄和登錄控制(如果使用自定義登錄,被移到功能區裡了)。

所需內容占位符

PlaceHolder控件 描述 新增 <asp:ContentPlaceHolder id="PlaceHolderQuickLaunchTop" runat="server"> 快速啟動菜單頂部。 是 <asp:ContentPlaceHolder id="PlaceHolderQuickLaunchBottom" runat="server"> 快速啟動菜單底部。 是 <asp:ContentPlaceHolder id="PlaceHolderPageTitle" runat="server"/> 該網站的標題。 否 <asp:ContentPlaceHolder id="PlaceHolderAdditionalPageHead" runat="server"/> 頁面head部分的占位符,用於在頁面對應的HTML的head標記中添加額外例如ECMAScript(JavaScript,JScript)和層疊樣式表(CSS)。 否 <asp:ContentPlaceHolder id="PlaceHolderBodyAreaClass" runat="server"/> 在body區域中的類。 否 <asp:ContentPlaceHolder ID="SPNavigation" runat="server"> 該控件用於放置頁面編輯類的控件。 否 <asp:ContentPlaceHolder id="PlaceHolderSiteName" runat="server"> 當前頁面所在站點的名稱。 否 <asp:ContentPlaceHolder id="PlaceHolderPageTitleInTitleArea" runat="server" /> 出現在標題區域的當前頁的標題。 否 <asp:ContentPlaceHolder id="PlaceHolderPageDescription" runat="server"/> 當前頁的說明。 否 <asp:ContentPlaceHolder id="PlaceHolderSearchArea" runat="server"> 頁面中放置搜索控件的位置。 否 <asp:ContentPlaceHolder id="PlaceHolderGlobalNavigation" runat="server"> 頁面上的面包屑控件。 否 <asp:ContentPlaceHolder id="PlaceHolderTitleBreadcrumb" runat="server"> 面包屑控件上的面包屑文本。 否 <asp:ContentPlaceHolder id="PlaceHolderGlobalNavigationSiteMap" runat="server"> 頁面上子網站和兄弟網站的全局導航。 否 <asp:ContentPlaceHolder id="PlaceHolderTopNavBar" runat="server"> 用於放置頂部導航欄的容器。 否 <asp:ContentPlaceHolder id="PlaceHolderHorizontalNav" runat="server"> 頂部導航欄中的導航菜單。 否 <asp:ContentPlaceHolder id="PlaceHolderLeftNavBarDataSource" runat="server" /> 放置填充左側導航所需數據源的容器。 否 <asp:ContentPlaceHolder id="PlaceHolderCalendarNavigator" runat="server" /> 日期選擇器,用於包含日歷的頁面。 否 <asp:ContentPlaceHolder id="PlaceHolderLeftNavBarTop" runat="server"/> 左側導航欄頂部區域。 否 <asp:ContentPlaceHolder id="PlaceHolderLeftNavBar" runat="server"> 快速啟動欄。 否 <asp:ContentPlaceHolder id="PlaceHolderLeftActions" runat="server"> 快速啟動欄上的其他對象。 否 <asp:ContentPlaceHolder id="PlaceHolderMain" runat="server"> 頁面的主要內容。 否 <asp:ContentPlaceHolder id="PlaceHolderFormDigest" runat="server"> 存儲頁面中 Form Digest控件的容器。 否 <asp:ContentPlaceHolder id="PlaceHolderUtilityContent" runat="server"/> 附加在頁面底部的內容在。從HTML角度來說,是Form標記以外的部分。 否 <asp:ContentPlaceHolder id="PlaceHolderTitleAreaClass" runat="server"/> title部分的類(現在是在head標記裡)。對其定制時如果添加一個WebPartZone到這個palceholder會報錯。 否 <asp:ContentPlaceHolder id="PlaceHolderPageImage" runat="server"/> 不屬於用戶界面的組成部分,是為了向後兼容。 否 <asp:ContentPlaceHolder id="PlaceHolderTitleLeftBorder" runat="server"> 不屬於用戶界面的組成部分,是為了向後兼容。 否 <asp:ContentPlaceHolder id="PlaceHolderMiniConsole" runat="server"/> 不屬於用戶界面的組成部分,是為了向後兼容。 否 <asp:ContentPlaceHolder id="PlaceHolderTitleRightMargin" runat="server"/> 不屬於用戶界面的組成部分,是為了向後兼容。 否 <asp:ContentPlaceHolder id="PlaceHolderTitleAreaSeparator" runat="server"/> 不屬於用戶界面的組成部分,是為了向後兼容。 否 <asp:ContentPlaceHolder id="PlaceHolderNavSpacer" runat="server"> 不屬於用戶界面的組成部分,是為了向後兼容。 否 <asp:ContentPlaceHolder id="PlaceHolderLeftNavBarBorder" runat="server"> 不屬於用戶界面的組成部分,是為了向後兼容。 否 <asp:ContentPlaceHolder id="PlaceHolderBodyLeftBorder" runat="server"> 不屬於用戶界面的組成部分,是為了向後兼容。 否 <asp:ContentPlaceHolder id="PlaceHolderBodyRightMargin" runat="server"> 不屬於用戶界面的組成部分,是為了向後兼容。 否

添加功能區

功能區是用戶界面裡一個新增加的特性。SPRibbonPeripheralContent控件會顯示在這一區域,但如果需要也可以將其移到功能區外面。

步驟

復制並粘貼下面的代碼到你的母版頁。

01 <div id="s4-ribbonrow" class="s4-pr s4-ribbonrowhidetitle">
02     <div id="s4-ribboncont">
03         <SharePoint:SPRibbon runat="server" PlaceholderElementId="RibbonContainer" CssFile="">
04             <SharePoint:SPRibbonPeripheralContent runat="server" Location="TabRowLeft" CssClass="ms-siteactionscontainer s4-notdlg">
05                <span style="background-color: rgb(255, 255, 153);"> <%-- 在這裡插入網站操作菜單 --%> </span>
06             </SharePoint:SPRibbonPeripheralContent>
07             <span style="background-color: rgb(255, 255, 153);"><%-- 在這裡插入全局導航 --%></span>
08             <SharePoint:SPRibbonPeripheralContent runat="server" Location="TabRowRight" ID="RibbonTabRowRight" CssClass="s4-trc-container s4-notdlg">
09                 <span style="background-color: rgb(255, 255, 153);"><%-- 在這裡插入右上角的控件 --%> </span>
10             </SharePoint:SPRibbonPeripheralContent>
11         </SharePoint:SPRibbon>
12     </div>
13     <div id="notificationArea" class="s4-noti">
14         <span style="background-color: rgb(255, 255, 153);"><%-- 通知內容將出現在這個div裡 --%></span>
15     </div>
16     <asp:ContentPlaceHolder ID="SPNavigation" runat="server">
17     <SharePoint:DelegateControl runat="server" ControlId="PublishingConsole">
18     </SharePoint:DelegateControl>
19     </asp:ContentPlaceHolder>
20         <div id="WebPartAdderUpdatePanelContainer">
21             <asp:UpdatePanel ID="WebPartAdderUpdatePanel" UpdateMode="Conditional" ChildrenAsTriggers="false” runat="server">
22                 <ContentTemplate>
23                     <WebPartPages:WebPartAdder ID="WebPartAdder" runat="server" />
24                 </ContentTemplate>
25                 <Triggers>
26                     <asp:PostBackTrigger ControlID="WebPartAdder" />
27                 </Triggers>
28             </asp:UpdatePanel>
29         </div>
30 </div>

頁面滾動時固定功能區
在母版頁上進行以下更改,以保證頁面內容滾動時不會影響功能區的使用。

將頁面內容部分移動到下面的div內

1 <div id="s4-workspace">
2     <div id="s4-bodyContainer">
3         內容
4     </div>
5 </div>

如果您的頁面是固定寬度的,添加 s4-nosetwidth類到s4-workspace div裡。

1 <div ID="s4-workspace" class="s4-nosetwidth">

將標題區域移動到如下id的div裡。

1 <div id="s4-titlerow">標題區</div>

更新body標記和CSS規則,使其不滾動。Body標記和規則將類似於下面這樣:

1 <body scroll="no" ...>主體內容</body>

將控件添加到母版頁

有一組控件是SharePont功能必須的,包括:SPPageManager, ScriptManager和 ScriptLink。

將這些控件添加到您的母版頁

打開您的母版頁文件。

復制並粘貼以下代碼,以便添加ScriptManager控件。必須放在form標記內,並且在功能區前面。

1 <asp:ScriptManager id="ScriptManager" runat="server" EnablePageMethods="false" EnablePartialRendering="true" EnableScriptGlobalization="false" EnableScriptLocalization="true" />

復制並粘貼以下代碼,以便添加SPPageManager控件。必須放在head標記內。

1 <SharePoint:SPPageManager runat="server" />

復制並粘貼以下代碼,以便添加ScriptLink控件。必須放在head標記內。

1 <SharePoint:ScriptLink defer= "true" runat="server"/>

保存您的母版頁文件。

防止某些區域在模式窗口中顯示
為了防止您的母版頁中的某些div塊或其他定義好的塊顯示在模式窗口(也就是那些彈出窗口,往往出現在添加文件,查看文件屬性時)中,可以添加類“s4-notdlg”。

這個問題應該只發生在下列情況下:

網站使用了自定義的系統母版頁(通常與發布頁面用的母版頁相同)。

自定義母版頁中在模式窗口中應隱藏的區域對應的標記遺漏了s4-notdlg類。

比如,以下區域將出現在模式窗口中:

1 <div class=”cccontent”>
2     你的內容
3 </div>

添加s4-notdlg至該類將阻止這種情況的發生

1 <div class=”cccontent s4-notdlg”>
2     你的內容
3 </div>

添加一個Placeholder以便在母版頁中使用Web部件
雖然我們無法直接在母版頁中插入一個WebPart,但是可以通過在母版頁中創建一個自定義的(空的)ContentPlaceholderId,由頁面布局使用該Id,從而實現在指定位置插入WebPart。

在SharePoint Designer 2010中的步驟 

在你的自定義母版頁中添加一個唯一命名的內容占位符。例如:

1 <asp:ContentPlaceHolder id="PlaceHolderCopyright" runat="server"/>

在頁面布局中的為該占位符插入自定義內容

1 <asp:Content ContentPlaceholderID="PlaceHolderCopyright" runat="server"></asp:Content>

使用SharePoint Designer在新建的區域中插入一個WebPart。如果希望所有繼承自該頁面布局的頁面上都顯示該WebPart,不要把WebPart放在WebPartZone裡,直接放在該區域內即可。

  1. 上一頁:
  2. 下一頁:
Copyright © 程式師世界 All Rights Reserved