Ken Tico Cms Tutorial

Kentico CMS for ASP.
NET - Tutorial
Kentico CMS Tutorial
Kentico CMS helps you build dynamic web sites with is a full-featured web content management solution.
This tutorial will help you become familiar with Kentico CMS and it’s primarily intended for developers.
Should you need any help, please feel free to contact us at support@kentico.com or call 1-888-225-2767.
If you need more detailed information on some topic, please see User’s Guide or Developer’s Guide that
can be found in Start -> All Programs -> Kentico CMS 1.x menu.
1 www.kentico.com we help you deliver better web sites 1

Kentico CMS for ASP.NET - Tutorial
Table of Contents
Chapter 1 - Kentico CMS Installation ........................................................................................................ 3
Chapter 2 – Kentico CMS Overview ......................................................................................................... 5
Chapter 3 – Content Editing ..................................................................................................................... 7
Chapter 4 – File Management ................................................................................................................ 10
Chapter 5 - Security Administration ........................................................................................................ 11
Authentication..................................................................................................................................... 11
Management of Users and Roles ........................................................................................................ 11
Authorization....................................................................................................................................... 11
Secured Web Site Areas..................................................................................................................... 13
Chapter 6 – Versioning and Workflow..................................................................................................... 14
Versioning and Content Locking.......................................................................................................... 14
Workflow............................................................................................................................................. 15
Chapter 7 - Development of Page Templates ......................................................................................... 17
How Page Templates Work................................................................................................................. 20
Adding Your Own Code to the Page.................................................................................................... 20
URL Format........................................................................................................................................ 21
Chapter 8 – Creating a Web Site from Scratch ....................................................................................... 22
Installing a Blank Project..................................................................................................................... 22
Adding Kentico CMS Controls to Your Toolbox ................................................................................... 22
Setting the Project Namespace ........................................................................................................... 22
Step 1 - Creating the Header of the Site.............................................................................................. 24
Step 2 - Making the Home Page Editable............................................................................................ 26
Step 3 – Creating the Services Section ............................................................................................... 29
Step 4 – Creating a Product Catalog ................................................................................................... 32
Step 5 – Modifying the Transformations .............................................................................................. 36
Step 6 – Displaying the News Section and the Latest News ................................................................ 38
Step 7 – Creating a Contact Page with Contact Form.......................................................................... 41
Step 8 – Adding Search Capabilities ................................................................................................... 45
Step 9 – Adding the Site Map.............................................................................................................. 48
Step 10 - Using Custom Document Types.......................................................................................... 49
Step 11 - Adding The Editing Buttons................................................................................................. 52
Step 12 – Creating a Multilingual Web Site.......................................................................................... 53

Chapter 1 - Kentico CMS Installation
Prerequisites
Before you start installation, please make sure that you fulfill the following system requirements:
• Microsoft Windows 2000, XP or 2003
• Microsoft IIS Server
• .NET Framework 1.1 or 2.0 and ASP.NET 1.1 or 2.0
• Visual Studio .NET 2003 or Visual Studio 2005 or Visual Web Developer 2005 are highly
recommended, however, if you’re familiar with ASP.NET programming in some other tool, you can
use it as well.
• Microsoft SQL Server 2000, MSDE 2000, Microsoft SQL Server 2005 or Microsoft SQL Server
Express 2005 (you need to have administrator’s rights for your database or for the whole server)
Deployment in Shared Hosting Environment
This chapter assumes that you’re installing Kentico CMS on your local machine. After you finish the
development of your application, you will need to move it to your web server. Deployment to the web
server can be done over FTP and it’s not necessary to run any setup or make any manual configuration on
the server, which means you can run Kentico CMS with most shared hosting providers.
Please make sure that your web hosting provider supports the following features:
• Allows you to access the MS SQL Server database from your local machine using SQL Server
Enterprise Manager (not only through some web interface) or is willing to restore your Kentico
CMS database on their MS SQL Server.
• Allows ASP.NET applications to write on the disk (for uploading of files through the user interface).
Installing Kentico CMS on Your Computer
Run Kentico CMS setup and follow the instructions. At the end, choose to launch Kentico CMS Web
Installer. The installer extracts files on your disk and creates shortcuts in your Start menu.
Deploying a New Web Site
The web site and database can be deployed using Kentico CMS Web Installer. Follow the instructions in
the wizard. If you need help at some step, please see Developer’s Guide -> Installation and Deployment -
> Deployment of Kentico CMS.
In step 5, you can choose to install the web site to the root of your web server. You don’t need to do that
for evaluation purposes, but it’s highly recommended that you install the web site to the root (e.g.
c:\inetpub\wwwroot). It will ensure using correct URLs on both development and production server. If you
need to run several web sites on your Windows XP machine, you can use a useful, free utility IISAdmin
(http://www.firstserved.net/services/iisadmin.php).
In step 6, please make sure that you select to deploy the sample Corporate Site that is used later in this
guide. However, if you want to start a new web site from scratch later, use the blank web site that contains
all settings, but no pre-built pages and content.

After you finish the wizard, please choose to launch Kentico CMS web site.
If you need to access the application later, use URL like this: http://localhost/KenticoCMS. The name of
the virtual directory (KenticoCMS) can be different – it depends on the name of the folder you entered in
the wizard.
File System Permissions
Kentico CMS requires Modify permissions for the web application and all underlying directories (if you’re
using NTFS file system). Please grant the following users with Modify permissions (in the File Properties -
> Security dialog):
• If you’re using Windows 2000 or Windows XP, grant the <machine>\ASPNET account with
Modify permissions.
• If you’re using Windows Server 2003, grant the NT AUTHORITY\NETWORK SERVICE account
with Modify permissions.
Windows 2000/XP Windows Server 2003

Chapter 2 – Kentico CMS Overview
What is Kentico CMS
Kentico CMS is a Web content management system for ASP.NET. It provides both friendly user interface
as well as flexible development platform for web developers. The following image describes the overall
architecture:
Sample Corporate Web Site
After completing the installation in chapter 1, you should see the sample Corporate Site in your browser.
This web site is used to showcase Kentico CMS capabilities and it can be directly used as a base for your
web site if you modify the styles and some settings according to your needs. Of course, you’re not
limited to this design – Kentico CMS allows you to create any web site structure, use any page layout
and design you can imagine. Now you can browse the site and see how it’s organized and how it works.
How Can I Create a Web Site Like This?
Now you might wonder how you can create a site like this one or how you can modify it. We recommend
the following process:
1. Analyze web site requirements and prepare the site map of the web site on a paper.
2. Draw page layout for different pages (home page, product catalog, news, etc.) and decide what
kind of navigation controls you will use.
3. Now you need to create page templates in Visual Studio.NET (or some other tool). Page
templates define the layout and navigation that is used for several pages with different content
(thus “templates”).
4. Once the templates are prepared, content editors can start creating new pages based on these
templates without developer’s help.

The following figure shows the web site lifecycle:
The development of page templates will be described in more detail later in this tutorial.
How Can I Edit the Content of this Web Site?
The content can be edited in Kentico CMS Desk, which is the browser-based administration interface of
Kentico CMS. You can sign in to Kentico CMS Desk by clicking the link at the top of the web site or
through URL http://localhost/KenticoCMS/CMSDesk.
You can (optionally) leverage advanced content management features, such as customizable workflow,
versioning and multilingual support (creating a web site in several language versions). The following
figure shows a general content life cycle in Kentico CMS:
You will learn more details on content editing in the next chapter.

Chapter 3 – Content Editing
Kentico CMS is delivered with powerful editing interface called Kentico CMS Desk. Click the link Click
here to sign in at the top of the sample Corporate Site or navigate to
http://localhost/KenticoCMS/cmsdesk. You will be redirected to the logon form of Kentico CMS Desk. Use
the following credentials to sign in:
• User name: administrator

• Password: leave the password blank
Now you can see the following sections in the main menu:
• My Desk – useful personal information, such as “My Recent Documents” or “My Recycle Bin”.
• Content - browse and edit content.
• Administration - manage users, roles and permissions.
• Tools – special tools and custom modules.
• Development – site and content management configuration.
Note 1: We will not use the advanced features, such as versioning and workflow in this chapter. These
features are described later in this tutorial. Without versioning, all changes are published on the live web
site immediately.
Note 2: The Corporate Site is only a sample web site created for demonstration purposes. You’re
definitely NOT limited to its structure, page layout, design or predefined document types. Instead, you
have full control over your web site and you can create any structure or design as if you were not using
Kentico CMS.
Editing an Existing Page
First, you will learn how to edit page content. Choose the Content module in the main menu. The left tree
view displays the site map with all content published on the web site. Click the Home document in the tree
view. Now you can edit the content of the home page in the Word-like WYSIWYG editor and save it using
the Save button.

Click the Published version radio button in the dialog header to see what the live web site looks like.
Now click the Edit button in the main toolbar. You will see the editing form that allows you to modify page
properties, such as page caption in the navigation, page template, title, description, etc.
Creating a New Page
Now you will create your first page. Click the Services document in the tree view and click the New button
in the main toolbar. Choose to create a new document of type Page (menu item) and click OK. Enter the
following values:
• Caption: Service 3
• Page type: Page template
• Page template: click Select and choose the Services template in the Page Templates Catalog.
Click OK to save. Now click Site in the main toolbar and enter some content. Click Save to save the
changes. As you can see, you can create pages based on the page templates prepared by web
developer. You will learn how to develop such page templates for content editors later in this tutorial.
Creating a New Product
Now you will create a new product. In the tree view, unfold Products and click Category A. Click Site in
the main toolbar. Now you should see the page with editing buttons. Click Add New Product. Enter
product details and click OK to save changes. When you switch back to the Site view you should see the
new product on the page.
You can also find the new product in the tree view on the left. It was created under the page that
represents product category A.

Document paths
As you have seen, all documents are stored in the tree hierarchy. Page is just another document type.
Each document has its unique path. There are three types of path:
• ID Path consists of document IDs, such as /10/15/134. You can use this path in your code for dynamic
links.
• Alias Path consists of document aliases, such as /products/category A/product A1. This path
doesn't change when you modify document name and it is used for URL rewriting, so that you can use
friendly URLs, such as http://www.myweb.com/products/category A/product A1.aspx.
• Name Path consists of document names, such as /products/category A/product A1. This path is used
in bread crumbs navigation control and in other cases when path should be displayed to the end user.
• URL Path is a special path that you can specify for every document. If it’s specified, it can be used for
URLs instead of Alias Path. Unlike Alias Path, the URL Path does not depend on the location of the
document in the tree structure.
You can find all of these paths, when you click Properties in the main tool bar. In this dialog, you can also
modify document alias which changes the URL of the document.

Chapter 4 – File Management
Kentico CMS allows you to upload files, such as images, Office documents or PDF’s) to the server and
manage them as any other document. You can even use versioning, workflow and full-text search in files.
Inserting Image into Page
Now we will upload a new image and use it as a logo: Open the Content module of Kentico CMS Desk,
click the Logo document. This is an article that is used as a logo image and text on all pages. Choose
Edit in the main toolbar. Now you can edit the logo in the WYSIWYG editor. Remove the temporary image
and click the Insert/Edit image icon. The new window allows you to manage files in the tree hierarchy of
documents.
Click the Files folder and click New. Choose to create a new file. Click the Browse... button and select
image on your disk. Click OK to upload the file. Click Site to preview the uploaded file and click the Paste
Image link. Now you can modify the properties of the image, such as width, height or alignment and click
OK to insert image into WYSIWYG editor. Click OK to save the article. Click Site in the main toolbar to
preview the page with new image.
Restricting the type and size of files
You can specify allowed file types using the following web.config parameter in the appSettings section:
<add key="CMSAllowedFileExtensions" value="jpg;txt;doc" />
You can set up maximum size of uploaded files (in bytes) using the following parameter in the
web.config section:
<httpRuntime maxRequestLength="100000" />
Other file management features
This short demo was only a simple example. Kentico CMS allows you to use versioning and workflow
also for files. You can even configure Kentico CMS for full-text search in uploaded files. Full-text search
uses standard Microsoft SQL Server Search Engine that allows you to index and search HTML files, Office
documents (Word, Excel, PowerPoint) and optionally also PDF files or other types of documents.
If you want to use such advanced features, you need to store files in the database, not only in the file
system which is the default value. You can configure this using the following web.config parameter:
<add key="CMSStoreFilesInDatabase" value="true" />
Then, the file system will always contain only published version of the file. If you need more information
about how to configure full-text search, please see Developer’s Guide -> Installation and Deployment
-> Configuration of Full-text Search in Files.
10www.kentico.com we help you deliver better web sites 10

