Creating a simple ASPX page template

This page describes how to create a new ASPX page template. We will create a new page with two columns that contain editable regions.

Creating the web form

1. Open your web project in Visual Studio (using the WebSite.sln or WebApp.sln file).

2. Right-click the CMSTemplates/CorporateSite folder in the Solution Explorer and select Add -> Add New Item.

3. Create a new Web form named: TwoColumnTemplate.aspx

   • Check Select master page.

4. Click Add. The Select a Master Page dialog opens.

5. Choose the CMSTemplates/CorporateSite folder and select the default Root.master file.

6. Click OK.

Writing the ASPX code

1. Open the Source view of the new web form.

2. Add the following code inside the <asp:Content> element:

   Copy

   
   
   
    <table>
      <tr>    
        <td style="width: 50%">
            <cms:CMSEditableRegion ID="txtLeft" runat="server" DialogHeight="400" RegionType="HtmlEditor" RegionTitle="Left column" />
        </td>
        <td style="width: 50%">
            <cms:CMSEditableRegion ID="txtText" runat="server" DialogHeight="400" RegionType="HtmlEditor" RegionTitle="Right column" />
        </td>
      </tr>
    </table>
   
   
    

   • The <asp:Content> control allows you to use standard ASP.NET master pages. When the system renders the page, it loads the content of the control into the assigned master page (as defined in the Root.master file).
   • The CMSEditableRegion control defines an editable region that the page displays as an HTML editor in the Kentico administration interface on the Page tab of the Pages application. On the live site, the control renders the content entered into the editor.

3. Edit the web form’s code behind file (TwoColumnTemplate.aspx.cs).

4. Add a reference to the CMS.UIControls namespace:

   Copy

   
   
   
    using CMS.UIControls;
   
   
    

5. Modify the class declaration so that the web form inherits from TemplatePage:

   Copy

   
   
   
    public partial class CMSTemplates_CorporateSite_TwoColumnTemplate : TemplatePage
   
   
    

6. Save the web form’s files.

Inheriting from the TemplatePage class allows you to use the web form as a page template in Kentico.

Keep in mind that the name of the class must be identical to the value of the Inherits attribute of the <%@ Page %> directive on the ASPX page. This is case sensitive.

Registering the web form as a page template

Now you need to register the web form as a page template in Kentico, so that it can be selected when creating pages.

1. Log in to the administration interface and open the Page templates application.

2. Select the Corporate Site/Examples category.

3. Click New template.

4. Type Two column template into the Template display name field.

5. Click Save.

6. Set the following values on the General tab:

   • Template type: ASPX page
   • File name: ~/CMSTemplates/CorporateSite/TwoColumnTemplate.aspx
     

7. Click Save.

8. Switch to the Sites tab.

9. Click Add sites.

10. Choose the sites where you wish to use the page template (Corporate site) and click Select.

Creating a page based on the template

Content editors can now use the page template to create pages.

1. Open the Pages application.

2. Select Corporate Site (the root of the content tree).

3. Click New () above the tree.

4. Choose the Page (menu item) document type.

5. Type About Us as the Page name and choose the Use existing page template option.

6. Select the Corporate Site/Examples category and the Two column template page template.

   

7. Click Save to create the new page.

On the Page tab, you can see the page and its editable regions.

You can now type in text into the regions and click Save to store the content of the page.