simple search page in umbraco 9cloud - Using Umbraco and getting started

Peter van Geffen 54 posts 290 karma points

May 05, 2022 @ 13:10

Simple search page in Umbraco 9/Cloud

I tried multiple options i found here and there, but can't get a working example.

This is our Umbraco V8 search:

@{
    var searchQuery = Request.QueryString["q"];
}
<form action="@Model.Url" method="GET" id="search" class="block-form">
    <input type="text" name="search" placeholder="@Umbraco.GetDictionaryValue("Search.Placeholder")" class="form-control searchfield" value="@searchQuery" />
    <button type="submit" class="">Zoeken</button>
    @if (!string.IsNullOrWhiteSpace(searchQuery)){
        var results = Umbraco.ContentQuery.Search(searchQuery, string.Empty);
        @*Met uitsluiting Documenttype*@
        @*var results = Umbraco.ContentQuery.Search(searchQuery, string.Empty).Where(x=>x.Content.ContentType.Alias !="contact");*@
        long resultCount = results != null && results.Any() ? results.Count() : 0;
        @Html.Raw(string.Format(Umbraco.GetDictionaryValue("Search.Results"), resultCount, searchQuery))
        if (resultCount > 0){
            foreach (var result in results){
                <div class="post-preview">
                    <a href="@result.Content.Url">
                        <h4 class="post-title">
                            @(result.Content.HasProperty("title") && result.Content.HasValue("title") && !string.IsNullOrWhiteSpace(result.Content.Value<string>("title")) ? result.Content.Value("title") : result.Content.Name)
                        </h4>
                    </a>
                </div>
                <hr />
            }
        }else{
            <p>Geen resultaten gevonden</p>
        }
    }    
</form>

This won't work in Umbraco V9/Cloud I tried code from:

Can someone point me in the right direction?

Copy Link

Paul Seal 524 posts 2889 karma points MVP 7x c-trib

May 05, 2022 @ 14:14

Hi I have implemented search in my starter kit which works on v9.

Here is the code in the Search page View.

@inherits Umbraco.Cms.Web.Common.Views.UmbracoViewPage<ContentModels.Search>

@using Clean.Core.Models.ViewModels
@using ContentModels = Umbraco.Cms.Web.Common.PublishedModels
@inject Umbraco.Cms.Core.IPublishedContentQuery publishedContentQuery

@{ 
    Layout = "master.cshtml";
    var searchQuery = Context.Request.Query["q"]; 
}

@await Html.PartialAsync("~/Views/Partials/pageHeader.cshtml", new PageHeaderViewModel(Model.Name, Model.Title, Model.Subtitle, Model.MainImage))

<div class="container">
    <form action="@Model.Url()" method="GET" id="search">
        <div class="row">
            <div class="col-lg-8 col-md-10 mx-auto">
                <div class="form-group controls">
                    <input type="text" class="form-control col-xs-6" placeholder="@Umbraco.GetDictionaryValue("Search.Placeholder")" name="q" value="@searchQuery" />
                </div>
            </div>
            <div class="col-lg-8 col-md-10 mx-auto my-3">
                <div class="form-group">
                    <button class="btn btn-primary search-button float-end">@Umbraco.GetDictionaryValue("Search.SearchButton") <i class="fa fa-search"></i></button>
                </div>
            </div>
            <div class="col-lg-8 col-md-10 mx-auto">
                @if (!string.IsNullOrWhiteSpace(searchQuery))
                {
                    var results = publishedContentQuery.Search(searchQuery);
                    long resultCount = results != null && results.Any() ? results.Count() : 0;
                    @Html.Raw(string.Format(Umbraco.GetDictionaryValue("Search.Results"), resultCount, searchQuery)) if (resultCount > 0)
                    {
                        foreach (var result in results)
                        {
                            <div class="post-preview">
                                <a href="@result.Content.Url()">
                                    <h2 class="post-title">
                                        @(result.Content.HasProperty("title") && result.Content.HasValue("title") && !string.IsNullOrWhiteSpace(result.Content.Value<string>("title")) ? result.Content.Value("title") : result.Content.Name)
                                    </h2>
                                    @if (result.Content.HasProperty("subtitle") && result.Content.HasValue("subtitle") && !string.IsNullOrWhiteSpace(result.Content.Value<string>("subtitle")))
                                    {
                                    <h3 class="post-subtitle">@(result.Content.Value<string>("subtitle"))</h3>}
                                </a>
                                @if (result.Content.HasProperty("authorName") && result.Content.HasValue("authorName") && !string.IsNullOrWhiteSpace(result.Content.Value<string>("authorName"))
                                    || (result.Content.HasProperty("articleDate") && result.Content.HasValue("articleDate") && result.Content.Value<DateTime>("articleDate") > DateTime.MinValue))
                                {
                                    <p class="post-meta">
                                        @Umbraco.GetDictionaryValue("Article.Posted")
                                        @if (result.Content.HasProperty("authorName") && result.Content.HasValue("authorName") && !string.IsNullOrWhiteSpace(result.Content.Value<string>("authorName")))
                                        {
                                            @Umbraco.GetDictionaryValue("Article.By")@Html.Raw("&nbsp;")@(result.Content.Value<string>("authorName"))
                                        }

                                        @if (result.Content.HasProperty("articleDate") && result.Content.HasValue("articleDate") && result.Content.Value<DateTime>("articleDate") > DateTime.MinValue)
                                        {
                                            @Umbraco.GetDictionaryValue("Article.On")@:&nbsp;@(result.Content.Value<DateTime>("ArticleDate").ToString("MMMM dd, yyyy"))
                                        }
                                    </p>
                                }
                            </div> 
                            }
                        <hr>
                    }
                }
            </div>
        </div>
    </form>