Chapter 5 - Security Administration
Kentico CMS provides a rich and highly flexible and granular security model. You can specify global
permissions as well as local (document-level or section-level) permissions. You can also restrict access to
selected web site areas for authenticated users only. Kentico CMS also provides a detailed auditing trail
with history of all actions made in the administration interface.
Authentication
Kentico CMS uses forms authentication by default. All user names and passwords are saved in Kentico
CMS database and users need to enter their user name and password in the logon form.
For intranets or extranets, you can also use Windows authentication. In this case, Kentico CMS
database contains only user names and users are recognized by their Windows domain identity, so they
do not need to enter their password again. You can find more details on this configuration in the
Developer’s Guide -> Installation and Deployment -> Configuration of Windows Authentication.
Management of Users and Roles

You can easily manage users and roles in the Administration module of Kentico CMS Desk, in sections
Users and Roles. Every user can be member of any number of users or roles. You can define your own
roles and define their permissions (see later).
Authorization
You can manage two levels of permissions:
• Global permissions used for modules, for all documents or for documents of particular type.
• Local permissions used for single documents or sections of your web site.
Global Permissions
The global permissions can be managed in the Administration module, in section Permissions. They
can be assigned only to roles.
Module Permissions
Choose CMS Development module in the Permission matrix dropdown list and click Show. Now you
can modify permissions for the Development module of Kentico CMS Desk.
All Content Permissions

Choose CMS Content module in the Permission Matrix dropdown list and click Show. Now you can
modify permissions for all documents. These permissions override local permissions and they should be
typically used for privileged users, such as site managers and administrators.
Document-Type Permissions
Choose Article document type in the Permissions Matrix dropdown list and click Show. Now you can
modify permisions for all documents of type Article. These permissions override the local permissions,
too.
Local Permissions
Local permissions allow you to set up permissions for particular document or site section. They can be
modified in the Content module of Kentico CMS Desk. They use a similar philosophy as Windows file
system (NTFS) permissions, but all these settings are stored in the Kentico CMS database without
affecting the disk permissions.
Document-Level Permissions
Choose the News/Your First News document in the tree view of the Content module and click the
Permissions button in the main toolbar. Now you can see the list of users and roles. When you select
some user or role, their permissions are displayed in the right part of the dialog. Try to add some
additional user or role to this list using the Add button and set up their permissions. Click OK to save
changes.

Section-Level Permissions
Choose the News document in the tree view of the Content module. When you modify permissions for this
document (for section News), all changes are propagated to underlying documents in the section. In this
way, you can easily set up permissions for particular sections of the web site. You can use the Change
permission inheritance link to break inheritance of permissions from parent documents.
Secured Web Site Areas

Kentico CMS allows you to define secured areas of the web site, such as partner sections or customer
portal. When users try to access a secured area, they are asked for their user name and password.
Sign out from Kentico CMS Desk and open the live web site. Go to the Partners section in the main
menu. Now you are asked for your user name and password. After you enter them, you can see the
secured content.
The secured web site area displays only content the visitor is allowed to read. You can try to create a
new user, grant him with read permission for selected documents and the visitor will see only the relevant
content. It means you can personalize information for particular users or groups of users (e.g.
Partners/Gold Partners).
You can easily set up several secured areas in the web.config file using the following keys in the
appSettings section:
<add key="CMSSecuredAreas" value="/partners;/clients" />
<add key="CMSSecuredAreasLogonPage" value="~/WebLogon.aspx" />

Chapter 6 – Versioning and Workflow
Kentico CMS supports versioning, customizable workflow, content locking (check-in/check-out) and
scheduling. You will typically leverage these features for larger web sites managed by several content
editors.
So far, we were using a simple publishing model when document modifications are displayed on the live
web site immediately:
However, you can easily set up a versioning and workflow scenario for selected document types:
Versioning and Content Locking

We will set up versioning for all news items in the Kentico CMS database. Open Kentico CMS Desk and
choose the Development module. In the tree view, choose Document Templates -> Application: CMS -
> News. You will see the Document Template Properties dialog. Check the Use workflow and
versioning box and click OK to save.
Now go to the Content module and create a news document in the News section. Fill in all fields, set the
Release date value to the current date and time and click OK to save it. After save, you will see the
information toolbar at the top of the editing form. It says that you have checked out the document and that
the workflow step is Edit. Check-out means that you are the only user who can modify the document at the
moment.

After you finish changes, click on the link Save and check in the document... You will be redirected to
the Check in/out Document dialog. You can enter the version number and some comment. Click the
Check in document button. The document is now available for editing by other users. However, it’s not
published yet, as we’re using the default workflow that requires you to approve the document first. Click on
the Publish the document... link in the editing form or on the Publish button in the main toolbar. Click the
Approve button. The document is moved to the Published workflow step as you can see in the Workflow
Steps section and in the Workflow History.
Open the live web site. Check that the news item was published. In this short demo, you have learned how
versioning, check-in/check-out and approval work. The check-in/check-out feature may be complicated for
some content editors. In that case, you can switch off content locking and use only versioning and
workflow. You can do that using the following appSettings key in the web.config:
<add key="CMSUseCheckinCheckout" value="false" />
Workflow
You can define different workflows for different types of documents. In this short demo, we will define a
simple workflow for approving news items.
Creating Users and Roles
First, please create two users in Administration -> Users:
User Alice Murphy, the news editor:

• User name: alicem
• Full name: Alice Murphy
• E-mail address: enter your e-mail address
• Password: (leave empty)
Assign Alice to role CMS Editors.
User John Smith, the PR manager:

• User name: johns
• Full name: John Smith
• E-mail address: enter you second e-mail address
• Password: (leave empty)
Now create a new role PR Managers and assign John to role PR Managers.
Defining the Workflow
Go to the Development module and choose the Workflows section in the left tree view. Click the New
button in the main toolbar and enter the following values in the Workflow Properties dialog:
• Worfklow display name: News Approval
• Workflow name: NewsApproval
Click OK to save changes. Now you can modify workflow steps below. Please note that there are always
two steps: Edit and Published. You can add virtually any number of your custom workflow steps between
them. The document must pass all workflow steps from Edit to Published.
Click the plus button and add the following step:

• Step Display Name: PR Manager Approval
• Step Name: PRManagerApproval

Click OK to save the new step. Now we will specify which roles are allowed to work with document in the
new step and approve them or reject them. Click the plus button next to the list of Allowed Roles and
choose the PR Managers role.
Now we will assign the News documents with this workflow process. In the Development module, open
Development -> Document Templates -> Application: CMS -> News. Make sure that the Use
versioning and workflow box is checked and select the newly created workflow News Approval in the
Workflow dropdown list. Click OK to save changes.
Running the Workflow
Now we will create a news item and approve it in our workflow. Sign in as AliceM (with empty password).
Go to the Content module and create a news item in the News section. Check in the document and
approve it.
Tip: If you receive an error during the approval saying it was not possible to send the e-mail, please check
you have a correct SMTP server set up in the CMSSMTPServer web.config key.
You can no longer work with document as AliceM. Sign out and see the live web site. Check that the news
item hasn’t been published yet.
The members of the PR Managers role (user JohnS) receive an e-mail notification with link to the
document. If you haven’t received the e-mail, you can simply open the CMS Desk and sign in as JohnS.
Go to the My Desk module -> Waiting for approval and click the news item. You can optionally try to
check out the document, modify it and check in the document. Click on the Publish button in the main
toolbar and click Approve. The document is now published on the live web site and the editor who started
the workflow receives an e-mail saying the document has been approved.
Sign out and check that the news item is now published on the web site.

Chapter 7 - Development of Page Templates
Now that you’re familiar with Kentico CMS content editing and administration, you can learn how to create
your own page templates. We will create a simple page template in the sample Corporate Site project.
Development without Visual Studio.NET
It’s recommended that you use Visual Studio.NET 2003. However, if you do not use Visual Studio, you
can still create page templates in other tools, such as DreamWeaver, WebMatrix or any text editor. See
Developer’s Guide -> Creating Page Templates -> Creating Page Templates without Visual Studio.NET.
Opening the Web Project in Visual Studio.NET
Open Windows Explorer and locate the folder where Kentico CMS Web site is deployed (typically
C:\inetpub\wwwroot\KenticoCMS). Open the CorporateSite.vbproj or CorporateSite_CS.csproj file with
Visual Studio.NET- this is a standard ASP.NET project containing the Web site. As you take a closer look,
you will find out that the page templates, such as default.aspx, services.aspx or products.aspx are
standard ASP.NET pages. It means you have full control over these pages and you can use both
Kentico CMS Controls as well as your own controls or code on these web forms.
Adding Kentico CMS Controls to Your Toolbox
Before you can use Kentico CMS Controls you need to add them to your Toolbox. Right-click the Toolbox
window in Visual Studio.NET, add a new tab, click Add/Remove items and locate the
Kentico.CMS.Controls.dll library in the bin directory of the web project.
Creating a New Page Template – SingleArticle.aspx
We will create a very simple page template for page with main menu, header and text. Add a new
ASP.NET page to your web project and call it SingleArticle.aspx. Now switch to the HTML code.
Registering Kentico CMS Controls
Add the following code just after the first line (<%@ Page...%>):
<%@ Register TagPrefix="cc3" Namespace="Kentico.CMS.DataEngine"

Assembly="Kentico.CMS.DataEngine" %>
<%@ Register TagPrefix="cc2" Namespace="Kentico.CMS.TreeEngine"
Assembly="Kentico.CMS.TreeEngine" %>
<%@ Register TagPrefix="cc1" Namespace="Kentico.CMS.CMSControls"
Assembly="Kentico.CMS.CMSControls" %>
<%@ Register TagPrefix="uc1" TagName="Header" Src="Header.ascx" %>
You have added reference to Kentico CMS Controls and Kentico CMS libraries to your page. You have
also registered the Header.ascx control.

Changing the DOCTYPE
It’s recommended that you change the DOCTYPE to XHTML 1.1 Strict so that your pages are XHTML-
compliant and so that some sample CSS styles work correctly. Replace the existing DOCTYPE with:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1 Strict//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
Rendering the Page Title and Meta Tags
Replace all content inside the <head></head> element with following two lines:
<%=CorporateSite.Functions.GetPageTags("/home")%>
The GetPageTags function returns the <title> element and the meta tags description, keywords and
main.css stylesheet link.
Setting Background Image
<body background='<%=ResolveUrl("~/")%>images/background.gif'>
Please note that you need to use the ResolveUrl method in order to render a correct URL starting from the
root of your web project.
Making the Page Editable
Now we will define editable regions in our page template. Paste the following code inside the
<form></form> element:
<div class="MainPage"><cc1:cmspagemanager id="CMSPageManager1"

runat="server"></cc1:cmspagemanager><uc1:header id="Header1"
runat="server"></uc1:header><BR>
<h1><cc1:CMSEditableRegion id="Cmseditableregion1" runat="server"
RegionTitle="Page Header"
RegionType="TextBox" DialogHeight="1" DialogWidth="80">
</cc1:CMSEditableRegion></h1>
<p><cc1:CMSEditableRegion id="CMSEditableRegion2" runat="server"
RegionTitle="Page Text"
RegionType="HtmlEditor" DialogWidth="600"
DialogHeight="400">
</cc1:CMSEditableRegion></p>
</div>
The div class is used only for page layout (you can use both CSS-based layout and table layout with
Kentico CMS).
The CMSPageManager1 control displays the page toolbar with Save button. It also ensures saving and
loading of content on the page.
The header control is a simple user control (ascx) that contains the main menu. It’s used on all pages and
it allows you to define the main menu in one place.
The CMSEditableRegion1 control creates an editable region that allows you to edit/display the page
header. It uses the following settings:
• RegionTitle – the title displayed in the editing mode.

• RegionType – the type of the editing control displayed in the editing mode. Possible values are
TextBox, TextArea and HtmlEditor.
• DialogHeight – the height of the editing control.
• DialogWidth – the width of the editing control.
The CMSEditableRegion2 control creates an editable region that allows you to edit/display the page text.
It uses similar settings as the CMSEditableRegion1 control, but it is displayed as HTML editor in the
editing mode.
CMSPageManager and CMSEditableRegion controls allow you to make the page editable. This
approach is suitable for pages with simple text-only content. Later in this tutorial, you will learn how to
create pages with product listings and product details with strictly structured and typed data.
Compiling the Project
Now you need to compile the project (CTRL+Shift+B). You need to do this every time you add a new page
to the project.
Registering the New Page Template
Now that you have created and compiled a new page template, you need to register it in Kentico CMS
Desk so that content editors can use it. Open Kentico CMS Desk and go to Development -> Page
Templates. Click the New button in the main toolbar and enter the following values:
• Template Name: Single Article

• Template File Name: SingleArticle.aspx
Click OK to save the new page template in the Page Template Catalog.
Creating a new page based on the template
In Kentico CMS Desk, click Content in the main menu and click the root. Click New in the main toolbar
and choose to create a new Page (Menu Item). Enter the following values:
• Caption: Our Company

• Order: 9
• Type: Page Template
• Page Template: click Select... and choose Single Article
• Page Title: About Our Company
• Show in Site Map: Yes (check the box)
• Hide in Navigation: No (uncheck the box)
Click OK to create the new page.
Editing Content of the New Page
Click Site in the main toolbar. Now you can edit the content of the Our Company page. Enter some values
and click Save.

How Page Templates Work

Now you might be curious how the page templates work and what level of flexibility you have. The
following figure shows you an example of page processing:
As you can see, page templates are standard ASP.NET pages that receive the aliasPath parameter in the
URL and display appropriate content. The aliasPath value is the path of the document in the tree hierarchy
of content. The controls automatically get the aliasPath parameter and display appropriate content.
Adding Your Own Code to the Page

Since Kentico CMS leverages the standard ASP.NET architecture, you can easily add your own code to
the page. You can try to add a new button control named Button1 on the page and put the following code
into its OnClick handler:
[VB.NET]
Button1.Text = System.DateTime.Now.ToString

