Create Search Page in Episerver CMS

In this article, we will cover how to create a search page in Episerver CMS.

We will also cover how to Exclude the Folder and Specific Page Type from the search.

We will also cover how to Exclude Recycle bin from the search

Search_Result.cs

Create a class named Search_Result.cs and replace it with the given below.

This class will be used to list all the pages and their content.

public class Search_Result
{
    public string PageName { get; set; }
    public string PageUrl { get; set; }
    public string PageType { get; set; }
    public string PageImage { get; set; }
}

Search.cs

Create a Model named Search.cs inside Models/Pages Folder.

using EPiServer.Core;
using EPiServer.DataAbstraction;
using EPiServer.DataAnnotations;
 
namespace HpBlogs_Site.Models.Pages
{
    [ContentType(DisplayName = "Search", GUID = "f2d7cebc-add8-438f-9d3b-175cca6ec3b7", Description = "Search Page")]
    public class Search : PageData
    {
 
    }
}

SearchController.cs

Create a controller named SearchController.cs and replace the existing code given below.

To search pages we will use EPiServer SearchClient Instance. Add all the missing references from the NuGet package.

using EPiServer.Web.Mvc;
using HpBlogs_Site.Models.Pages;
using System.Web.Mvc;
using EPiServer.ServiceLocation;
using EPiServer;
using EPiServer.Core;
using System.Linq;
using EPiServer.Find.Framework;
using EPiServer.Find;
using HpBlogs_Site.Models.Media;
using EPiServer.Find.Cms;
using EPiServer.Web.Mvc.Html;
using HpBlogs_Site.Models.Folders;
using System.Collections.Generic;
 
namespace HpBlogs_Site.Controllers
{
    public class SearchController : PageController<Search>
    {
        public ActionResult Index(Search currentPage, string q)
        {
            List<Search_Result> search_Results = new List<Search_Result>();
            if (!string.IsNullOrEmpty(q))
            {
                var repository = ServiceLocator.Current.GetInstance<IContentLoader>();
                var SiteConfigFolder = repository.GetChildren<FolderPage>(ContentReference.RootPage).Where(x => x.Name.Equals("SiteConfigFolder")).FirstOrDefault();
 
                var search_query = SearchClient.Instance.Search<IContent>().For(q)
                    .Filter(x => (x.MatchTypeHierarchy(typeof(PageData)) // To include all pages.
                    | x.MatchTypeHierarchy(typeof(Documents))) // To include MediaData which is type of Documents (Optional)
                    & !x.Ancestors().Match(SiteConfigFolder.ContentLink.ID.ToString())  // Exclude all pages from SiteConfigFolder folder
                    & !x.ContentTypeName().Match("Trash") // Exclude all pages from Trash folder
                    ).ExcludeDeleted(); 
 
                // Exclude specif page type from search
                search_query = search_query.Filter(x => !x.MatchTypeHierarchy(typeof(NewsFolder)));
 
                // Get search result.
                var search_results = search_query.Take(1000).GetContentResult();
 
                //Loop result to fetch content
                search_results.ToList().ForEach(fe =>
                {
                    var item = new Search_Result();
                    item.PageName = fe.Name;
                    item.PageUrl = Url.ContentUrl(fe.ContentLink);
                    item.PageType = fe.GetOriginalType().Name;
 
                    //Fetch Internal Content
                    if (fe.GetOriginalType().Equals(typeof(ArticlePage)))
                    {
                        var article = repository.Get<ArticlePage>(fe.ContentLink);
                        item.PageImage = Url.ContentUrl(article.PageImage);
                    }
 
                    search_Results.Add(item);
                });
 
                ViewBag.Search_Results = search_Results;
            }
 
            return View(currentPage);
        }
    }
}

Index.cshtml

Create a view named Index.cshtml inside Views/Search Folder and add the code given below.

This is just an example to loop the results and display them on the page. Implement this as per your requirement

@using HpBlogs_Site.Controllers
@{
 
    if (ViewBag.Search_Results != null)
    {
        List<Search_Result> search_Results = ViewBag.Search_Results as List<Search_Result>;
 
        if (search_Results != null)
        {
            <ul>
                @foreach (var item in search_Results)
                {
                    <li>
 
                        <a href="@item.PageUrl">@item.PageName</a>
 
                        @if (!string.IsNullOrEmpty(item.PageImage))
                        {
                            <img src="@item.PageImage" />
                        }
 
                    </li>
                }
            </ul>
        }
    }
}