Try ShortPoint nowIf want to create a reusable Page Template (Page Layout) in SharePoint having pre-defined ShortPoint Elements in it,then this solution is perfect for cases when you need to create 10+ pages with the same structure - it will optimize the process of using the copy-paste feature for the elements that will remain the same on all pages.
TABLE OF CONTENTS
- Prerequisites
- Step 1. Create the ASPX file
- Step 2. Paste the content
- Step 3. Add your ShortPoint code
- Step 4. Upload the page layout
- Step 5. Add the new article page
- Other Advantages
Prerequisites
- You have SharePoint Server Publishing Infrastructure feature activated on site collection level.
- You have SharePoint Server Publishing feature activated on site level.
- You have a basic understanding of HTML.
Step 1. Create the ASPX file
On your local system, create an ASPX file with the name of your template like shown in the animation below.
If your system does not show you file extensions after the name of the file, please check the box File name extensions found in the ribbon, in the View tab.
Note: Please make sure that the file extion is set to ASPX.
Step 2. Paste the content
Open it in any of your favorite editor such as notepad, notepad++, Visual Studio and paste following content in it;
For SharePoint Office 365 / SharePoint 2016 On-Premise
Copy this code the code below:
<%@ Page language="C#" Inherits="Microsoft.SharePoint.Publishing.PublishingLayoutPage,Microsoft.SharePoint.Publishing,Version=16.0.0.0,Culture=neutral,PublicKeyToken=71e9bce111e9429c" meta:progid="SharePoint.WebPartPage.Document" meta:webpartpageexpansion="full" %> <%@ Register Tagprefix="SharePointWebControls" Namespace="Microsoft.SharePoint.WebControls" Assembly="Microsoft.SharePoint, Version=16.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %> <%@ Register Tagprefix="WebPartPages" Namespace="Microsoft.SharePoint.WebPartPages" Assembly="Microsoft.SharePoint, Version=16.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %> <%@ Register Tagprefix="PublishingWebControls" Namespace="Microsoft.SharePoint.Publishing.WebControls" Assembly="Microsoft.SharePoint.Publishing, Version=16.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %> <%@ Register Tagprefix="PublishingNavigation" Namespace="Microsoft.SharePoint.Publishing.Navigation" Assembly="Microsoft.SharePoint.Publishing, Version=16.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"> <div class="data-shortpoint-wrap" style="visibility:hidden;opacity:0;"> <PUT YOUR CONTENT HERE> </div> <PublishingWebControls:RichHtmlField FieldName="PublishingPageContent" HasInitialFocus="True" MinimumEditHeight="400px" runat="server"/> </asp:Content>
For SharePoint 2013 On-Premise'
Copy this code the code below:
<%@ Page language="C#" Inherits="Microsoft.SharePoint.Publishing.PublishingLayoutPage,Microsoft.SharePoint.Publishing,Version=15.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=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %> <%@ Register Tagprefix="WebPartPages" Namespace="Microsoft.SharePoint.WebPartPages" Assembly="Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %> <%@ Register Tagprefix="PublishingWebControls" Namespace="Microsoft.SharePoint.Publishing.WebControls" Assembly="Microsoft.SharePoint.Publishing, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %> <%@ Register Tagprefix="PublishingNavigation" Namespace="Microsoft.SharePoint.Publishing.Navigation" Assembly="Microsoft.SharePoint.Publishing, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %> <asp:Content ContentPlaceholderID="PlaceHolderAdditionalPageHead" runat="server"> <SharePointWebControls:CssRegistration name="<% $SPUrl:~sitecollection/Style Library/~language/Themable/Core Styles/pagelayouts15.css %>" runat="server"/> <PublishingWebControls:EditModePanel runat="server"> <!-- Styles for edit mode only--> <SharePointWebControls:CssRegistration name="<% $SPUrl:~sitecollection/Style Library/~language/Themable/Core Styles/editmode15.css %>" After="<% $SPUrl:~sitecollection/Style Library/~language/Themable/Core Styles/pagelayouts15.css %>" runat="server"/> </PublishingWebControls:EditModePanel> <SharePointWebControls:FieldValue id="PageStylesField" FieldName="HeaderStyleDefinitions" runat="server"/> </asp:Content> <asp:Content ContentPlaceholderID="PlaceHolderPageTitle" runat="server"> <SharePointWebControls:FieldValue id="PageTitle" FieldName="Title" runat="server"/> </asp:Content> <asp:Content ContentPlaceholderID="PlaceHolderPageTitleInTitleArea" runat="server"> <SharePointWebControls:FieldValue FieldName="Title" runat="server"/> </asp:Content> <asp:Content ContentPlaceHolderId="PlaceHolderTitleBreadcrumb" runat="server"> <SharePointWebControls:ListSiteMapPath runat="server" SiteMapProviders="CurrentNavigationSwitchableProvider" RenderCurrentNodeAsLink="false" PathSeparator="" CssClass="s4-breadcrumb" NodeStyle-CssClass="s4-breadcrumbNode" CurrentNodeStyle-CssClass="s4-breadcrumbCurrentNode" RootNodeStyle-CssClass="s4-breadcrumbRootNode" NodeImageOffsetX=0 NodeImageOffsetY=289 NodeImageWidth=16 NodeImageHeight=16 NodeImageUrl="/_layouts/15/images/fgimg.png?rev=23" HideInteriorRootNodes="true" SkipLinkText=""/> </asp:Content> <asp:Content ContentPlaceholderID="PlaceHolderMain" runat="server"> <div class="article article-links"> <div class="data-shortpoint-wrap" style="visibility:hidden;opacity:0;"> <PUT YOUR CONTENT HERE> </div> <div class="article-content"> <PublishingWebControls:RichHtmlField FieldName="PublishingPageContent" HasInitialFocus="True" MinimumEditHeight="400px" runat="server"/> </div> <PublishingWebControls:EditModePanel runat="server" CssClass="edit-mode-panel roll-up"> <PublishingWebControls:RichImageField FieldName="PublishingRollupImage" AllowHyperLinks="false" runat="server" /> <asp:Label text="<%$Resources:cms,Article_rollup_image_text15%>" CssClass="ms-textSmall" runat="server" /> </PublishingWebControls:EditModePanel> </div> </asp:Content>
Here is a quick clip how to paste it:
Step 3. Add your ShortPoint code
Replace <PUT YOUR CONTENT HERE> with your ShortPoint code. You can create a temporary wiki page in your SharePoint site, add all the ShortPoint you want to put in your template and finally copy that as shown below:
Step 4. Upload the page layout
Now your Page Layout is ready. We will upload this page layout to Master Pages and Page Layouts gallery. To do that, please go to Site Settings > Master pages and page layouts. Upload the file with Page Layout content type and Article Pages content type association as shown below.
Step 5. Add the new article page
Your page layout is ready to use now! You can now go to Pages (Not Site Pages) library and Add new Article Page as shown below.
Other Advantages
- Whenever in future you will make change in the Page Layout and upload again to the Master Pages Library, all the pages created from that Page Layout will be automatically updated
- You can add the extra Extra ShortPoint at page levels at the bottom of the common ShortPoint which are at the top of the page as shown in above step 4 animation
- You can also use ShortPoint generators in the Page Layout which means you can change the Generator directly and all the pages which are created from that page layout will be updated automatically
Related Articles:
