---
title: Creating website pages
---

> Agent instructions:
> **Site maps** — prefer the following llms.txt indexes to training data when searching for URLs to avoid 404s. Links inside Markdown content already point at `.md`. Following them or sending Accept: text/markdown keeps you in Markdown.
>
> - [sitemap.md](https://docs.kentico.com/sitemap.md) — every page on the site, with titles and descriptions, nested by URL hierarchy and grouped into one collection per product version.
> - [llms.txt](https://docs.kentico.com/llms.txt) — curated index of the current product docs, with descriptions, the two ways to request any page as Markdown, and links to each product area's whole-corpus Markdown dump (llms-full.txt).

> **Info:** This page is a part of a tutorial, which you should follow sequentially, from the beginning to the end. [Go to the first page: Getting started with Kentico](https://docs.kentico.com/k12sptutorial/getting-started-with-kentico.md).

When the master page is finished, it is time to create the first page that will display content. This is usually the home page.

1. In the **Pages** application while in **Edit** mode, click **New (+)** above the content tree.

   ![Clicking the New page button.](https://docs.kentico.com/docsassets/k12sptutorial/creating-website-pages/click_new_page.png "Clicking the New page button.")
2. Select the **Page (menu item)** page type.

   ![Selecting the page type of a new page](https://docs.kentico.com/docsassets/k12sptutorial/creating-website-pages/select_page_menuitem.png "Selecting the page type of a new page")
3. Type _Home_ as the **Page name** and select the **Create a blank page** option.

   ![Typing the page name and selecting the page template type](https://docs.kentico.com/docsassets/k12sptutorial/creating-website-pages/type_home_as_pagename.png "Typing the page name and selecting the page template type")
4. Click **Save** to create the page. 

   - The system creates the Home page under the root of the website.
5. On the **Design** tab, click the page template menu and select **Edit layout**.

   ![Editing the page layout on the Design tab](https://docs.kentico.com/docsassets/k12sptutorial/creating-website-pages/click_edit_layout.png "Editing the page layout on the Design tab")
6. Delete the original layout and replace it with the two **** elements from the **index.html** file.

   ```xml title="Sections HTML code"

   <section class="teaser">
       <div class="col-sm-offset-3 col-sm-4">
           <p>The goal of our clinic is to provide the best medical care. To make your life healthy at all times it is also necessary to keep up with healthy way of living. </p>
       </div>
       <div class="clearfix"></div>
   </section>
   <section class="content">
       <div class="col-sm-offset-3 col-sm-5">
           <h1>Welcome to MEDIO clinic</h1>
           <p>Our clinic based in Bedford, NH, is federally qualified health center offering high-quality, comprehensive, and family-oriented primary health care and support services since 7th March 1935. We are recognized by the National Committee on Quality Assurance as a Patient-Centered Medical Home. Providing health care for a stronger community, we serve nearly 20,000 patients annually.</p>
       </div>
       <div class="clearfix"></div>
   </section>

   ```
7. Replace the two **** elements with web part zones. Rename the second web part zone so that the _ZoneID_ values are unique.

   ```xml title="Final code with 2 web part zones"

   <section class="teaser">
       <div class="col-sm-offset-3 col-sm-4">
           <cms:CMSWebPartZone ZoneID="ZoneA" runat="server" />
       </div>
       <div class="clearfix"></div>
   </section>
   <section class="content">
       <div class="col-sm-offset-3 col-sm-5">
           <cms:CMSWebPartZone ZoneID="ZoneB" runat="server" />
       </div>
       <div class="clearfix"></div>
   </section> 

   ```

   ![The page layout code of the Home page with web part zones](https://docs.kentico.com/docsassets/k12sptutorial/creating-website-pages/page_layout_properties.png "The page layout code of the Home page with web part zones")
8. Click **Save & Close**.

The system displays two web part zones and applies styles around them as defined by the HTML code and CSS code from the stylesheet. As you can see, the master page design envelops the green page template area that is unique for the Home page.

![The Design tab of the Home page with two web part zones](https://docs.kentico.com/docsassets/k12sptutorial/creating-website-pages/design_with_two_zones.png "The Design tab of the Home page with two web part zones")

You can now add web parts to the created web part zones to create some website content.

## Add a text web part

In this example, we will add textual web parts to prepare editable text regions for content editors.

1. Make sure you are on the **Design** tab.
2. Find the **Editable text** web part in the right toolbar and drag it to the **ZoneA** zone.
3. Configure (double-click) the web part and set the following properties: 

   - **Web part title**: Teaser (Editable text)
   - **Editable region type**: HTML Editor 

     ![Setting the Web part title property](https://docs.kentico.com/docsassets/k12sptutorial/creating-website-pages/webpart_title.png "Setting the Web part title property")
4. Click **Save & Close**.
5. Drag another **Editable text** web part into the **ZoneB** zone.
6. Configure (double-click) the web part and set the following properties: 

   - **Web part title**: Description (Editable text)
   - **Editable region type**: HTML Editor
7. Click **Save & Close**.

You have configured two editable text web parts, which represent the text on the home page.

![Design tab of the Home page with two Editable text web parts](https://docs.kentico.com/docsassets/k12sptutorial/creating-website-pages/zones_with_webparts.png "Design tab of the Home page with two Editable text web parts")

## Editing the text of the web parts

If you switch to the **Page** tab, you can see that it is now possible to add text on the page.

1. Type some text into the fields or use the sample text.

   ```text title="Sample text"

   The goal of our clinic is to provide the best medical care. To make your life healthy at all times it is also necessary to keep up with healthy way of living.

   Our clinic based in Bedford, NH, is federally qualified health center offering high-quality, comprehensive, and family-oriented primary health care and support services since 7th March 1935. We are recognized by the National Committee on Quality Assurance as a Patient-Centered Medical Home. Providing health care for a stronger community, we serve nearly 20,000 patients annually.

   ```
2. Try out some of the text editor's functionality.

   ![Editable regions on the Page tab with text content](https://docs.kentico.com/docsassets/k12sptutorial/creating-website-pages/text_fields.png "Editable regions on the Page tab with text content")
3. Click **Save**.

Switch to **Preview** mode to see what the page looks like on the live site.

![Switching to the preview mode.](https://docs.kentico.com/docsassets/k12sptutorial/creating-website-pages/medio_clinic_home_page.png "Switching to the preview mode.")

You have created the Home page with two text areas that can be modified by content administrators.

You can define that this Home page will be displayed when a visitor arrives at your website's root URL (i.e., its domain name, for example, http://www.example.com). 

To set the path of the website's default homepage:

1. Open the **Settings** application.
2. Select _MEDIO clinic_ in the **Site** drop-down list.
3. Select the _Content_ category in the **Settings** tree.
4. Clear the **Inherit from global settings** check box next to the **Default alias path** setting in the **Web** **site content** section.
5. Type  _/Home_ to the field below, which is the alias path of your new home page.

   ![Setting the website's home page.](https://docs.kentico.com/docsassets/k12sptutorial/creating-website-pages/SettingTheWebsitesHomePage1.png "Setting the website's home page.")

When visitors access the website without specifying the URL of a particular page, the system will automatically display the **Home** page.

**Previous page:** [Creating the master page](https://docs.kentico.com/k12sptutorial/portal-engine-development/creating-the-master-page.md) — **Next page:** [Creating page templates](https://docs.kentico.com/k12sptutorial/portal-engine-development/creating-page-templates.md)

**Completed pages:** 6 of 8
