階段 7: 上傳版面配置與 SharePoint server 發佈網站中建立新頁面Stage 7: Upload page layouts and create new pages in a publishing site in SharePoint Server

摘要:了解如何上傳版面配置與 SharePoint Server 2016 的發佈網站中建立新的頁面。Summary: Learn how to upload page layouts and create new pages in a publishing site in SharePoint Server 2016.


大部分的這一系列中所述的功能是僅適用於 SharePoint Online 中的私人每個網站集合。Most of the features described in this series are available only for private sites collections in SharePoint Online.

快速概觀Quick overview

階段 6: 上傳至 SharePoint server 發佈網站套用新的主版頁面與清楚如何上傳並套用新的主版頁面。讓我們網站"Contoso 看起來"的下一個步驟是建立新的頁面。Stage 6: Upload and apply a new master page to a publishing site in SharePoint Server explained how to upload and apply a new master page. The next step in giving our site a "Contoso look" is to create new pages.

在這個階段,您將了解:In this stage, you'll learn:


此文章並不 ' t涵蓋如何建立頁面配置。解釋如何上傳已完成的版面配置。這些檔案不會進行下載。This article doesn' t cover how to create a page layout. It explains how to upload already completed page layouts. These files won't be made available for download.

啟動階段 7Start stage 7

關於版面配置About page layouts

版面配置是在您的網站] 頁面上的範本。這是用來定義的版面配置與頁面的內文的結構。A page layout is a template for a page in your site. This is where you define the layout and structure for the body of a page.

版面配置包含頁面欄位控制項與網頁組件區域。頁面欄位控制項與網頁組件區域是定義作者可以新增內容的預留位置。新增至版面配置在特定的位置,例如在左側的欄,以及特定的樣式項目,如粗體。Page layouts contain page field controls and Web Part zones. Page field controls and Web Part zones are placeholders that define where content can be added by authors. They are added to a page layout at a specific position, for example on the left side of a column, and with specific style elements, such as bold.


階段 6: 上傳並將新的主版頁面套用到 in SharePoint Server 發佈網站清楚如何 SharePoint Server 2016 自動轉換 HTML 主版頁面的 ASP.NET 頁面。相同的規則會套用至版面配置。您可以建立頁面配置以 HTML 格式和 SharePoint Server 2016 會自動將它轉換成的 ASP.NET 頁面您。這表示您可以使用最愛的 HTML 編輯程式] 頁面上版面配置表格及聚焦 HTML、 CSS、 以及 JavaScript。您不需要擔心 ASP.NET 或 SharePoint 特定標記。Stage 6: Upload and apply a new master page to a publishing site in SharePoint Server explained how SharePoint Server 2016 automatically converts an HTML master page into an ASP.NET page. The same rule applies to page layouts. You can create a page layout in HTML format and SharePoint Server 2016 will automatically convert it to an ASP.NET page for you. This means that you can design your page layout using your favorite HTML editor, and focus on HTML, CSS, and JavaScript. You don't have to worry about ASP.NET or SharePoint specific markup.

如需詳細資訊,請參閱:For more information, see:

頁面與呈現的頁面的相關About pages and rendered pages

請務必了解作者請勿將內容新增至版面配置。內容新增至頁面It is important to understand that authors do not add content to a page layout. Content is added to a page.

會建立根據特定的版面配置頁面。一旦您已經建立] 頁面上,作者可新增他們想要顯示的網站] 頁面上的內容。因為頁面根據版面配置頁面欄位控制項與網頁組件區域,作者無法新增這些區域外的內容。A page is created based on a specific page layout. Once you've created a page, authors can add content that they want to display on their website to the page. Because the page is based on a page layout with page field controls and Web Part zones, authors can't add content outside these areas.

當訪客瀏覽網站時,就會看到呈現的網頁。轉譯] 索引標籤中的主版頁面合併具有頁面版面配置及] 頁面上的內容會顯示在頁面欄位和網頁組件區域。When visitors browse a site, they will see a rendered page. In a rendered page, the master page is merged with the page layout, and the content for the page is displayed in the page fields and Web Part zones.


如需詳細資訊,請參閱 < SharePoint 2013 頁面模型概觀For more information, see Overview of the SharePoint 2013 page model.

如何上傳新的版面配置How to upload a new page layout

在我們 Contoso 案例中,我們有兩個版面配置: 一個 [類別] 頁面上的另一個目錄項目] 頁面上。In our Contoso scenario, we have two page layouts: one for the category page, and one for the catalog item page.

階段 6: 上傳並將新的主版頁面套用到 in SharePoint Server 發佈網站清楚如何對應網路磁碟機。因為我們對應至我們網路磁碟機上, 傳這些版面配置,變得很容易。只要-拖到您的主版頁面圖庫的檔案。Stage 6: Upload and apply a new master page to a publishing site in SharePoint Server explained how to map a network drive. Because we have mapped our network drive, uploading these page layouts becomes very easy. Simply drag-and-drop the files into your Master Page Gallery.


SharePoint 中重新整理以查看已新增兩個版面配置的主版頁面圖庫] 頁面。也請注意版面配置的已建立關聯的 ASP.NET 檔案。In SharePoint, refresh the Master Page Gallery page to see that the two page layouts are added. Also notice that an associated ASP.NET file was created for the page layouts.

新增至 MPG 的頁面

如何關閉頁面庫的版本設定How to turn off versioning for the Pages Library

在我們的案例中,我們不會使用 SharePoint 工作流程進行核准。將檔案已經過核准。因此,我們建立新的頁面之前,我們想要關閉的頁面庫版本設定。In our scenario, we are not using SharePoint workflows for approval. The files have already been approved. Therefore, before we create a new page, we want to turn off versioning for the Pages library.

若要關閉的頁面庫版本設定:To turn off versioning for the Pages library:

  1. 從 [網站設定] 功能表選取 [網站內容]。From the Site Settings menu, select Site contents.


  2. 在 [網站內容] 頁面上按一下 [頁面]。On the Site Contents page, click Pages.

  3. 頁面文件庫的 [文件庫] 索引標籤中按一下 [文件庫設定]。In the Pages library, on the LIBRARY tab, click Library Settings.

  4. 在 [設定] 頁面上按一下 [版本設定]。On the Settings page, click Versioning settings.

  5. 要求取出] 區段中,針對需要之前可加以編輯已取出的文件,請選取 [In the Require Check Out section, for Require documents to be checked out before they can be edited, select No.


我們現在可以開始建立我們兩個新的頁面。We are now ready to create our two new pages.

如何建立根據版面配置頁面How to create a page based on a page layout

若要建立新的頁面:To create a new page:

  1. 在 [網站內容] 頁面上按一下 [頁面]。On the Site Contents page, click Pages.

  2. 頁面庫中,按一下 [檔案] 索引標籤和 [新文件In the Pages library, click the FILES tab, and then click New Document.


  3. 在 [建立頁面] 頁面上輸入標題URL 名稱。從 [版面配置] 清單中選取您要套用到新頁面版面配置。在我們的案例中,版面配置上是呼叫ContosoElectronicsCategoryPageLayout新上傳的版面配置。On the Create Page page, enter a Title and a URL name. From the Page Layout list, select the page layout that you want to apply to the new page. In our scenario, the page layout is the newly uploaded page layout called ContosoElectronicsCategoryPageLayout .


按一下 [確定]之後,[新建] 頁面上會顯示在頁面庫。After you click OK, the newly created page is shown in the Pages library.

 ![New Category Page](../media/OTCSP_NewCategoryPage.png)
  1. 在 Contoso 案例中,我們也需要目錄項目頁面。若要建立此頁面上,重複步驟 3 和 4 從先前的程序。不過版面配置,選取 [ ContosoElectroniceCatalogItemPageLayoutIn our Contoso scenario, we'll also need a catalog item page. To create this page, repeat steps 3 and 4 from the previous procedure. However for Page Layout, select ContosoElectroniceCatalogItemPageLayout .


我們頁面庫現在包含兩個新的頁面: ContosoCategoryPageContosoCatalogItemPageOur Pages library now contains two new pages: ContosoCategoryPage and ContosoCatalogItemPage .

 ![Two New Pages](../media/OTCSP_TwoNewPages.png)

現在我們已經建立這些頁面下, 一步是將它們指派給磁碟機我們網站導覽字詞。Now that we have created these pages, the next step is to assign them to the terms that drive our site navigation.

本系列中的下一篇文章Next article in this series

階段 8: 將類別頁面和目錄項目頁面指派給 SharePoint Server 中的字詞Stage 8: Assign a category page and a catalog item page to a term in SharePoint Server

另請參閱See also

其他資源Other Resources

操作方法: 在 SharePoint Server 2013 中建立頁面配置How to: Create a page layout in SharePoint Server 2013

新增程式碼片段到主版頁面或頁面配置 in SharePoint Server 2013Add snippets to a master page or a page layout in SharePoint Server 2013