How can we help you today?

How to Create a Page Template (Page Layout) with ShortPoint Pre-Defined

If 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

  • 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.


Create aspx template




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:


paste the code



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:


Add ShortPoint code


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.


Upload page layout



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. 


Add the new article



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:


Did you find it helpful? Yes No

Send feedback
Sorry we couldn't be helpful. Help us improve this article with your feedback.

World's best intranet sites are designed using ShortPoint

Get started today! Learn more
See all 69 topics

Start a trial

Ignite your vision. Install ShortPoint directly on your site, or play in sandbox mode. No credit card required.

Get started today

World’s best intranet sites are designed using ShortPoint

Thousands of companies using ShortPoint everyday to design, brand and build award winning intranet sites.

Get started Learn more