[C#]
Button1.Text = System.DateTime.Now.ToString();
After you compile and run the project, you will see that the code displays current time on the button. As
you can see, you can easily add your own functionality to the page using standard ASP.NET code.
URL Format
Kentico CMS uses friendly (or “smart“) URLs in format /products/category 1.aspx by default. You can
configure extensions such as .html or any other using the following web.config key in the appSettings
section:
<add key="CMSFriendlyURLStyle" value=".html" />
However, you will need to map the .html extension to the ASP.NET engine in the IIS console, in the
web site or virtual directory properties.
If you want to use the URLs without extension (in format /products/category 1), you need to set up the
following keys in the web.config:
<add key="CMSFriendlyURLStyle" value="" />

<add key="CMSGenerateFriendlyUrlFiles" value="true" />
If you need to add pages to your web site that will not be managed by Kentico CMS, you can exclude
them from URL rewriting using the following web.config parameter:
<add key="CMSExcludedDirectories" value="/register;/shop“ />
More on Development
This was a small example of creating a new page template. Later in this guide, you will see how to create
the whole web site from scratch.

Chapter 8 – Creating a Web Site from Scratch

This chapter will show you how to create the Corporate Site from scratch. You will start from simple pages
with editable regions, you will learn how to create a product catalog, how to incorporate full-text search
into your web site and you will learn several useful techniques. After finishing this chapter, you will be able
to create common web sites with Kentico CMS.
Installing a Blank Project

Run Kentico Web Installer (you can find it in the Start menu) and install a new web site. Please make
sure that you choose to create a blank solution in Step 6. You can choose any programming language.
The new web site doesn’t contain any pages or page templates. The blank web site contains several files
and settings – please do not remove them as they ensure that the system will work properly.
Adding Kentico CMS Controls to Your Toolbox

If you haven’t added Kentico CMS Controls to your VS.NET toolbox yet, please do it now: Right click the
toobox and choose Add tab. Call the tab CMS Controls. Right click the new tab and choose
Add/Remove Items... Locate the Kentico.CMS.CMSControls.dll library in the bin folder of your web
project and click OK to confirm the dialog. You should see the CMS controls in your toolbox now.
Setting the Project Namespace

Before we start our development, we will change the project namespace from WebProject to
CorporateSite so that we can use the same names as in the sample Corporate Site project.
Please open the project properties from Project -> WebProject Properties... and change the Root
namespace value from WebProject to CorporateSite. Click OK to confirm the dialog.

In the main menu, choose Edit -> Find and Replace -> Replace (CTRL + H) and replace
WebProject.
with
CorporateSite.
(including the dot at the end) in the whole web project.
If you’re using the C# version, you also need to replace

namespace WebProject
with
namespace CorporateSite
in the whole web project.
The project is now ready for your development.
Please note: In other projects, you can use the default namespace, of course, but you may need to
change the way you call helper functions in your ASPX pages and in the ASCX transformations from
CorporateSite.Functions... to WebProject.Functions...

Step 1 - Creating the Header of the Site

We will start with creating the site header. It will contain a logo, a main menu, a search box and a link to
Site Map. We will create the header as a user control (ASCX) so that we can re-use this header on all web
pages.
Right click your project in the Solution Explorer and add a new user control to your web project called
Header.ascx.
Switch to the HTML mode and paste the following code in the file:
<div class="sampleInfoPanel"><A class=InfoLink

href='<%=ResolveUrl("~/cmsdesk/")%>logon.aspx?user=administrator'>Click
here</A> to sign in to the administration interface (administrator/blank
password). <a href= ' <%=ResolveUrl("~/ControlsExamples/default.aspx")%> '
target="_blank">Click here</a> to see controls examples.
</div>
<div class="logoBar">
logo
</div>
<div class="searchBar">Search:
search
</div>
<div class="mainMenuBar">
<div class="Horizontal">
menu
</div>
</div>
The div elements with CSS styles define the CSS-based layout of the header. The CSS styles are already
defined in the main.css file, so you don’t take care of them in this sample web site. In your own web
project, you can define your own styles or you can simply use the table-based layout.
Now switch back to the Design mode and drag and drop the following controls on the form:
• Put CMSViewer control inside the text „logo“
• Put CMSMenu control inside the text „menu“
You will see a page like this:
Now remove the extra characters “logo“ and “menu“ (we used them only for placing the controls on the
right place):

Set the following properties of the controls:
CMSViewer
• SelectNodesPath: /logo
• SelectNodesClassName: cms.article
• TransformationName: cms.article.articletext
The CMSViewer control is used to display specified document or several documents. We will use it to
display an article with logo and header text. It is an example of how you can reuse content on several
pages with Kentico CMS.
The document is specified using the SelectNodesPath property which is actually the alias path of the
document in the tree hierarchy of content. You can find this path in the CMS Desk -> Content -> ... select
document -> click Properties in the main menu -> find the Alias Path value. /logo is the path to the
document that we will create later.
The SelectNodesClassName property specifies the type of the document that should be displayed.
The CMSViewer control uses transformation specified in the TransformationName property to display the
document on the page. The transformations are defined in the CMS Desk -> Development -> Document
Types -> Application: CMS -> ... select document type – e.g. an article ... -> Transformations. The
transformation is either an XSLT stylesheet or an ASCX control (HTML code with standard ASP.NET
databinding expressions). The transformation cms.article.articletext is an XSLT transformation that
displays only article text without article name.
CMSMenu
• SelectNodesPath: /%
The CMSMenu control displays a dropdown menu. You can also use CMSListMenu, CMSTreeMenu or
CMSTabControl in your projects.
The SelectNodesPath property specifies which menu items should be displayed. The value /% means
that all items under the root will be displayed (it’s similar to C:\*.* expression you know from DOS). Please
note that the CMSMenu displays only documents of type Page (menu item) by default, but this can be
overriden using the property SelectNodesClassNames.
We wil not implement the search functionality at this moment.
Displaying the Header on the Home Page
Now that we have created the header control, we can simply drag and drop the control on the default.aspx
page, which is the home page. Please do that, remove the original temporary text and run the web project.
(you may need to set the default.aspx page as the start page). You should see a page like this:

The content is not displayed as we haven’t created it yet. Click on the link “Click here to sign in...“ and sign
in as administrator (with blank password) to Kentico CMS Desk. Choose the Content module in the main
menu and create the following documents:
/Home (page/menu item document)

• Caption: Home
• Order: 1
• Page Template: Home page
Leave other fields empty or use the default values and click OK to save. This page will represent the home
page link in the main menu.
Click on the root item again and create a new article:
/logo (article)
• Article name: Logo
• Article text: click the Insert/Edit Image icon in the WYSIWYG editor and click Browse Server. It
displays the Content section in a new window. Now you can create a new folder called Files
under the root and upload some logo under this folder. Click Site and after you see the preview of
the uploaded logo, click on the Page Image link. Click OK to confirm the Image Properties
dialog.
Click OK to save. You should have the following document structure in the left tree view:
Now click on the root item and choose Site in the main toolbar. You will see a preview of the web site:
We have created the web site header. You could create the web site footer in the same way. As you can
see, we were using standard ASP.NET features and Kentico CMS Controls to display the logo article and
the main menu.
Step 2 - Making the Home Page Editable

In this step, you will make the content of the home page editable. Close the browser and open the
default.aspx page in the HTML mode. Replace everything between the <form></form> elements with
following code:

<div class="MainPage">
<cc1:CMSPageManager id="CMSPageManager1"
runat="server" DefaultPageAliasPath="/home"></cc1:CMSPageManager>
<uc1:Header id="Header1" runat="server"></uc1:Header>
<div class="Content">
<div class="ContentArticle">
<div class="ContentArticlePadding">
<cc1:CMSEditableRegion id="Region1" runat="server"
RegionType="HtmlEditor" DialogHeight="350"
RegionTitle="Home page content"
DialogWidth="550"></cc1:CMSEditableRegion>
</div>
</div>
<div class="ContentNews">
<div class="ContentNewsPadding">
</div>
</div>
</div>
</div>
This code contains the DIV elements that define the layout of the page. The first control on the page is
CMSPageManager, the control that ensures displaying of the toolbar on pages with editable regions and
saving of the content. It uses the following settings:
• DefaultAliasPath: /home
This value says to the control what page path should be used if page doesn’t receive any path in the
AliasPath URL parameter.
The CMSEditableRegion control defines the editable area. You can specify the size of the dialog using
the DialogHeight and DialogWidth properties, the region title using the RegionTitle property and the
region type (TextBox, TextArea, HtmlEditor) using the RegionType property.
Save the changes and run the web site again. When you sign in to Kentico CMS Desk and choose the
Content section, the web page is editable now:
Enter some content in the WYSIWYG editor and click the Save page link to save it. When you click on the
“Published version“ radio button in the toolbar, you can see that the editable region now displays the
entered text on the live page:

In this step, we have made the home page editable. Of course, you can define several editable regions on
a single page. This approach is recommended for pages with unstructured content. Later in this chapter,
you will see how to display structured documents (a catalog of products).

Step 3 – Creating the Services Section

In this step, we will create a new page template for the Services section. It will display the header with
main menu, a left menu and a simple page with header and some text. We will use editable regions again,
but in this case, you will see how you can reuse one page template for several pages.
Close the browser and go to Visual Studio.NET. Add a new page and call it Services.aspx. Switch to the
HTML mode and remove all the code except for the <%@ Page ... %> directive. Put the following code
into the page:

<html>
<head>
<%=CorporateSite.Functions.GetPageTags("/services")%>
</head>
<body>
<form id="Form1" method="post" runat="server">
header
<div class="CategoryMenu">
menu
</div>
<div class="RightColumn">
content
</div>
</div>
</div>
</form>
</body>
</html>
The first lines with <%@ Register ... %> directive register Kentico CMS Controls and other libraries on the
page so that you can use them. They also register the header control. They are followed by document
definition and by standard HTML page code.
The <head> section contains the GetPageTags method that renders page title, description and keywords
metadata and the link to the main.css file.
The <div> elements inside the <form> section define the layout of the page. Please switch to the Design
mode now. Drag and drop the following controls on the form and set their properties:
CMSPageManager (inside the header section)
Header.ascx (just after the CMSPageManager)

CMSTreeMenu (inside the menu section)

• SelectNodesPath: /services/%
• Indentation: 3
• DisplayHighlightedItemAsLink: True
The CMSTreeMenu control displays hierarchical menu. You can specify the menu items
(SelectNodesPath), indentation, different styles for every menu level (CSSPrefix), etc.
CMSBreadCrumbs (at the beginning of the content section)
The CMSBreadCrumbs control displays breadcrumb navigation displaying visitor’s current position on the
web site (such as Services > Service 1). It’s usually not necessary to set up any properties.
CMSEditableRegion PageHeader (inside the content section, surrounded with <h1> element)
• ID: PageHeader
• RegionTitle: Page Header
Region title specifies the title in the editing mode. The input type is TextBox by default.
CMSEditableRegion PageText (inside the content section)

• RegionTitle: Page Text
• RegionType: HtmlEditor
After you remove the temporary text, you will see a page like this:
Now that we have created a new page template (services.aspx), we need to register it in the Page
Template Catalog so that the content editors can use it.
Run the project and sign in to Kentico CMS Desk. Go to Development -> Page Templates. Add the new
page template by clicking the New button in the main toolbar. Enter the following values:
• Page Template Name: Services
• Page Template File Name: services.aspx
Click OK to save. Now the content editors can use this template.
Go to the Content section and create a new page (menu item) under the root with the following values:
• Caption: Services
• Order: 2
• Page Template: Services
Leave the other values empty or use the default values. Click OK to Save.
After you create the new page, click on the Site icon in the main toolbar and enter some text in the Page
Header and Page Text editable regions. Click Save to save the changes.

Click Services in the left tree view, click New in the main toolbar and create a new page. Enter the
following values:
• Caption: Service 1
• Page Template: Services
Click OK to save changes. Switch to the Site view and enter some text in the editable regions. Click Save
to save changes.
You can try to create other pages in this section now. As you can see, we have created a re-usable page
template with main menu, left sub-menu and editable regions.

Step 4 – Creating a Product Catalog

In this Step, we will create a simple product catalog with several categories, product previews and
product details. Unlike the previous examples, this page doesn’t use editable regions. Instead, it uses
separate, stricly structured documents (product descriptions). These documents allow you to easily
separate content and design and store data in a standard relational table.
Close the browser and go back to Visual Studio.NET. Add a new page called products.aspx to the
project. Switch to the HTML mode and remove all lines except the first one with <%@ Page ... %>
directive. Put the following content after the Page directive:

<html>
<head>
<%=CorporateSite.Functions.GetPageTags("/products")%>
</head>
<body>
header
menu
</div>
<div class="ProductList">
content
</div>
</div>
</div>
</form>
</body>
</html>
Switch to the Design mode and drag and drop the following controls on the page and set their properties:
Header.ascx (inside the header section)
CMSTreeMenu (inside the menu section)

• SelectNodesPath: /products/%
• DisplayHighlightedItemAsLink: True
• Indentation: 3
CMSBreadCrumbs (inside the content section)
CMSDataList (inside the content section)

• SelectNodesClassName: cms.product

• TransformationName: cms.product.preview
• SelectedItemTransformationName: cms.product.default
• RepeatColumns: 2
• CellPadding: 5
The CMSDataList control is one of the controls that allow you to display lists of documents (such as
product listings, list of news, etc.). You can also use CMSDataGrid and CMSRepeater. All of these
controls are inherited from the standard ASP.NET DataList, DataGrid and Repeater, but they are much
easier to use.
The CMSDataList control allows you to display the list of documents and the detail view of the selected
document. The SelectNodesClassName property specifies the type of documents that should be
displayed (products). The SelectNodesPath property is not set now which means that the control
automatically retrieves all documents under current site section (under /products/%, under
/products/category A/%, etc.). The TransformationName property specifies the ASCX transformation that
is used to display items in the listing. It is an alternative way to specifying the ItemTemplate section in the
HTML mode. The SelectedItemTransformationName property specifies the ASCX or XSLT
transformation that is used to display the selected item. We will take a closer look at transformations in the
next step. The RepeatColumns property defines the number of columns and the CellPadding property
defines the padding of every item.
After you remove temporary text, you will see a page like this:
Run the project and sign it to Kentico CMS Desk. We need to register the new page template first. Go to
Development -> Page Templates and register the new page template with following values:
• Page Template Name: Products
• Page Template File Name: products.aspx
Go to the Content module and create a new page with following values under the root:
• Caption: Products
• Order: 3
• Page Template: Products
Leave the other values empty or use the default values. Click OK to save changes.
Select the newly created Products document in the treeview and create the following pages under
Products:
• Caption: Category 1
• Caption: Category 2

Now we will create sample products under each category. Please create 2 documents of type Product
under Category 1and 2 documents of type Product under Category 2. You can enter any values and you
can upload some pictures as product photos.
When you sign out from Kentico CMS Desk and go to the live site –> Products, you can see a page like
this:
As you can see, we have used pages as containers for products. This allows content editors easily locate
the products and modify them. It’s also easy for you to display such content on the page. Kentico CMS
allows you to create up to 14 levels of nested documents/pages.
Later in this tutorial, you will learn how to define your own document types (such as house, car, PC, etc.)
with custom fields.

Editable Regions or Separate Documents?
Now you may wonder what the difference between pages with editable regions and separate documents,
such as products, is. Here’s a short overview:
Editable Regions Separate Documents
How they are stored Single database column Each document type has its
Content_MenuItem.MenuItemContent own database table. Every
contains all editable regions on the document attribute has its own
given page as one XML document. column. For example, all
products are stored in the table
Content _Product with columns:
• ProductID
• ProductName
• ProductDescription
• ProductPrice
• ProductPhoto
How they are displayed You can display the content using You can display the content
CMSPageManager and one or more using several built-in controls
CMSEditableRegion controls. (CMSDataList, CMSRepeater,
CMSViewer, etc.). You can also
retrieve them using Kentico
CMS API as DataSet or XML
and display them and third-
party controls.
How they are edited You need to create a new page, open You need to create a new
it in the Site mode and you can make document of the appropriate
the changes. type (product/article/news/...).
When Should I Use Editable Regions?
Use editable regions when you want to create page with unstructured content and you do not expect that
you will need to work with separate fields or parts of content in future.
When Should I Use Separate Documents?
Use separate documents when you need to create strictly structured and typed content, such as product
descriptions, news items, job openings, etc. The structured content alllows you to fully separate content
and design and display the same content in different ways (using different transformations and CSS
styles).

Step 5 – Modifying the Transformations

In this step, we will change the way the products are displayed in the detailed view. You will learn how you
can manage different transformations for displaying structured content.
Open the web site in your browser and go to the Products section. This listing uses the
cms.product.preview transformation specified in the CMSDataList.TransformationName property.
When you click on the link Product A1, you’re redirected to the page with product details:
The details are displayed using the cms.product.default transformation specified in the
CMSDataList.SelectedItemTransformationName.
How It Works
You may wonder how the DataList knows when to display the listing or the detail view:
• When you choose the Products page, the DataList receives the current URL, such as
http://localhost/KenticoCMS/Products.aspx. It parses the URL and retrieves the selected path
/Products, which is a path to page. The DataList understands that this is a page and it should
display the listing.
• When you click on some link in the listing, you’re redirected to the URL like this:
http://localhost/KenticoCMS/Products/Category 1/Product A1.aspx. The DataList parses the
URL and retrieves the selected path /Products/Category 1/Product A1. It understands that this
is a selected product (the type of the selected document is the same as the
CMSDataList.SelectNodesClassName value) and displays the detail view.
As you can see the redirection to the detail view is ensured by redirecting the user to the appropriate
URL instead of using postback. It also means that every document and every page has its own URL and
you can copy the current URL from the address bar and send it to some other person without worrying if
he/she gets the same page.
Now we will take a closer look at the transformations. Sign it to Kentico CMS Desk and go to the
Development module -> Document Templates -> Application: CMS -> Product -> Transformations.
Here you can find the default and preview transformations.
Click to edit the preview transformation. You will see a code like this (we have removed extra code that is
not important for you now). It is used for displaying every document:

<h2><a href='<%# CorporateSite.Functions.GetUrl(DataBinder.Eval(Container,"DataItem.AliasPath"))

%>'>
<%# DataBinder.Eval(Container, "DataItem.ProductName") %>
</a></h2>
<p>$<%# DataBinder.Eval(Container, "DataItem.ProductPrice") %></p>
<p>
<img src='<%#
ResolveUrl("~"&Server.UrlPathEncode(DataBinder.Eval(Container,"DataItem.ProductPhoto"))) %>'>
</p>
As you can see, it is actually a standard ASP.NET code. You can use expressions, such as
<%# DataBinder.Eval(Container, "DataItem.ProductPrice") %>
to insert appropriate values in the HTML code. When you need to render an URL of the displayed
document, use the following expression:
<%# CorporateSite.Functions.GetUrl( DataBinder.Eval(Container,

"DataItem.AliasPath")) %>
It uses the CorporateSite.Functions.GetUrl method that ensures you get a working URL.
Please note: If your project is called WebProject, you may need to refer to the method as
WebProject.Functions.GetUrl(...).
When you need to display an image that was selected by content editor using the image selection field,
you can use an expression like this:
<img src='<%# ResolveUrl("~" & Server.UrlPathEncode(DataBinder.Eval(Container,

"DataItem.ProductPhoto"))) %>'>
It uses standard ASP.NET methods to get the image URL.
Using XSLT
If you prefer using XSL transformations, you can define a new transformation and choose the XSL
option. Then click the Use Default Transformation button and you get a basic XSL code for your
document type that you can modify.
Now that you understand the code, you can try to modify the default and preview transformations so that
they display different fields or different design.

Step 6 – Displaying the News Section and the Latest News

In this step, we will add the News section and the Latest News column on the home page. You will learn
how to use the CMSRepeater and QueryRepeater controls.
Go to Visual Studio.NET and add a new web form to your project called news.aspx. Switch to the HTML
mode and remove all code except for the <%@ Page ... %> directive. Copy and paste the following code
just under the Page directive:

<html>
<head>
<%=CorporateSite.Functions.GetPageTags("/news")%>
</head>
<body>
content
</div>
</form>
</body>
</html>
Switch to the Design mode, drag and drop the following controls in the content section and set their
properties:
Header.ascx
CMSRepeater
• SelectNodesPath: /news/%
• SelectNodesClassName: cms.news
• SelectNodesOrderBy: NewsReleaseDate DESC
• TransformationName: cms.news.preview
• SelectedItemTransformationName: cms.news.default
The SelectNodesPath property specifies that the documents should be selected from the /news/%
section. The SelectNodesClassName property defines the type of documents that should be retrieved.
The SelectNodesOrderBy property specifies the SQL sorting expression used for the listing (you could
use also the SelectNodesWhere property to specify SQL WHERE expression). The
TransformationName property specifies the transformation used for the listing view and the
SelectedItemTransformationName specifies the transformation for the detail view.
After you remove the temporary text, you will see a page like this:

Run the web project and go to Kentico CMS Desk -> Development -> Page Templates. Register the
new page template with following values:
• Page Template Name: News

• Page Template File Name: News.aspx
Click OK to save. Go to the Content module and create a new page under the root with following values:
• Caption: News
• Order: 4
• Page Template: News
Leave the other values empty or use the default values. Click OK to save changes.
Click the News item in the tree view and create two documents of type news under this section. Use the
current date and time in the Release Date field.
When you go to the live web site now, you will see a page like this:
When you click on some news item, its full text is displayed.
Displaying the Latest News Column on the Home Page
Now that you know how to display all news, you will learn how to display the latest 3 news on the home
page. Go back to Visual Studio.NET, open the default.aspx page in design mode and add drag and drop
the QueryRepeater control on the web form. Set the following properties:
• QueryName: cms.news.selectlatest
• TransformationName: cms.news.preview
The QueryRepeater executes the query specified in the QueryName property and displays returned
records using the ASCX transformation specified in the TransformationName property.
Switch to the HTML mode and make sure the QueryRepeater is placed inside the <DIV> element with
class=“ContentNewsPadding“.

Run the web project and see the web page. It should look like this:
As you can see, the QueryRepeater control (and also the QueryDataGrid and QueryDataList controls) is
useful in situations when you need to run a special query, not just retrieve all documents from the selected
web site section. The option of writing your own queries gives you the same flexibility as you would have
in pure ASP.NET, but it makes the whole task much easier.
Defining Custom Queries
If you need to use custom queries for displaying content, you need to define them in the Kentico CMS
Desk -> Development -> Document Templates -> Application: CMS -> ... select the appropriate document
type ... -> Queries. Here you can define any number of queries. When you refer to the query in the
QueryName property, you must use the fully qualified name, such as cms.news.selectlatest.
If you need a database documentation, please see the Kentico CMS Database Reference (CHM file) in
the Start menu.
Here’s an example of such a query:
SELECT top 3 view_cms_tree_joined.*, Content_News.*

FROM view_cms_tree_joined
INNER JOIN content_news ON view_cms_tree_joined.foreignkeyvalue =
content_news.NewsID
WHERE classname = 'cms.news' AND NewsReleaseDate <= GetDate() AND Published
= 1 AND (##WHERE##)
ORDER ##ORDERBY##
Please note the view_cms_tree_joined view. It contains data from the CMS_Tree table and some other
(extending) tables. Then, the query joins the document type-specific table Content_News with news data.
Special Macro Expressions in Queries
As you can see in the samle above, the queries can contain special expressions ##WHERE## and
##ORDERBY##. These expressions are replaced with values in the QueryRepeater.SelectNodesWhere
and QueryRepeater.SelectNodesOrderBy properties respectively. In this way you can further modify the
query as you need.

Step 7 – Creating a Contact Page with Contact Form

In this step, we will create a contact page with a contact form. We will use editable regions and you will
learn how add your own controls and code to the page template.
Please note: There’s also an easier way how to create on-line forms without programming – you
will learn it later in Step 15.
Go to Visual Studio.NET and add a new web form called contact.aspx. Switch to the HTML mode and
remove all lines except for <%@ Page ... %> directive. Add the following code after the Page directive:

<html>
<head>
<%=CorporateSite.Functions.GetPageTags("/contact")%>
</head>
<body>
content
<h1>Contact Us</h1>
<table>
<tr>
<td>Your e-mail:</td>
<td></td>
</tr>
<tr>
<td>Your message:</td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
</tr>
</table>
</div>
</form>
</body>
</html>
Drag and drop the following controls in the content section and set their properties:
CMSPageManager
Header.ascx
CMSEditableRegion

• ID: MainText
• RegionTitle: Main Text
• Region Type: HTML Editor
• DialogHeight: 400
• DialogWidth: 700
Textbox txtEmail (next to the Your e-mail label)

• ID: txtEmail
• Columns: 38
Textbox txtMessage (next to the Your message label)

• ID: txtMessage
• TextMode: MultiLine
• Columns: 30
• Rows: 5
Button (under the textbox txtMessage)

• Text: Send Message
Label lblResult (under the submit button)

• ID: lblResult
• Text: (clear the value)
You should see a page like this:
Now we will write code that sends and e-mail with entered message. Double-click the button, you will be
redirected to the code behind. Add the following code at the beginning:
[VB.NET]
Imports System.Web.Mail
[C#]
using System.Web.Mail;

Add the following code to the button Click event handler:
[VB.NET]
Dim msg As New Mail.MailMessage

msg.To = "admin@mycompany.com"
msg.From = txtEmail.Text
msg.Subject = "Contact Form Message"
msg.Body = "<html><body>" & Replace(Server.HtmlEncode(txtMessage.Text), _
vbCrLf, "<br>") & "</body></html>"
msg.BodyFormat = MailFormat.Html
SmtpMail.SmtpServer = "localhost"
SmtpMail.Send(msg)
lblResult.Text = "Thank you for your message. We will contact you soon."
[C#]
MailMessage msg = new MailMessage();

msg.To = "admin@mycompany.com";
msg.From = txtEmail.Text;
msg.Subject = "Contact Form Message";
msg.Body = "<html><body>" + Server.HtmlEncode(txtMessage.Text).Replace("\n",
"<br>") + "</body></html>";
msg.BodyFormat = MailFormat.Html;
SmtpMail.SmtpServer = "localhost";
try
{
SmtpMail.Send(msg);
lblResult.Text = "Thank you for your message. We will contact you soon.";
}
catch (Exception ex)
{
lblResult.Text = "Could not send. Check the correctness of email adress.";
}
Please replace the e-mail address and the SMTP server address in the code with your values.
Run the web project and sign in to Kentico CMS. Go to the Development -> Page Templates and register
the new page template with following values:
• Page Template Name: Contact
• Page Template File Name: contact.aspx
Go to the Content section and create a new page under the root with following values:
• Caption: Contact
• Order: 6
• Page Template: Contact
Click Site in the main toolbar and enter some page text. Click the Save link to save changes and sign out.
Go to the Contact page on the live site. You will see a page with dialog like this:

Enter a valid e-mail address and message text and send the message. You should receive it to your e-
mail. This page template shows you how you can combine Kentico CMS content with your own code.

Step 8 – Adding Search Capabilities

In this step, you will learn how to add search capabilities to your web site. First, we will create a search
page template and then, we will add the Search dialog to the web site header.
Go back to Visual Studio.NET and add a new web form called search.aspx. Remove all the code except
for the <%@ Page ...%> directive and put the following code instead of it:

<html>
<head>
<%=CorporateSite.Functions.GetPageTags("/search")%>
</head>
<body>
content
</div>
</form>
</body>
</html>
Switch to the Design mode, drag and drop the following controls in the content section of the page and set
their properties:
Header.ascx
CMSSearchDialog
• ShowSearchScope: False
The CMSSearchDialog control displays a simple dialog for entering the text and the search mode.
CMSSearchResults
• CMSSearchDialogID: CMSSearchDialog1
• TargetURL: ~/SearchResultRedirect.aspx?idpath=
• UseFriendlyUrls: False
The CMSSearchResults control displays the results of the search. It can be easily joined with the
CMSSearchDialog by setting the CMSSearchDialogID property to the ID of the CMSSearchDialog control
on the page. It’s recommended that you use the SearchResultRedirect.aspx page that ensures correct
redirection to pages and files. This page also allows you to modify the redirection to the correct URL if you
have some special requirements and the default redirection doesn’t work well for you. You need to set the
TargetURL and UseFriendlyUrls properties and shown above.
You should see a page like this:

Run the project and sign in to Kentico CMS Desk. Go to Development -> Page Templates and register
the new page template with following values:
• Page Template Name: Search
• Page Template File Name: search.aspx
Go to the Content module and create a new page under the root with following values:
• Caption: Search
• Order: 5
• Page Template: Search
Leave the other values empty or use the default values. View the page in the Site mode. You will see a
page like this:
Enter some word and click Go. Verify that the result links redirect you to the correct document.
Adding Search Box to the Site Header
Now we will add a search box to the site header. Go back to Visual Studio.NET and open the header.ascx
control in the design mode. Add a new textbox and a button next to the Search: text:
Set the text of the button to Go. Double click the button and add the following code to the event handler:

[VB.NET]
Response.Redirect("~/search.aspx?searchtext=" & _
Server.UrlEncode(TextBox1.Text))
[C#]
Response.Redirect("~/search.aspx?searchtext=" +
Server.UrlEncode(TextBox1.Text));
This code redirects user to the search page with search text in the URL parameter. Now we need to add
some small code to the search.aspx page to receive this parameter and set appropriate properties of the
search controls.
Open code behind of the search.aspx page and add the following code to the Page_Load event:
[VB.NET]
If Not Page.IsPostBack AndAlso _

Not Request.QueryString("SearchText") Is Nothing AndAlso _
Request.QueryString("SearchText") <> "" Then
CMSSearchDialog1.SearchExpression = Request.QueryString("SearchText")
CMSSearchResults1.SearchExpression = Request.QueryString("SearchText")
CMSSearchResults1.CMSSearchDialogID = ""
Else
CMSSearchResults1.CMSSearchDialogID = "CMSSearchDialog1"
End If
[C#]
if ((! Page.IsPostBack) &&

! (Request.QueryString["SearchText"] == null) &&
Request.QueryString["SearchText"] != "")
{
CMSSearchDialog1.SearchExpression = Request.QueryString["SearchText"];
CMSSearchResults1.SearchExpression = Request.QueryString["SearchText"];
CMSSearchResults1.CMSSearchDialogID = "";
}
else
{
CMSSearchResults1.CMSSearchDialogID = "CMSSearchDialog1";
}
Run the web project. Enter some text in the search textbox and clicko Go. You should see search results
on the search.aspx page.
If you do not want to display the Search page link in main menu, sign in to Kentico CMS Desk, edit the
/Search page and check the Hide in Navigation checkbox.

Step 9 – Adding the Site Map

In this step, we will create a new page template that will display the site map. Go to Visual Studio.NET and
add a new web form called sitemap.aspx. Switch to the HTML mode, remove all the code except for the
<%@ Page ...%> directive and put the following code instead of it:

<html>
<head>
<%=CorporateSite.Functions.GetPageTags("/sitemap")%>
</head>
<body>
content
</div>
</form>
</body>
</html>
Switch to the design mode and add the following controls in the content section:
Header.ascx
CMSSiteMap
The CMSSiteMap control displays dynamically the site map. It’s not necessary to set any properties in
most cases.
Run the web project and sign in to Kentico CMS. Go to Development -> Page Templates and register the
new page template with following values:
• Page Template Name: Site Map
• Page Template File Name: sitemap.aspx
Go to the Content module and create a new page under the root with following values:
• Caption: Site Map
• Order: 7
• Page Template: Site Map
Leave the other fields empty or use the default values. See the live web site. It should look like this:

Step 10 - Using Custom Document Types

With Kentico CMS, you can define custom document types with custom fields. Custom document types
allow you to fully separate content and design as you can use custom fields of different data types.
In this chapter, we will create a new document type “Computer“ and we will add a new category
„Computers“ under the Products section.
Defining a New Document Type
Sign in to Kentico CMS Desk and go to the Development module. Unfold Document Templates and click
Application: CMS. Click New to create a new document template (document template is just another
name for document type). Enter the following values in step 1:
• Display Name: Computer

• Code Name: Computer (the whole code name is CMS.Computer then)
In step 2, you need to specify the name of the database table and of its primary key. This database table
will store information about computers. Leave the default values and click Next.
In step 3, you can define the attributes of the new document type “Computer“. These attributes are
automatically created in the CMS_Computer table and they are displayed in the editing form. Enter the
following attributes:
Name Type Allow Empty Field Caption Field Type

ComputerName Text (100) No Name TextBox
ComputerDescription Long Text No Description HTML Area
ComputerMemory Integer No Memory (MB) TextBox
ComputerProcessor Text (100) No Processor Drop-down List
Options:
Intel;Intel
AMD;AMD
ComputerPhoto Text (400) Yes Photo Image Selection
Click Next to continue to step 4. Now you can choose the document attribute that will be used as a
document name. It’s value will be displayed in the tree structure of documents in the Content section and it
will be used in site navigation. Choose the ComputerName field. Uncheck the Use versioning and
workflow box. Click Next.
In step 5, choose only the Page (Menu Item) in the listbox. It means that documents of type computer can
only be placed under some page. Click Next.
The wizard now finishes the configuration of your new document type. It generates SQL queries for
SELECT, UPDATE, INSERT, DELETE and search and it creates a default transformation.
Defining the Transformations
We will define two transformations for computer: default (detailed view) and preview (bried listing view).
Unfold the newly created document type Computer in the left treeview and select Transformations. Edit
the default transformation and replace the default transformation with following code:

<h1><%# DataBinder.Eval(Container, "DataItem.ComputerName") %></h1>

<p><img align="left" src="<%# ResolveUrl("~" + DataBinder.Eval(Container,
"DataItem.ComputerPhoto")) %>"/>
<%# DataBinder.Eval(Container, "DataItem.ComputerDescription") %></p>
<p>Memory: <%# DataBinder.Eval(Container, "DataItem.ComputerMemory") %> MB</p>
<p>CPU: <%# DataBinder.Eval(Container, "DataItem.ComputerProcessor") %></p>
Create a new ASCX transformation called preview and enter the following code of the transformation:
<div class="ProductListing">
<div class="ProductListingPadding">
<h2><a href='<%# CorporateSite.Functions.GetUrl( DataBinder.Eval(Container,
"DataItem.AliasPath")) %>'>
<%# DataBinder.Eval(Container, "DataItem.ComputerName") %>
</a></h2>
<p>
<img src='<%# ResolveUrl( "~" +
CorporateSite.Functions.UrlPathEncode(DataBinder.Eval(Container,
"DataItem.ComputerPhoto"))) %>'>
</p>
</div>
</div>
Creating a Page Template for Computer Catalog and Computer Details
We will create a similar page template to the template we created for displaying products in Step 5. Open
the CorporateSite project in Visual Studio.NET and create a new web form Computers.aspx. Open the
new web form in HTML mode and replace all text except for the first line with <%@ Page... %> directive
with following code that we used for the Products.aspx page template:

<HTML>
<HEAD>
<%=CorporateSite.Functions.GetPageTags("/home")%>
</HEAD>
<body background='<%=ResolveUrl("~/")%>images/background.gif'>
<div class="MainPageOverlay">
<uc1:header id="Header1"
runat="server"></uc1:header>
<cc1:cmstreemenu id="LeftMenu"
runat="server" SelectNodesPath="/products/%"
DisplayHighlightedItemAsLink="True"

Indentation="3"></cc1:cmstreemenu>
<br>
</div>
<div class="ProductList">
> <cc1:CMSBreadCrumbs
id="CMSBreadCrumbs1" runat="server"></cc1:CMSBreadCrumbs>
<br>
<cc1:cmsdatalist id="ProductList"
runat="server" SelectNodesClassName="cms.product" RepeatColumns="2"
CellPadding="5"
TransformationName="cms.product.preview"
SelectedItemTransformationName="cms.product.default"></cc1:cmsdatalist>
</div>
</div>
</div>
</div>
</form>
</body>
</HTML>
Now switch to the Design mode, display the properties of the CMSDataList control and set the following
properties:
• SelectNodesClassName: cms.computer
• TransformationName: cms.computer.preview
• SelectedItemTransformationName: cms.computer.default
We have changed the properties so that the control displays computers instead of products. Compile and
run the application. Go to the CMS Desk -> Development section and register the new page template
with name Computers and file name computers.aspx in the Page Templates section. Go to the
Content section and create a new page under the Products section. It will use your new Computers
page template. Then create one or two documents of type Computer under that page:
When you see the live page, it will look like this:
As you can see custom document types greatly simplify your daily job when developing a web site – the
wizard generates database table, SQL queries and you can define the editing form without programming.
Displaying them on a web site is much easier than with pure ASP.NET – you only drag and drop the
appropriate control on the web form and set a few properties – without writing a single line of code!

Step 11 - Adding The Editing Buttons

The editing buttons allow content editors create and modify documents directly from the web site that is
displayed in the edit mode (CMS Desk -> Content -> Site mode -> choose the Edit radio button). They
provide an easier and faster way of editing the content.
If you want to display editing buttons on your pages, you need to add them manually. In this example, we
will add the editing button for adding a new product in the Products section. Open page products.aspx in
Visual Studio.NET in design mode. Add the following control just under the CMSTreeMenu control:
CMSEditModeButtons
• SelectedNodeClassName: cms.product
• Description: Add New Product:
• DisplayDeleteButton: False
• DisplayEditButton: False
• DisplayNewButton: True
• DisplayProperties: False
The CMSEditModeButtons control displays one or more editing buttons in the editing mode. You can
choose which buttons should be displayed. The SelectedNodeClassName property specifies what kind of
documents should be created. The Description property specifies the escription of the block of buttons.
After you open the page in the editing mode, you should see a page like this:
The page contains also the editing button for each product. This button was not displayed using our
control, but it was already defined in the ASCX transformation cms.product.preview.

Step 12 – Creating a Multilingual Web Site

Please note: This step is optional and you can skip it if you do not plan to use multiple languages
on your site.
Kentico CMS allows you to manage web site content in multiple languages. The editors as well as visitors
can easily switch between several language versions. When you use multilingual support, there’s always
some default language and its translations. Every document must have its default culture version, but it
needn’t be translated into all languages. In this step, we will configure our single-language site for
multilingual site.
Setting up multilingual support
We need to make some changes in the site structure. The first level nodes will be culture versions and
they will contain the web content. Go to CMSDesk -> Development -> Document Templates ->
Application: CMS -> Root -> Allowed Child Templates and add the “Culture Version“ document type
among document types that can be placed under the root.
Go to the Content module and create the following culture versions under the root:
Culture Name Culture Code

English en-us
French fr-fr
German de-de
Now move all content except the culture versions under the en-us document as we will use English as the
default language. Your site structure will look like this:
Now go to the Administration module and set the Starting alias path value for all users to /en-us. It
ensures that the editors can work only with the default culture and don’t cause any inconsistency in the
document culture versions.
Open the web.config file, set the CMSUseMultilingualSupport key value to “true” and save it. As the
Files folder was moved on the disk under the en-us folder, you need to move the folder on the disk back
under the root of the web site since the URL of files and documents doesn’t contain the culture code.

Refresh the CMS Desk in your web browser. Now you will see the language selector in the main toolbar of
the Content module. Select the Home document and choose French in the language selector. You will be
asked if you want to create a new language version and if you want to pre-fill values with English content.
Leave the checkbox checked and click the button to create a new language version of the document.
Translate the menu item caption to “Introduction”. Switch to the site view and make some changes to the
french version of the text.
Adding Language Selection to Your Web Site
Now you will add a language selection to your web site. The language can be easily changed by calling
the web page with URL parameter lang=<culture code>. It means we only need to add links with URL
“?lang=<culture code>” to the header of the web site.
Open the header.ascx file in Visual Studio.NET, in the HTML mode and add the following lines just after
the Site Map link:
<br/>
<a href="?lang=en-us">English</a> <a href="?lang=fr-fr">French</a> <a
href="?lang=de-de">German</a>
Save the header ascx file and run the live web site. You should see the language selection links at the
top:
Now when you click on French, you will see the home page in French. The non-translated items will not be
displayed. You can optionally choose that the non-translated items should be displayed in the default
language (English). It can be configured on the control level (CombineWithDefaultCulture property) or
globally, by adding the following web.config parameter:
<add key="CMSCombineWithDefaultCulture" value="false"/>
As you have seen, Kentico CMS allows you to easily convert single-language web site into a multilingual
site.

Step 13 – Integrating the Newsletter Module

Kentico CMS is delivered with built-in Newsletter module. It allows you to define newsletters, edit and send
out newsletter issues, manage subscribers and get basic reports.
Creating a new newsletter in Kentico CMS
Open Kentico CMS Desk, select the /News document in the Content section and create a new document
of type Newsletter Container. Call it Newsletters. After you create it, select the new document and create
a new document of type Newsletter under it with following values:
• Newsletter name: Newsletter 1

• Confirmation text: Thank you for subscribing.
• Unsubscription text: Click here to unsubscribe.
Click OK to save the new newsletter.
Creating the subscription dialog
Open the default.aspx page, switch to the HTML mode and add the following code to the beginning of the
page:
<%@ Register TagPrefix="cc4" Namespace="Kentico.CMS.NewsletterControls"

Assembly="Kentico.CMS.NewsletterControls" %>
Add the following code below the QueryRepeater control that displays the latest news:
<cc4:NewsletterSubscriptionDialog id="NewsletterSubscriptionDialog1" runat="server"

NewsletterNodePath="/News/Newsletters/Newsletter 1" >
The NewsletterSubscriptionDialog control displays a text field with submit button. When the user enters
his/her e-mail address and clicks the button, he/she is subscribed to the newsletter with alias path
specified in the NewsletterNodePath.
Run the project and subscribe to the newsletter. You should receive a confirmation e-mail. You can also
check your subscription details in the Kentico CMS Desk -> Tools -> Newsletter where you can manage
all subscribers and their subscriptions.
Editing and sending the first newsletter issue
Go to Kentico CMS Desk -> Content -> select the /News/Newsletters/Newsletter 1 document and create a
new document of type Newsletter Issue under it. Enter the following values:
• Subject: My first issue

• Text: This is my first newsletter issue.
• Release date: select the current date and time
Click OK to save it. You should receive an e-mail within 2 minutes. If you do not receive it, please click the
/News/Newsletters/Newsletter 1 document, choose the Site mode in the main toolbar and see how many
e-mails were sent and what the last result was.

Step 14 – Creating Controls for Insertion into the Text

Kentico CMS allows you to create user controls (ascx) and insert them into the text. This feature is very
useful in the following situations:
• You need to create dynamic listing, such as „Latest news“ that can be displayed on several pages
without modifying their page templates.
• You need to insert custom dialog or functionality into the text depending on the content editor’s
choice without
Creating the User Control
Open the web project in Visual Studio and create a new user control named Top3News.ascx. Switch to its
code behind and change the class the control inherits from to
Kentico.CMS.CMSControls.InlineUserControl as shown in the following code:
[VB.NET]
Public Class Top3News
Inherits Kentico.CMS.CMSControls.InlineUserControl
[C#]
public class Top3News : Kentico.CMS.CMSControls.InlineUserControl
Switch to the HTML mode and add the following code under the <%@ Control ... %> directive:

<h2><asp:Label id="lblTitle" runat="server"></asp:Label></h2>
<cc1:QueryRepeater id="QueryRepeater1" runat="server"
QueryName="cms.news.selectlatest" TransformationName="cms.news.preview">
</cc1:QueryRepeater>
Switch to the design mode. You should see something like this:
The QueryRepeater will display the latest news. Go to the code behind and add the following code to the
Page_Load method:
[VB.NET]
lblTitle.Text = me.Parameter
[C#]
lblTitle.Text = this.Parameter;
The Parameter property provides the value of the optional parameter of the inserted control. It will contain
the title text.

Compile and run the project. Go to Kentico CMS Desk -> Development -> User controls. Click New and
register your new user control with following properties:
• Control name: Top 3 News

• Control file name: Top3News
• Control parameter name: Title
• Control description: This control displays the last 3 news.
Click OK to save it and go to the Content section. Edit the content of the Services page. Click the Insert
User Control button In the WYSIWYG editor toolbar. The Insert User Control dialog appears. Select the
Top 3 News user control and enter My Latest News in the Title parameter value.
Click OK to insert the control. The following text will be inserted in the WYSIWYG editor:
%%control:TopNews?MyLatestNews%%
Please note: you can insert such expressions directly in the text without using the Insert User Control
dialog. You can even use it in plain textboxes and textareas.
Save the page and see the live page. You will see something like this:
Please note: the user controls inserted into the text are correctly displayed only if you use Kentico CMS
controls and ASCX or XSL transformation.

Step 15 – Creating On-Line Forms

The Kentico BizForms module allows end users to create on-line forms without programming or database
knowledge. In this chapter, you will learn how easily create a simple “Contact us“ form.
Go to the Kentico CMS Desk -> Tools -> BizForms, click Add New Form and enter the following details:
• Form display name: Contact Us

• Form code name: ContactUs
• Table name: Form_ContactUs
• Send data to e-mail: Check the box
o From e-mail: use your e-mail address
o To e-mail: use again your e-mail address
• After the form is submitted: Display Text
o Display text: Thank you for contacting us.
Click OK to save the new form. Now you will define form fields. Use the Add New Field button and create
the following fields:
Caption Code name Type Settings Empty Default

Your name FullName Textbox Maximum No (uncheck
length = 100 the box)
Your e-mail Email Textbox Maximum No (uncheck
length = 100 the box)
Message Message Textarea No (uncheck
the box)
No that we have defined the form, we will insert it on the page. There are two ways how to do that:
1. Programmatically – you will insert the Kentico.Form.BizForm control on the page and its
parameters. You can find more details in Kentico CMS Developer’s Guide -> Extending Modules -
> BizForms.
2. In the text – you will insert a user control into the text (similarly as you did in the previous
chapter).
We will use the second (easier) option. Go to the Content section and edit the /Services document. In the
WYSIWYG editor, click the Insert BizForm button. The Insert BizForm dialog appears. Click your new
form Contact Us.
The following expression is inserted into the text: %%control:BizFormControl?ContactUs%%

It is then dynamically replaced with user control when the page is displayed. Save the page and switch to
the published page. You will see your new form like this:

Step 16 – Other Modules

Kentico CMS is also delivered with following modules whose usage is described in detail in Kentico CMS
Developer’s Guide -> Extending Modules:
E-Commerce
The E-commerce module allows you to integrate a shopping cart and management of orders to your web
site.
Content Staging
The Content Staging module allows you to synchronize content between several instances of Kentico
CMS for staging (preview) or development purposes.
File Import
The File Import module allows you to import specified folders and files into Kentico CMS.
On-line Gallery
The On-line Gallery module allows you to easily create galleries of images with previews and detailed
views. The images are automatically resized to specified size for faster download.
Forums
The Forums module allows you to add discussion forums to your web site. The forums can be organized
into several groups. The posts are displayed in the „conversation“ hierarchy and can be moderated.
This is the end of this tutorial. If you need more details on some topic, please see Kentico CMS
Developer’s Guide or contact us at support@kentico.com.

Ken Tico Cms Tutorial

Caricato da

Informazioni sul documento

Copyright

Formati disponibili

Condividi questo documento

Condividi o incorpora il documento

Opzioni di condivisione

Hai trovato utile questo documento?

Questo contenuto è inappropriato?

Copyright:

Formati disponibili

Ken Tico Cms Tutorial

Caricato da

Copyright:

Formati disponibili

Kentico CMS for ASP.

Kentico CMS Tutorial

1 www.kentico.com we help you deliver better web sites 1

2 www.kentico.com we help you deliver better web sites 2

Chapter 1 - Kentico CMS Installation

Deployment in Shared Hosting Environment

Installing Kentico CMS on Your Computer

Deploying a New Web Site

3 www.kentico.com we help you deliver better web sites 3

File System Permissions

Windows 2000/XP Windows Server 2003

4 www.kentico.com we help you deliver better web sites 4

Chapter 2 – Kentico CMS Overview

What is Kentico CMS

Sample Corporate Web Site

How Can I Create a Web Site Like This?

5 www.kentico.com we help you deliver better web sites 5

The following figure shows the web site lifecycle:

How Can I Edit the Content of this Web Site?

6 www.kentico.com we help you deliver better web sites 6

Chapter 3 – Content Editing

• User name: administrator

Editing an Existing Page

7 www.kentico.com we help you deliver better web sites 7

Creating a New Page

Creating a New Product

8 www.kentico.com we help you deliver better web sites 8

9 www.kentico.com we help you deliver better web sites 9

Chapter 4 – File Management

Inserting Image into Page

Restricting the type and size of files

<add key="CMSAllowedFileExtensions" value="jpg;txt;doc" />

<httpRuntime maxRequestLength="100000" />

Other file management features

<add key="CMSStoreFilesInDatabase" value="true" />

10www.kentico.com we help you deliver better web sites 10

Chapter 5 - Security Administration

Management of Users and Roles

All Content Permissions

11www.kentico.com we help you deliver better web sites 11

12www.kentico.com we help you deliver better web sites 12

Secured Web Site Areas

<add key="CMSSecuredAreas" value="/partners;/clients" />

<add key="CMSSecuredAreasLogonPage" value="~/WebLogon.aspx" />

13www.kentico.com we help you deliver better web sites 13

Chapter 6 – Versioning and Workflow

Versioning and Content Locking

14www.kentico.com we help you deliver better web sites 14

<add key="CMSUseCheckinCheckout" value="false" />

Creating Users and Roles

First, please create two users in Administration -> Users:

User Alice Murphy, the news editor:

Assign Alice to role CMS Editors.

User John Smith, the PR manager:

Defining the Workflow

Click the plus button and add the following step:

15www.kentico.com we help you deliver better web sites 15

Running the Workflow

16www.kentico.com we help you deliver better web sites 16

Chapter 7 - Development of Page Templates

Development without Visual Studio.NET

Opening the Web Project in Visual Studio.NET

Adding Kentico CMS Controls to Your Toolbox

Creating a New Page Template – SingleArticle.aspx