Sharepoint 2010 自定义布局页
这里主要介绍如何使用Sharepoint Designer自定义布局页，及如何使用Visual Studio 2010创建部署解决方案。1:创建内容类型
1-1：首先我们使用VS2010 创建一个内容类型项目。
1-2：该内容类型继承“页面”内容类型，页面内容类型属于发布内容。
1-3：我希望在页面上面显示一些“版权” ，“图像”等。所以需要为这些内容提供一个栏位来存醋。所以我们需要在这内容类型里面新增几个栏。代码如下：
<?xml version="1.0" encoding="utf-8"?>
<Elements xmlns="http://schemas.microsoft.com/sharepoint/">
<!-- Parent ContentType: 页面 (0x010100C568DB52D9D0A14D9B2FDCC96666E9F2007948130EC3DB064584E219954237AF39) -->
<ContentType ID="0x010100C568DB52D9D0A14D9B2FDCC96666E9F2007948130EC3DB064584E219954237AF3900d9382e6c08b34b38af10610a206f51c1"
Name="Ylsoft门户网站页面"
Group="YLSoft Portal"
Description="Ylsoft门户网站页面内容类型"
Version="0">
<FieldRefs>
<FieldRef ID="{F55C4D88-1F2E-4ad9-AAA8-819AF4EE7EE8}" Name="PublishingPageContent" DisplayName="网页内容"/>
<FieldRef ID="{3de94b06-4120-41a5-b907-88773e493458}" Name="PublishingPageImage" DisplayName="页面图像" />
<FieldRef ID="{543BC2CF-1F30-488e-8F25-6FE3B689D9AC}" Name="PublishingRollupImage" DisplayName="滚动图像" />
<FieldRef ID="{31E5E0E6-73C7-41BA-BFC8-7E43B454C1EB}" Name="PublishingPageSideContent" DisplayName="网页边栏内容"/>
<FieldRef ID="{6f7a46dc-94e6-46b6-916b-cd05092e42ec}" Name="PublishingPageAreaShow" DisplayName="显示区域"/>
<FieldRef ID="{FB0A88BB-8D83-4436-B650-2C14D1A2C1BC}" Name="PublishingPageCopyRight" DisplayName ="版权"/>
</FieldRefs>
</ContentType>
<Field ID="{31E5E0E6-73C7-41BA-BFC8-7E43B454C1EB}"
Name="PublishingPageSideContent"
StaticName="PublishingPageSideContent"
SourceID="http://schemas.microsoft.com/sharepoint/v3"
Group="YLSoft Portal"
DisplayName="网页边栏内容"
Type="HTML"
Required="FALSE"
Sealed="TRUE"
RichText="TRUE"
RichTextMode="FullHtml" />
<Field ID="{FB0A88BB-8D83-4436-B650-2C14D1A2C1BC}"
Name="PublishingPageCopyRight"
DisplayName ="版权"
StaticName="PublishingPageCopyRight"
SourceID="http://schemas.microsoft.com/sharepoint/v3"
Group="YLSoft Portal"
Type="HTML"
Required="FALSE"
Sealed="TRUE"
RichText="TRUE"
RichTextMode="FullHtml" />
<Field Type="MultiChoice"
DisplayName="显示区域"
Required="FALSE"
EnforceUniqueValues="FALSE"
Indexed="FALSE"
FillInChoice="FALSE"
Group="YLSoft Portal"
ID="{6f7a46dc-94e6-46b6-916b-cd05092e42ec}"
SourceID="{f67bda5f-fa92-48f8-b1d5-0cfcf724358b}"
StaticName="显示区域"
Name="显示区域">
<Default>无</Default>
<CHOICES>
<CHOICE>无</CHOICE>
<CHOICE>网站导航</CHOICE>
<CHOICE>页眉导航</CHOICE>
<CHOICE>页脚导航</CHOICE>
</CHOICES>
</Field>
</Elements>
然后我们发布此内容类型。
2：使用Sharepoint Designer 2010创建布局页
2-1:新建布局页
进入Sharepoint Designer2010
在新建界面，选择我们刚刚发布的内容类型。
我们开始设计这个界面。主要是如何使用我们刚刚创建的那些栏。
2-2：设计布局页
布局页使用默认的母板页，母板页我已经做好，或则你就使用系统默认的母板页页可以。建好布局页，我们一般都需要对PlaceHolderMain的内容区域进行排版布局。
<table width="100%" border="0" align="center" cellpadding="0" cellspacing="0">
<!-- 横幅banner开始-->
<tr>
<td>
</td>
</tr>
<!-- 横幅banner结束-->
<tr>
<td height="10"></td>
</tr>
<tr>
<td style="text-align:center;" align="center"><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<!-- 位置提示开始-->
<td style="vertical-align:top; text-align:left; line-height:36px;">
</td>
<!-- 位置提示结束-->
<td width="10" rowspan="2" style="width:10px;"> </td>
<td rowspan="2"style="width:245px; vertical-align:top;">
<!--右边栏目开始-->
<div style="height:10px;"></div>
<!--右边栏目结束-->
</td>
</tr>
<tr>
<td style="vertical-align:top; text-align:left;">
<!--文章内容表格开始-->
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td>
</td>
</tr>
</table>
<!--文章内容表格结束-->
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td style="text-align:center; height:10px;"></td>
</tr>
</table>
<table width="100%" border="0" cellspacing="10" cellpadding="0" style="border-top:#AACBEE 1px solid; background-image:url(_layouts/images/ylsoft/portal/10soft-bottom-bg.jpg);">
<tr>
<td align="center">
</td>
</tr>
</table>
我就在PlaceHolderMain插入上面的表格。效果如下图。基本布局就这样。
我们在第一行插入WEBPART
在同一行，我们还想显示我们内容类型里面“页面图像”网站栏的内容。很简单，操作如图 ：
详细过程就不描述，其中还有一个服务器控件(Sharepoint)里面的EditModePanel也比较有用，这控件只会在编辑模式下才会显示。最后的布局如下：
HTML：
<%@ Page language="C#" Inherits="Microsoft.SharePoint.Publishing.PublishingLayoutPage,Microsoft.SharePoint.Publishing,Version=14.0.0.0,Culture=neutral,PublicKeyToken=71e9bce111e9429c" meta:webpartpageexpansion="full" meta:progid="SharePoint.WebPartPage.Document"%>
<%@ Register Tagprefix="SharePointWebControls" Namespace="Microsoft.SharePoint.WebControls" Assembly="Microsoft.SharePoint, Version=14.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %> <%@ Register Tagprefix="WebPartPages" Namespace="Microsoft.SharePoint.WebPartPages" Assembly="Microsoft.SharePoint, Version=14.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %> <%@ Register Tagprefix="PublishingWebControls" Namespace="Microsoft.SharePoint.Publishing.WebControls" Assembly="Microsoft.SharePoint.Publishing, Version=14.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %> <%@ Register Tagprefix="PublishingNavigation" Namespace="Microsoft.SharePoint.Publishing.Navigation" Assembly="Microsoft.SharePoint.Publishing, Version=14.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
<asp:Content ContentPlaceholderID="PlaceHolderPageTitle" runat="server">
<SharePointWebControls:FieldValue id="PageTitle" FieldName="Title" runat="server"/>
</asp:Content>
<asp:Content ContentPlaceholderID="PlaceHolderMain" runat="server">
<PublishingWebControls:editmodepanel runat="server" id="editmodepanel1">
<SharePointWebControls:CheckBoxChoiceField FieldName="6f7a46dc-94e6-46b6-916b-cd05092e42ec" runat="server">
</SharePointWebControls:CheckBoxChoiceField>
</PublishingWebControls:editmodepanel>
<asp:ScriptManagerProxy runat="server" id="ScriptManagerProxy">
</asp:ScriptManagerProxy>
<table width="100%" border="0" align="center" cellpadding="0" cellspacing="0">
<!-- 横幅banner开始-->
<tr>
<td>
<WebPartPages:WebPartZone runat="server" Title="顶部" ID="top"><ZoneTemplate></ZoneTemplate></WebPartPages:WebPartZone>
<PublishingWebControls:RichImageField FieldName="3de94b06-4120-41a5-b907-88773e493458" runat="server"></PublishingWebControls:RichImageField>
</td>
</tr>
<!-- 横幅banner结束-->
<tr>
<td height="10"></td>
</tr>
<tr>
<td style="text-align:center;" align="center"><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<!-- 位置提示开始-->
<td style="vertical-align:top; text-align:left; line-height:36px;">
<asp:SiteMapPath
runat="server"
SiteMapProviders="SPSiteMapProvider,SPXmlContentMapProvider"
RenderCurrentNodeAsLink="false"
NodeStyle-CssClass="breadcrumbNode"
CurrentNodeStyle-CssClass="breadcrumbCurrentNode"
RootNodeStyle-CssClass="breadcrumbRootNode"
HideInteriorRootNodes="true"
SkipLinkText=""/>
</td>
<!-- 位置提示结束-->
<td width="10" rowspan="2" style="width:10px;"> </td>
<td rowspan="2"style="width:245px; vertical-align:top;">
<!--右边栏目开始-->
<WebPartPages:WebPartZone runat="server" Title="右侧1" ID="Righter1"><ZoneTemplate></ZoneTemplate></WebPartPages:WebPartZone>
<PublishingWebControls:RichHtmlField FieldName="31e5e0e6-73c7-41ba-bfc8-7e43b454c1eb" runat="server" id="RichHtmlField1">
</PublishingWebControls:RichHtmlField>
<WebPartPages:WebPartZone runat="server" Title="右侧2" ID="Righter2"><ZoneTemplate></ZoneTemplate></WebPartPages:WebPartZone>
<div style="height:10px;"></div>
<PublishingWebControls:RichImageField FieldName="543bc2cf-1f30-488e-8f25-6fe3b689d9ac" runat="server" id="RichImageField1"></PublishingWebControls:RichImageField>
<!--右边栏目结束-->
</td>
</tr>
<tr>
<td style="vertical-align:top; text-align:left;">
<PublishingWebControls:EditModePanel runat=server id="EditModePanel2">
<SharePointWebControls:TextField FieldName="fa564e0f-0c70-4ab9-b863-0177e6ddd247" runat="server" id="TextField1">
</SharePointWebControls:TextField>
</PublishingWebControls:EditModePanel>
<!--文章内容表格开始-->
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td>
<PublishingWebControls:RichHtmlField FieldName="f55c4d88-1f2e-4ad9-aaa8-819af4ee7ee8" runat="server"></PublishingWebControls:RichHtmlField>
</td>
</tr>
</table>
<!--文章内容表格结束-->
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td style="text-align:center; height:10px;"></td>
</tr>
</table>
<table width="100%" border="0" cellspacing="10" cellpadding="0" style="border-top:#AACBEE 1px solid; background-image:url(_layouts/images/ylsoft/portal/10soft-bottom-bg.jpg);">
<tr>
<td align="center">
<PublishingWebControls:RichHtmlField FieldName="fb0a88bb-8d83-4436-b650-2c14d1a2c1bc" runat="server"></PublishingWebControls:RichHtmlField>
</td>
</tr>
</table>
</asp:Content>
3：利用VS2010发布布局页
3-1：增加一个Empty Sharepoint Project项目
3-2: 然后在这个项目增加一个Module
把新增后的sample.txt文件删除。
将刚刚在Sharepoint Dsigner做好的ylsoftportalcontentpage.aspx布局页拷贝到YLSoftPortalPageLayouts Module目录下。
同时把布局页代码里面的meta:webpartpageexpansion="full" meta:progid="SharePoint.WebPartPage.Document这段代码移除，如果没有移除，Sharepoint会认为这个布局页有定制过。
接下来修改这个Elements.xml。
<?xml version="1.0" encoding="utf-8"?>
<Elements xmlns="http://schemas.microsoft.com/sharepoint/">
<Module Name="YLSoftPortalPageLayouts" Url="_catalogs/masterpage">
<File Path="YLSoftPortalPageLayouts\ylsoftportalcontentpage.aspx" Url="ylsoftportalcontentpage.aspx" Type="GhostableInLibrary">
<Property Name="Title" Value="YLSoft门户内容页面" />
<Property Name="MasterPageDescription" Value="YLSoft门户网站的内容页面布局"/>
<Property Name="ContentType" Value="$Resources:cmscore,contenttype_pagelayout_name;" />
<Property Name="PublishingPreviewImage" Value="~SiteCollection/_catalogs/masterpage/$Resources:core,Culture;/Preview Images/ylsoftportalcontent.png, ~SiteCollection/_catalogs/masterpage/$Resources:core,Culture;/Preview Images/ylsoftportalcontent.png" />
<Property Name="PublishingAssociatedContentType" Value=";#Ylsoft门户网站页面;#0x010100C568DB52D9D0A14D9B2FDCC96666E9F2007948130EC3DB064584E219954237AF3900d9382e6c08b34b38af10610a206f51c1;#"/>
</File>
</Module>
</Elements>
Url，指定我这个布局页存放的地址，这里我写的是_catalogs/masterpage,这个地址实际上就是母板页样式库(http://Server/_catalogs/masterpage/Forms/AllItems.aspx)
Property元素制定了这个布局页的一些属性，也就是母板页样式库的一些栏位的字段。其中PublishingAssociatedContentType的值是我们刚刚创建的布局页内容类型。
具体Module的帮助，可以访问：http://msdn.microsoft.com/en-us/library/ms453137.aspx。我们发布这个项目。你就可以在母板页样式库看到你所发布的这个母板页了。
页:
[1]