Is this really the version you are looking for? Kentico Xperience 8.1 Tutorial is no longer updated. Use the switcher in the header to choose your product version.
When developing or maintaining a website using ASPX page templates, one of the drawbacks is that you need to manually modify the code of pages whenever you wish to change the design. You can add flexibility to ASPX templates by defining areas that are editable directly through the browser in the Pages application, just like when using the Portal engine development model. To learn more about portal engine features, please read the version of this tutorial dedicated to the portal engine.
The following example demonstrates how to create an ASPX page template with zones that users can design via the portal engine:
Open your web project in Visual Studio (using the WebSite.sln or WebApp.sln file).
Right‑click the CMSTemplates\CorporateSite folder in the Solution Explorer and select Add -> Add New Item.
Create a new Web form named: TwoZones.aspx
Click Add. The Select a Master Page dialog opens.
Choose the Root.master page from the CMSTemplates/CorporateSite folder and click OK.
Open the Source view of the new ASPX page and place the following inside the <asp:Content> element:
<cms:CMSPagePlaceholder ID="plcZones" runat="server">
<LayoutTemplate>
<table style="width:100%">
<tr>
<td style="width: 50%">
<cms:CMSWebPartZone ID="zoneLeft" runat="server" />
</td>
<td style="width: 50%">
<cms:CMSWebPartZone ID="zoneRight" runat="server" />
</td>
</tr>
</table>
</LayoutTemplate>
</cms:CMSPagePlaceholder>The CMSPagePlaceholder control creates an area on the page that behaves in a way similar to a portal engine page template.
The <LayoutTemplate> element defines the layout of the area. This example uses a basic two column table structure, but setting a CSS‑based layout applied through HTML elements (for example <div>, <span>) is also a valid option.
The table contains two CMSWebPartZone controls, which represent fully functional portal engine zones. Users can manage these zones when editing pages based on the page template on the Design tab of the Pages application.When web part or widget content is added to a zone, the system stores the information in the database along with the respective page template object, not in the actual code of the ASPX page. Communication with the database is ensured by the CMSPortalManager control, which is located on the Root.master page.
Switch to the code behind file (TwoZones.aspx.cs) and add a reference to the CMS.UIControls namespace:
using CMS.UIControls;Modify the class definition to inherit from the TemplatePage class:
public partial class CMSTemplates_CorporateSite_TwoZones : TemplatePageSave the web form's files.
You can now use the web form as a page template in Kentico.
We will modify the About Us page created in the previous example to use the new page template.
This web part provides a text area on the page that users can edit on the Page tab of the Pages application, just like the editable regions in the previous example. The template allows you to build the design of the page using a browser‑based interface. Each web part zone may contain any number of web parts.
You may also configure zones to use various types of widgets, which are objects similar to web parts, but allow page customization by different kinds of website users, not just the administrators or designers.
Expand the menu () of zoneLeft and select Configure.
Switch the Widget zone type property from None to Customization by page editor.
Click Save & Close. The zone now serves as a widget zone for page editors.
Switch to the Page tab
Type some content into the editable text region displayed by the web part on the right and click Save.
Open the menu of the editor widget zone (click ) and click Add new widget. Select the Newsletters -> Newsletter subscription widget from the catalog and set the following values for its properties:
Click Save & Close to add the widget and then Save the page.
The widget provides a form which users can use to subscribe to the site's newsletter.
The example demonstrates how to use web parts or widgets to build the design of pages based on ASPX page templates. This approach combines the standard architecture and development process of ASPX templates with the flexibility and user‑friendliness of the portal engine.