</div>

Here is a link to the view code in the starter kit repo

I hope this helps

Paul

Copy Link

Peter van Geffen 54 posts 290 karma points

May 06, 2022 @ 07:57

Thnx mate! With some adjustments it works perfect.

Copy Link

Jack Taylor 16 posts 107 karma points

Dec 10, 2022 @ 02:06

Is there anyway to get this working in v10, this line is causing an error: var results = publishedContentQuery.Search(searchQuery);

Copy Link

Huw Reddick 1929 posts 6717 karma points MVP 2x c-trib

Dec 10, 2022 @ 20:20

Hi Jack,

What error is it giving you exactly?

Copy Link

Jack Taylor 16 posts 107 karma points

Dec 12, 2022 @ 17:00

Hi Huw, thanks for getting back to me. Sorry I should've included at the time but I'm having an issue on Umbraco Cloud logs where the current days logs never load. Error message in logs: error CS0103: The name publishedContentQuery does not exist in the current context

Copy Link

Huw Reddick 1929 posts 6717 karma points MVP 2x c-trib

Dec 12, 2022 @ 19:23

Did you add this at the top of your view page?

@inject Umbraco.Cms.Core.IPublishedContentQuery publishedContentQuery

Copy Link

Jack Taylor 16 posts 107 karma points

Dec 12, 2022 @ 22:59

I did, here is my full code:

@using Umbraco.Cms.Web.Common.PublishedModels;
@inherits Umbraco.Cms.Web.Common.Views.UmbracoViewPage<ContentModels.Search>
@using ContentModels = Umbraco.Cms.Web.Common.PublishedModels
@using Clean.Core.Models.ViewModels
@inject Umbraco.Cms.Core.IPublishedContentQuery publishedContentQuery
@{
    Layout = "MainNavigation.cshtml";

    var searchQuery = Context.Request.Query["query"];  
}
@if (!string.IsNullOrWhiteSpace(searchQuery)){
    var results = publishedContentQuery.Search(searchQuery);
}
<header>
    <div class="container">
        <div class="row">
            <div class="col-12">
                <form action="@Model.Url()" method="Get">
                    <fieldset>
                        <input type="text" class="search-box" placeholder="Search..." name"query"></input>
                        <button class="search-button">Search</button>
                    </fieldset>
                </form>
            </div>
        </div>
    </div>
</header>
<section>
    <div class="container">
        <div class="row">
            <div class="col-12">
                <h1>Search results go here</h1>

            </div>
        </div>
    </div>
</section>

Copy Link

Jack Taylor 16 posts 107 karma points

Dec 12, 2022 @ 23:00

I'm also not using anything else from the start kit repo and started from a fresh Umbraco Cloud install, could this be the problem?

Copy Link

Huw Reddick 1929 posts 6717 karma points MVP 2x c-trib

Dec 13, 2022 @ 10:42

Odd, I'm not using cloud, but the code works fine in umbraco 10

Copy Link

Jack Taylor 16 posts 107 karma points

Jan 11, 2023 @ 16:06

Does anyone know how I can exclude certain pages from this search? I've copied the above which is great :) however it has content nodes like my site settings node and certain content nodes I don't want to appear in the search.

I've added a "Exclude from search" toggle property to each node, is there anyway in the code above I can exclude these nodes from being returned where this value is true?

Copy Link

Jack Taylor 16 posts 107 karma points

Jan 19, 2023 @ 17:20

Got it:

//Filter the results to only show items where hideFromSearch is not true
results = results.Where(x => !x.Content.HasProperty("hideFromSearch") || !x.Content.Value<bool>("hideFromSearch"));

Copy Link

Jack Taylor 16 posts 107 karma points

Jan 11, 2023 @ 15:43

The issue was with my injections, once I got my error logs working I worked out the correct injections to use where:

@using Umbraco.Cms.Web.Common.PublishedModels;
@inherits Umbraco.Cms.Web.Common.Views.UmbracoViewPage<ContentModels.Search>
@using ContentModels = Umbraco.Cms.Web.Common.PublishedModels
@inject Umbraco.Cms.Core.IPublishedContentQuery publishedContentQuery

Copy Link

is working on a reply...

Flag this post as spam?

Simple search page in Umbraco 9/Cloud