---
title: Developing the Search page (ASPX)
---

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

Kentico allows users to perform index-based searches through all page content, as well as other types of data. The following instructions describe how to add a basic search page to your website.

## Configuring search fields for the Computer page type

First, set up the search options for the **Computer** page type that you created for the [Products section](https://docs.kentico.com/k81tutorial/walkthrough-creating-a-new-site-using-the-portal-engine/developing-the-products-section/defining-a-new-page-type.md).

1. Open the **Page types** application.
2. Edit () the **Computer** page type.
3. Switch to the **Search fields** tab.
4. Select the **Search is enabled** check box.
5. Set the **Image field** to _**ComputerImage.**_
6. Click **Save.**

Product pages are now searchable.

![Configuring search field settings for a page type](https://docs.kentico.com/docsassets/k81tutorial/developing-the-search-page-aspx/Search_Fields.png "Configuring search field settings for a page type")

## Creating a smart search index

Before you can use the search, you need to add a smart search index covering the website's pages.

1. Open the **Smart search** application.
2. Click **New index**.
3. Fill in the following details for the search index:
   - **Display name**: My website - Pages
   - **Index type**: Pages
   - **Analyzer type**: Standard
   - **Stop words**: (default)
4. Click **Save**. The index's editing interface opens.
5. Open the **Indexed content** tab and click **Add allowed content**.
6. Type _**/%**_ into the **Path** field and click **Save**. This ensures that the index includes all pages on the website.
7. Switch to the **Sites** tab and assign the index to **My website**.
8. Switch to the **Cultures** tab and choose the default culture of your site (typically English - United States).
9. Open the **General** tab and click **Rebuild**.

Once the system rebuilds the index, you can start using it on the website. The **Index info** section displays the current status of the index and other relevant information.

![Creating a search index for the site's pages](https://docs.kentico.com/docsassets/k81tutorial/developing-the-search-page-aspx/MySite_Search_Index.png "Creating a search index for the site's pages")

## Preparing the ASPX source files for the search page

1. Edit your web project in Visual Studio
2. Right-click the **CMSTemplates/MySite** folder in the Solution Explorer and click **Add -> Add New Item**.
3. Create a **Web Form** named _**SearchPage.aspx**_ and check **Select master page**.
4. Click **Add** and choose the _**MyMaster.master**_ page from the **CMSTemplates/MySite** folder.
5. Add the following directive to the beginning of the page code:

   ```html

   <%@ Register src="~/CMSWebParts/SmartSearch/SearchDialogWithResults.ascx" tagname="SearchDialogWithResults" tagprefix="cms" %>

   ```

   > **Info:** This registers the **Smart search dialog with results** web part as a user control for use on the ASPX template.
6. Copy the following code inside the **** element of the page:

   ```html

   <h1>Search</h1>

   <cms:SearchDialogWithResults ID="SearchDialogWithResults1" runat="server" TransformationName="cms.root.smartsearchresultswithimages" Indexes="MyWebsite-Documents" />

   ```

   > **Info:** This adds a heading and the user control (web part) that provides search functionality and displays the results. The control uses the **My website - Pages** search index created in the previous section, which is assigned through the **Indexes** property (identified by the index code name).
7. Switch to the code behind of the search page (**SearchPage.aspx.cs**) and add a reference to the **CMS.UIControls** namespace:

   ```csharp

   using CMS.UIControls;

   ```
8. Change the class definition so that it inherits from the **TemplatePage** class:

   ```csharp

   public partial class CMSTemplates_MySite_SearchPage : TemplatePage

   ```
9. Save the search page files.

## Registering the page template

The source files of the search page are ready. Now you need to register the page template in Kentico.

1. Switch to the Kentico administration interface in your browser.
2. Open the **Page templates** application.
3. Select the **My website** category.
4. Click **New template** and type _**Search page**_ into the **Template display name** field.
5. Click **Save**.
6. Set the following values on the **General** tab:
   - **Template type**: ASPX page
   - **File name**: \~/CMSTemplates/MySite/SearchPage.aspx
7. Click **Save**.
8. Switch to the **Sites** tab and assign the page template to **My website**.

## Adding the search page

1. Open the **Pages** application.
2. Select the root of the content tree (**My website**).
3. Click **New** ().
4. Choose the **Page (menu item)** page type.
5. Type in _**Search**_ as the **Page name** and choose the **Use existing page template** option. Select the **My website** category and the **Search page** template.
6. Click **Save** to create the page.
7. Drag the Search page to the end of the content tree.

To try out the search functionality, view the /Search page in **Preview** mode. Type _**PC**_ into the **Search for** box and click **Search**.

![Searching the website](https://docs.kentico.com/docsassets/k81tutorial/developing-the-search-page-aspx/Search_Preview.png "Searching the website")

When you click a search result, the system redirects you to the corresponding page.

> **Tip:** **Modifying the format of the search results**
>
> If you prefer a different design of the search results, you can modify the format by editing the **SmartSearchResults** (or **SmartSearchResultsWithImages**) transformation in **Page types -> Root -> Transformations**.
